Photoshop의 웹 사이트 헤더
이 자습서에서는 Photoshop에서 웹 사이트 헤더를 작성합니다.아르 자형 플래시로 애니메이션 할 것입니다아르 자형 촉매TM. 애니메이션은 빈 배경으로 시작하고 디자인 요소는 슬라이드 인하여 눈앞에 헤더를 "빌드"합니다. 애니메이션은 "로드시"시작되도록 프로그래밍되며 몇 초 동안 지속됩니다. 이 웹 사이트 헤더는 사실 인사말 카드 사업을위한 것입니다.

첫 번째 단계는 Photoshop에서 헤더를 작성하는 것입니다. Flash Catalyst에서 작업하기 위해 각 디자인 요소를 자체 레이어에 배치합니다. 보시다시피 6 개의 디자인 요소가 있습니다.

1. 배경
2. 머리글 너비의 하단 막대
3. 회사 명
4. 생일 카드
5. 호박 노트 카드
6. 크리스마스 카드

  1. Photoshop에서 새 프로젝트를 시작하겠습니다. 너비를 1000 픽셀로, 높이를 225 픽셀로, 배경을 투명하게 설정하십시오. 이 크기는 웹 페이지 상단에 잘 맞습니다.

  2. 애니메이션의 시작 부분에 표시되는 유일한 요소는 흰색 배경입니다. 선택한 배경색으로 이미지의 첫 번째 레이어를 채 웁니다. 레이어 패널에서이 레이어의 이름을 "배경"으로 바꿉니다.

  3. 음영 처리 된 가장자리를 만들기 위해 내부 그림자 레이어 스타일을 사용했습니다. 배경 레이어를 두 번 클릭하고 내부 그림자 옆의 확인란을 선택하십시오. 거리 및 초크를 0으로 설정하고 크기를 49로 설정하십시오.

  4. 다음으로 Stroke Layer Style을 사용하여 이미지 주위에가는 테두리를 추가합니다. Color를 갈색 (# 6e674f)으로, Size를 2로, Position을 Inside로 설정했습니다.

    다음으로 카드를 추가하겠습니다. 인사말 카드의 크기를 230 x 175 픽셀로 줄였습니다. 이렇게하면 헤더 크기에 비례하여 유지됩니다.

  5. 호박 카드를 복사하여 헤더에 붙여 봅시다. 새 레이어의 이름을 "호박"으로 지정하십시오. 편집 – 자유 변형을 클릭하여 카드를 약간 오른쪽으로 회전합니다. 호박 레이어를 클릭하고 기본 설정을 유지하면서 그림자 레이어 스타일을 적용하십시오.

  6. 생일 카드와 크리스마스 카드 모두 마지막 단계를 반복하십시오.

    다음으로 헤더 하단에 막대를 추가합니다. 이 바 뒤에 카드를 집어 넣어 선반에 카드를 모방합니다.

  7. 레이어 패널에 새 레이어를 추가하고 이름을 "Bar"로 지정하십시오.

  8. 직사각형 선택 윤곽 도구를 사용하여 갈색 테두리 안쪽의 머리글 아래쪽 영역을 선택합니다. 바의 색상을 선택하고이 색상으로 선택을 채 웁니다.

  9. 레이어를 두 번 클릭하고 배경 레이어와 마찬가지로 획 레이어 스타일을 추가하십시오.

  10. 수평 유형 도구를 클릭하고 업체 이름의 글꼴을 선택하십시오. 테두리 색상과 동일한 갈색을 사용했습니다. 머리글 왼쪽에 업체명을 입력합니다.

  11. 이 단계는 선택 사항입니다. 텍스트를 래스터 화합니다. 텍스트 레이어를 마우스 오른쪽 버튼으로 클릭하고 메뉴에서 래스터 화 유형을 선택하십시오.

  12. Photoshop .psd 형식으로 프로젝트를 저장하십시오.


저작권 2018 Adobe Systems Incorporated. 판권 소유. Adobe 제품 스크린 샷은 Adobe Systems Incorporated의 허가하에 재 인쇄되었습니다. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, 플래시, ActionScript, 불꽃 놀이, 참여, 사로 잡기, 플래시 촉매 및 플래시 용지 는 미국 및 / 또는 기타 국가에서 사용되는 Adobe Systems Incorporated의 [a] 등록 상표 또는 상표입니다.


비디오 지침: 워드프레스 Elementor 배너가 들어간 SNS 사이트헤더 메뉴바 만들기 동영상강좌 (할 수있다 2024).