Rollstory Design/8月 - August

[제작가이드]빈티지 시계

Woody SEO 2013. 8. 2. 16:50
반응형

지인이 시계 이미지를 만들어 달라기에 엔틱한 느낌의 빈티지 시계를 만들어 보았다. 빈티지한 느낌을 나타내기위하여 서체와 색상등을 잘 고려하여 작업한다면 보다 좋은 느낌으로 만들 수 있을 것이다. (앞서 말한적있지만 필자의 환경은 매킨토쉬에서 CS6를 사용하고 있습니다. 따라서 맥의 command버튼은 윈도우의 ctrl과 같음을 알립니다.)

01.가로세로 512px의 캔버스를 만든다.



02.가이드라인을 미리 그어놓고 가로세로  350px의 정원의 쉐이프를 만든뒤, 아래의 레이어 스타일을 적용한다.


▲ clock body_01 레이어의 레이어스타일

▲ 기본 색상이 적용된 모습



03.시계배경에 질감을 추가적으로 주기 위하여 같은 레이어를 하나더 복사한 뒤, 레이어 스타일을 제거하고 위의 그림처럼 Pattern Overlay를 적용시킨다.




04.Pattern적용을 마쳤다면, 해당레이어에서 마우스 오른쪽 버튼을 누른뒤, Rasterize Layer Style을 시키고, 블랜딩 모드는 Overlay, 투명도는 70% 정도 준다.(약간 오돌오돌?한 느낌을 얻을 수 있다)




05.포토샵 기본 필터인 Clouds를 이용하여 계속하여 질감을 표현하기 위하여 이번엔,

새레이어를 하나 생성한뒤, 전경색과 배경색은 기본 디폴트인 흑/백으로 전환하고, Filter - Render - Clouds를 적용한뒤, 클리핑마스크를 시킨다.(command + alt + G)



▲ 콘크리트 이미지



06.계속하여 이번엔 콘크리트 느낌의 이미지를 불러온뒤, 마찬가지로 위의그림처럼 클리핑 마스크를 시키고 간단하게 Curves(command + M)를 이용하여 색상을 조절한다.



07.다음은, 시계의 외곽라인을 만들 차례다. 우선 도넛모양의 쉐이프를 만들어야 하기에 일단은 원형 쉐이프를 하나 만든뒤 쉐이프 옵션에서 Subtract Front Shape를 선택하여 작은 정원을 하나 더 만들어 쉐이프를 빼서 위의 그림처럼 도넛모양의 쉐이프를 만든다.




08.안쪽의 지시표가 들어갈 부분을 만들어야 하므로 위에서 만들었던 외곽레이어를 그대로 하나 복사한뒤, 트랜스폼(command + T)을 활용하여 크기를 줄여 안쪽으로 위치시키고(크기를 줄일땐 비례하여 줄이기 위하여 alt와 shift를 같이 누르며 줄인다),

선택영역을 잡고(command + 레이어 썸네일 클릭), 새레이어를 하나 생성한뒤, Select - Modify - Expand를 적용하고 2px정도 크기를 늘인뒤 미리만들어놓은 새 레이어에 검정색으로 채운다.



09.안쪽에 지시표가 들어갈곳이기 때문에 레이어스타일에서 Stroke를 준뒤, 위의 그림처럼 기본옵션중 Advanced Blending에서 아래의 체크 두개를 반드시 변경 하여야 한다. 후에 안쪽영역으로 지시표를 클리핑마스크 시키기 위해서 이다.(별거 아닌것 같지만 필자가 이 기능을 알아냈을땐 번거로운 작업을 하나 덜 수 있는 아주 좋은 기능이였다)



10.이제 지시표를 만들기 위해 이번엔 포토샵이 아닌 일러스트를 이용하였다.(포토샵으로도 만들 순 있지만 일러스트레이터를 이용하면 아주 쉽게 만들 수 있다)우선, 일러스트에서 똑같이 512px의 캔버스를 만들고 윗쪽에 5px 두깨의 라인을 하나 만든뒤, 회전툴을 선택한뒤, 가운데에 중심적을 찍어두고(알트를 누른채 중심점을 찍으면 된다), 6도 단위로 라인을 하나 카피한뒤 command(ctrl) + D 를 계속 눌러 위의 그림처럼 지시표를 완성시킨다. 그리고나서 두깨를 알맞게 조절하고 전체라인을 선택한뒤 일러스트레이터에서 복사(command + C)하여 포토샵에서 붙여넣기(command + V)한다.




11.일러스트레이터에서 만들어온 지시표레이어를 포토샵에 붙여넣었다면 트랜스폼(command + T)를 활용하여 크기를 알맞게 위치시키고, 클리핑 마스크(command + G)시켜 안쪽으로 집어 넣는다.


12.이제, 안쪽에 텍스트를 넣을 차례다. 로만체 느낌의 폰트가 있다면 그걸 사용하여도 좋으며, 아니면 글 하단에 폰트를 첨부하니 설치하여 쓰며, 위의 그림처럼 글자의 폭을 많이 좁혀서 1~12시까지 글자를 모두 입력한다.



▲ 시간이 모두 새겨진 모습



13.안쪽에 데코레이션을 하기 위하여 마음대로 안쪽을 채워 넣는다. :-) 되도록이면 빈티지한 느낌을 살리기 위하여 서체등을 신경써서 한다면 좋을 것이다.




14.안쪽 데코레이션을 이루었던 모든 레이어를 그룹화 시킨뒤, 그룹을 통채로 하나 복사하고, 원본을 눈을 끄고, 카피한 그룹을 한개의 레이어로 합친다(command + E). 그리고 해당레이어에서 마우스 오른쪽 버튼을 눌러 스마트레이어로 변환 시킨뒤, Filter - Distort - Ripple 를 15%정도만 적용시킨다.(마치 물에 번지는듯한 느낌의 필터이다) 적용이 끝났다면 아래의 레이어 스타일을 적용한다.



▲ 안쪽데코레이션 레이어에 레이어스타일이 적용된 모습




15.이제, Clock Background그룹만 남겨놓고 나머지 레이어나 그룹을 모두 하나의 그룹으로 그룹화 시킨뒤 마스크를 추가하고, 위의 그림처럼 검정색 브러쉬로 빈티지한 느낌을 주기위해 군대군대 브러쉬를 칠한다.



▲ 브러쉬 작업이 끝난 모습




16.시계 밑 부분은 다 만들었다. 다음은 시침/분침/초침을 만들차례다. 우선 시침을 만들기 위하여 펜툴(쉐이프옵션선택)을 이용하여 반틈만 라인을 그리고 나머지 반틈은 하나더 복사하여 Flip시킨뒤, 두 레이어를 합친다(command + E). 그리고 아래의 레이어 스타일을 준다.

▲ 시침레이어의 2가지 레이어 스타일



17.계속하여 시침레이어에 색상을 #331600으로(갈색계열) 변경한뒤, 추가적으로 아래의 레이어 스타일을 추가하여 입체감을 좀더 나타낸다.



▲ 시침레이어가 완성되었으며, 위치도 적당이 조절하였다.

18. 같은 방법으로 분침과 시침을 만들되, 초침은 포토샵에서 만들기 어렵다면 일러스트레이터의 패스파인더를 이용하면 쉽게 만들 수 있다.



이렇게 하여 초침까지 만들었다면, 마지막으로 색상과 레이어스타일을 조금씩 조절하여 빈티지 시계를 완성하였다. 엔틱하고 빈티지한 느낌에 글자가 들어가야 한다면 서체는 반드시 신경 써야할 부분이다. 그리고 완성본 처럼  부분부분 지워진 느낌을 추가하는것도 아주 좋은 방법이다.




OpenBaskerville-0.0.75.otf


vintage clock.psd



반응형

'Rollstory Design > 8月 - August' 카테고리의 다른 글

[로고제작]Tea Merchant  (0) 2014.09.05
8월을 되돌아보며  (0) 2013.08.30
[UI]iOS7 키패드 리디자인 ver2.0  (210) 2013.08.21
[GUI]플립달력시계  (2) 2013.08.19
[GUI]플랫디자인 - 카메라아이콘  (0) 2013.08.01