포토샵에서 디자인 웹 2.0 인터페이스
아래의 튜토리얼을 이해하면 해당 기술을 이해할 수 있으며 웹 사이트에 대한 그래픽 사용자 인터페이스를 그릴 수 있습니다.. 측면 탐색, 버튼, 머리말, 예를 들면. 모든 웹 2.0 스타일.
새로운 캔버스를 실행하십시오. 어떤 크기. 450x300px보다 큰 것이 좋습니다. 선택 둥근 사각형 도구 위 그림과 같이 큰 직사각형을 그립니다..
Rounded Rectangular 레이어를 두 번 클릭하여 블렌딩 옵션. 다음 스타일 설정 변경.
그림자
불투명도 : 31 % 거리 : 1px 스프레드 : 0 % 크기 : 5px
경사와 엠 보스
깊이 : 100 % 크기 : 0px 연화 : 0px
그라디언트 오버레이
Gradiant를 두 번 클릭하고 다음 중지 지점을 설정하십시오. 위치 : 0 %, # 1378cd 위치 : 100 % # 4da5f0
행정
크기 : 5px 위치 : 내부 색상 : # 54abf6
텍스트, 태그 라인, URL 등을 삽입 해 봅시다. 중간에 배치하고 로고를 나중에 왼쪽에 배치 할 수 있도록 오른쪽으로 정렬하십시오. 텍스트를 스타일링합시다. 나는 Lucida Sans Unicode를 사용하고있다. 55pt; 부드러운; 문자 추적 (글자 간격)은 -120입니다. 텍스트 레이어를 두 번 클릭하고 다음을 설정하십시오. 블렌딩 옵션.
그라디언트 오버레이
Gradiant를 두 번 클릭하고 다음 중지 지점을 설정하십시오. 위치 : 0 %, # 9ec7eb 위치 : 100 % ecf6ff
그런 다음 텍스트의 왼쪽에 로고를 삽입해야합니다. 로고를 나타 내기 위해 반경 5px의 둥근 사각형을 사용하겠습니다. 여기에 블렌딩 옵션 둥근 사각형의 설정.
내부 그림자
불투명도 : 45 % 거리 : 0px 크기 : 43px;
경사와 엠 보스
깊이 : 100 % 크기 : 0px 부드럽게 : 0px 하이라이트 모드 불투명도 : 50 % 그림자 모드 불투명도 : 100 %
그라디언트 오버레이
Gradiant를 두 번 클릭하고 다음 중지 지점을 설정하십시오. 위치 : 0 % # 0e2f4a 위치 : 47 % # 001a31 위치 : 48 % # 002545 위치 : 100 % # 0f4b7f
행정
크기 : 5px Gradiant를 더블 클릭하고 다음 중점을 설정하십시오. 위치 : 0 % # 1468af 위치 : 100 % # 50abf8
조금 광택있는 효과를 부여합시다. 보류 CTRL 둥근 사각형을 왼쪽 클릭 레이어 축소판. 둥근 사각형을 선택하면 사각형 마키 도구, 보류 ALT 선택된 영역의 후반부를 드로잉 (Draw-Out)한다. 위 이미지와 같습니다..
새 레이어를 만듭니다. 모든 레이어의 맨 위에 놓 이도록 위로 드래그하십시오. 선택한 부분을 흰색으로 채 웁니다 [#ffffff]; 불투명도를 15 %로 변경하십시오..
자습서는 여기서 끝날 것입니다. 이 디자인을 어떻게 활용할 것인지는 전적으로 귀하에게 달려 있습니다. 크기와 색상을 약간 변경하여 웹 머리글 또는 단추로 사용할 수 있습니다. 몇 가지 예가 있습니다..
웹 사이트 헤더
웹 사이트 버튼
