본문 바로가기
포토샵

[포토샵 강좌]포토샵 초간단 아쿠아버튼 만들기

by 세상밖으로  2010. 5. 25.
반응형

[포토샵 강좌]포토샵 초간단 아쿠아버튼 만들기


 

여기저기 많이 쓰이는 아쿠아버튼을 만들어 보겠습니다. 왠만한 홈페이지나 어플리케이션등에서 흔히 볼수 있죠. 많이 쓰이니만큼 빨리 만드는 것도 하나의 관건일 것입니다. 그럼 차근차근 한단계씩 따라해보죠~ 완전 간단함~!



1. 원형도형툴로 원을 그린다.





2. 레이어팔레트에서 레이어추가 버튼을 클릭~ 새로운 레이어를 하나 만든다.





3. 원형선택툴로 추가된 레이어 위에 타원모양으로 영역을 잡아준다.





4. 그라데이션툴을 선택하고 '투명-흰색' 으로 그라데이션을 설정 후 위에서 선택한 타원영역에 그림과 같이 채워준다.





5. 선택영역을 해제한 후(Ctrl + D) 필터로가서 가우시안 블러를 선택한다.





6. 가우시안 블러의 수치를 알맞게 조절해준다. (흐림의 정도는 직접 보면서 알맞게 조절해주세용~)





7. 가우시안 블러가 적용된 후의 모습.





8. 또다시 레이어 하나를 추가한다.





9. 두번째 레이어에도 원형선택툴을 이용하여 타원모양의 영역을 잡아준다.





10. 마찬가지로 그라데이션툴을 이용하여(투명-흰색) 두번째 레이어에서 선택한 영역을 그림과 같이 채워준다.





11. 선택영역을 해제(Ctrl + D) 한 후의 완성된 모습.




자~ 완성 됐습니다. 어때요? 완전 간단하죠? 레이어 3장으로 끝내는 아쿠아 버튼입니다. 레이어를 더 줄일 수 있지만 이렇게 하는 이유는 밑에서 설명드릴께요. 먼저 아쿠아 버튼을 만들때 중요한 점 몇가지만 집어 드리겠습니다.

1. 첫번째 선택영역을 잡은 레이어에서 그라데이션툴을 이용하여 선택영역을 채워주었죠. 이때 그라데이션 방향은 밑에가 흰색, 위에가 투명입니다.

2. 두번째 선택영역을 잡은 레이어에서는 이와 반대로 밑에가 투명, 위에가 흰색입니다.


첫번째 레이어는 아래로 투과된 빛을 표현하는 것이기 때문에 뿌옅게 흩어져야겠구요. 두번째 레이어는 빛이 반사되는 하이라이트부분이므로 선명하게 표현해야겠죠? 물론 똑같이 블러로 처리해도 관계는 없습니다만. 그렇게 하실려면 전체적인 버튼이미지를 봐가면서 가우시안블러를 조절해야겠습니다.

그럼 아까 말씀드린대로 왜 3장의 레이어를 썼는지 설명드릴께요. 결론적으로 말하자면 쉽게 아쿠아버튼의 색상을 바꿀 수 있기 때문입니다.


1. 도형툴로 그린 레이어에는 밑의 그림처럼 표시가 되는데요. 빨간 네모로 표시한 부분을 더블클릭하면 색상을 선택할 수 있는 창이 나옵니다.





2. 색상선택창에서 원하는 색상을 선택합니다. 다하셨으면 'OK' 클릭~





3. 색상이 변경된 아쿠아버튼입니다.


도형레이어는 맨밑에 있고 하이라이트를 표현한 레이어와 빛의 투과를 표현한 레이어는 위에 있습니다. 이때 두 레이어는 그라데이션을 줄때 흰색부분을 제외하고는 투명으로 처리를 했죠. (투명-흰색) 따라서 도형의 색상만 변경해주면 아쿠아버튼의 색상이 자연스럽게 변경이 되는것이죠.

여기저기 많이 사용되고 응용도 많이 되고 있으니 소스파일 하나 잘 보관하면 또 만들고 할일이 없겠죠?
웹디는 시간 싸움입니다! 빠른시간에 하이퀄리티! 미리 준비해놓으면 걱정 없습니다!!

 
 
반응형

댓글