인터넷 사랑/사진 아바타

[포토샵] 입체적인 동그란 웹버튼을 만들기

별을 그리다 2006. 3. 27. 23:19

 
강좌에 사용된 버전은 포토샵 CS 이며, 응용가능한 버전은 버전공통 입니다.
제작할 버튼 크기의 신규 파일을 만듭니다.
상단 메뉴 File / New 를 클릭하면 New 대화 상자가 나타납니다.
Preset 항목의 Width 와 Heigth 를 각각 100pixels 로 설정, Resolution 72pixels/inch 로 설정한 후 OK버튼을 클릭하면, 가로,세로 100 픽셀 크기의 새로운 도큐멘트가 생성됩니다.
툴박스에서 원형 선택 툴을 클릭한 후
메뉴바 View / Rulers를 클릭하여 도큐멘트에 눈금자를 표시되게 합니다.
커서를 정확히 가운데 위치시키고 Shift 키와 Al t키를 누른채로 드래그하여 정원의 선택 영역을 그립니다.
툴박스 하단에 Switch Foreground and Background 버튼을 클릭하여 전경색과 배경색을 바꿉니다. Set background color 을 클릭하여 좀더 옅은 검정을 선택합니다.
툴박스에 그라디언트 툴을 선택한 후 옵션바에서 Radial Gradiant 버튼을 선택합니다.
그림과 같은 지점(왼쪽에서 오른쪽으로 대각선을 그리며 드래그)을 클릭한 후 드래그를 합니다.

보기와 같이 그라디언트 색상이 입혀 졌나요? 
메뉴바에서 Select / Transform Selection 명령을 클릭하면 이미지에 조절점이 생성됩니다.

Shift 키와 Alt 키를 누른채 안쪽으로 약간 드래그하여 선택영역의 크기를 줄여준후 엔터키를 눌러서 변형을 적용합니다.
메뉴바에서 Edit / Transform / Roate 180° 를 클릭하면 선택 영역이 180도 회전을 합니다.
선택 영역이 180도 회전되어 오목한 효과가 적용되는 것을 볼 수 있습니다.
다시 Select / Transform Selection 메뉴를 클릭하여 선택 영역의 크기를 조금 줄여봅니다.
그림과 같이 크기를 줄인 후 엔터키를 눌러서 변형을 적용합니다.
또, Edit / Transform / Rotate 180° 명령을 적용하여 선택 영역을 180도 회전 시킵니다.
보기와 같이 입체적인 효과의 동그란 버튼이 완성되었나요?.
만일, 버튼의 색상을 바꾸고 싶다면 아래 과정을 마저 따라합니다.
중심부분의 색상에 변화를 주려면 위와 같이 중심 부분이 선택되어 있는 상태에서, 상단 메뉴 Image / Adjustments / Variations 를 클릭하면 아래와 같은 Variations 대화 상자가 나타납니다.
More Green 색상을 클릭하고 한번 더 클릭하면 좀더 밝은 색상의 그린색상이 됩니다. OK버튼을 클릭합니다.
 
작업 화면의 아무곳이나 클릭하여 선택 영역을 해제합니다.
지금까지, 입체효과의 원형 버튼을 만드는 방법을 알아 보았는데요~.
그라디언트 색상과 선택영역의 180도 회전이 주요 핵심이라 할 수 있겠습니다.