오늘은 http://www.funcake.com/ 이 사이트의 상단에 있는 메뉴바를 한번 비슷하게 따라해 보겠습니다. 메뉴는 플래시로 제작되어 마우스가 위치하면 서브메뉴와 캐릭터가 나오는데 여기에서는 포토샵 작업중 메뉴틀만 한번 따라해 보도록 하겠습니다. 지금은 쥬크온(jukeon)으로 합병이 되었더군요. 그럼 시작해보겠습니다.
----------------------------------------------------------------------------------------------------------------------
1. 단축키 Ctrl + N 또는 Ctrl 키를 클릭한 상태에서 포토샵의 바탕화면을 더블클릭해서 새로운 화이트문서 하나를 엽니다. 크기는 상관이 없으나 원활한 강좌를 위해서 460*344 사이즈로 열겠습니다. 이왕 따라하기로 한거 바탕색도 똑같이,, ① 전경색을 #91A6B3로 설정하고 ② Paint Bucket Tool(
,G)을 이용해서 색을 채워줍니다. ③ 단축키 Shift + Ctrl + N을 클릭하고 "바탕틀" 이라는 이름으로 레이어를 하나 추가합니다.
----------------------------------------------------------------------------------------------------------------------
2. 이번에는 ① 전경색을 흰색(#FFFFFF)으로 설정하고 좌측의 도구툴바에서 Rounded Rectangle Tool(
,U)를 선택하고 상단의 설정을 아래의 그림과 같이 설정한 후에 ② 삽입해 줍니다. (일단 방법에 대해서만 알려드리는것이기 때문에 사이즈를 지정하고 하겠습니다. 나중에 원하시는 사이즈로 만드시기 바랍니다.)
----------------------------------------------------------------------------------------------------------------------
3. ① "바탕틀" 레이어의 우측부분을 더블클릭해서 스타일옵션창을 실행합니다. 실행후에 먼저 ② "Drop Shadow"의 설정, ③ "Outer Glow"의 설정, ④ "Bevel and Emboss"의 설정, ⑤ "Gradient Overlay"의 설정 ⑥ "Stroke"의 설정까지... 아래의 이미지을 참조 하시여 스타일 설정을 적용시켜 줍니다.
----------------------------------------------------------------------------------------------------------------------
4. 단축키 Shift + Ctrl + N을 클릭하고 ① "안쪽틀1" 이라는 이름으로 레이어를 하나 추가합니다. 현재 전경색은 계속 흰색일겁니다. 그 상태에서 좌측의 도구툴바에서 Rounded Rectangle Tool(,U)를 선택하고 상단의 설정을 아래의 그림 ② 와 같이 설정한 후에 ③ 삽입해 줍니다.
----------------------------------------------------------------------------------------------------------------------
5. ① 키보드의 Ctrl 키를 클릭한 상태에서 "안쪽틀1" 레이어를 클릭해서 선택영역을 잡아줍니다. 마우스로 ② 아래의 "바탕틀" 레이어를 선택하고 키보드의 "Delete" 키를 클릭해서 선택되어진 부분을 삭제합니다. (!!!선택영역은 그대로 두세요!!!) 포토샵 상단의 메뉴에서 ③ Select > Modify > Contract를 선택하고 수치를 3을 입력하고 엔터하시고 ④ 레이어팔레트 제일 상단에 "안쪽틀2" 라는 이름으로 레이어를 하나 추가하고, Paint Bucket Tool(
,G)을 이용해서 흰색으로 채워줍니다. (같은 흰색이라서 별다른 변화는 없을겁니다.)
----------------------------------------------------------------------------------------------------------------------
6. 선택을 해지하지 않은상태에서 "안쪽틀2" 레이어의 스타일옵션창을 실행합니다. 실행후에 ① "Gradint Overlay"의 설정을 해줍니다. 색상 #F0F0F0, #FFFFFF, Ctrl + D를 클릭해서 ② 선택영역은 해제합니다. 이쯤에서 위치좀 잡아주겠습니다. 해당사이트와 마찬가지로 메뉴바를 상단으로 이동시킵니다. 레이어판넬에서 ③ 백그라운드레이어를 제외한 모든 레이어를 링크시킨후에 좌측의 도구툴바에서 Move Tool(
,V)을 선택하고 마우스나 키보드의 방향키를 이용해서 ④ 상단으로 적당히 이동시킵니다. (참고로 방향키를 이용하실 때는 키보드의 Shift 키를 같이 이용하세요.)
----------------------------------------------------------------------------------------------------------------------
7. 해당사이트와 같이 검색바도 한번 만들어보겠습니다. ① 레이어판넬 제일 상단에 "검색바" 라는 이름으로 레이어를 하나 추가합니다. 전경색을 흰색(#FFFFFF)로 설정하고 좌측의 도구툴바에서 Rectangle Tool( ,U)를 선택하고 아래의 이미지 ②와 같이 적당한 사이즈의 검색바를 하나 만들어 줍니다. 해당레이어(검색바 레이어)의 옵션을 아래의 이미지 ③,④와 같이 설정해줍니다. ⑤ 검색버튼은 나름데로 한번 만들어 보시기 바랍니다. (특별한 효과가 없어서 강좌에서는 뺍니다.)
----------------------------------------------------------------------------------------------------------------------
8. 이제 보니까 맨 하단의 "배경틀" 레이어에 패턴이 적용이 됐군요. 단축키 Ctrl + N 또는 Ctrl 키를 클릭한 상태에서 포토샵의 바탕화면을 더블클릭해서 ① 크기가 3*3 인 투명문서를 하나 엽니다. ② 작업창을 1600%까지 확대하고, 전경색을 비슷한 ③ 핑크계열로 선택하고(예 / #EF5EA2) 좌측의 도구툴바에서 ④ Pencil Tool(
,B)을 선택하고 수치를 1px로 해서 아래와 같이 정중앙에 점을 하나 찍어주고, ⑤ Edit > Define Pattern을 선택하고 적당한 이름의 패턴으로 저장합니다.
----------------------------------------------------------------------------------------------------------------------
9. 다시 원래의 작업창으로 돌아와서.. "바탕틀" 레이어위에 ① "패턴이라는 이름으로 레이어를 하나 추가합니다. 키보드의 Ctrl 키를 클릭한 상태에서 아래의 "바탕틀" 레이어를 클릭해서 선택영역을 잡아주고, 포토샵 상단의 메뉴에서 ②,③ Edit > Fill을 선택하고 좀 전에 저장한 패턴을 찾아서 적용해 줍니다. 패턴적용후 Ctrl + D. 그리고, 해당레이어(패턴레이어)의 ④ Opacity의 수치를 이미지를 보면서 적절히 조정해줍니다.
----------------------------------------------------------------------------------------------------------------------
10. 해당사이트와 같이 메뉴의 점선까지 만들어 보겠습니다. ① 레이어판넬 제일상단에 "점선" 이라는 이름으로 레이어를 하나 추가하고, 전경색은 검정색으로 설정합니다. 좌측의 도구툴바에서 Pencil Tool( ,B)을 선택하고 브러쉬판넬의 설정을 아래 이미지 ②와 같이 설정하고 ③ 선을 만들어 줍니다. 해당사이트의 점선은 약간 회색빛이네요. "점선" 레이어의 Opacity의 수치를 적절히 조정하시면 될겁니다.
. 오늘의 Tip - 하얀색이 노랗게 보일때 'Shift+Ctrl+K'File 메뉴에서 ColorSetting 을 선택한다음 RGB Setup 으로 들어가서 대화상자의 아래부분에서 Display Using Moniter Compensation 의 체크 표시를 없애주시면 됩니다. 원래는 하얀색인데 모니터설정에 의해서 노란 것처럼 보이는 것임.
. Contents By 간지(http://ganji.80port.net)
FREECOUNT.NET 프카넷 생긴날 2003.12.20
홈 |
카운터 |
플래시북 |
프리보드 |
전광판 |
웹공부방 |
커뮤니티 |
쪽지함
