원문 : http://www.edgerank.co.kr/2017/04/20/mockup-source/
목업은 ‘실제 제품과 비슷한 모형’을 의미합니다.
제품의 디자인을 평가하거나
실제 작동을 시험해보기 위한 목적으로 제작되죠.
디자인 분야에서 목업은
실제 상품 사진과 디지털 그래픽을 합성하여
디자인을 리얼하게 구현해내는 용도로 활용되고 있는데요.
오늘은 디자인 목업이 활용되는 사례와
목업 이미지 소스를 얻을 수 있는
사이트들을 소개해드리겠습니다.
1 . 디자인 목업 활용 사례
![](https://img1.daumcdn.net/relay/cafe/original/?fname=http%3A%2F%2Fwww.edgerank.co.kr%2Fwp-content%2Fuploads%2F2017%2F04%2F02-3.png)
디자인 목업을 활용하는 가장 대표적인 예는
소프트웨어나 어플리케이션을 소개할 때
데스크톱 모니터, 랩탑, 스마트폰의 프레임을 덧씌워
직관적으로 이해하기 쉽도록 디자인한 것을 들 수 있습니다.
![](https://img1.daumcdn.net/relay/cafe/original/?fname=http%3A%2F%2Fwww.edgerank.co.kr%2Fwp-content%2Fuploads%2F2017%2F04%2F07-2.png)
또한 매거진, 브로셔, 쇼핑백 등
인쇄물 레이아웃을 적용하거나
의류에 패턴이나 로고를 넣을 때 참고하는 등
활용범위가 무궁무진하죠.
2. 디자인 목업 사이트
퀄리티 높은 목업 콘텐츠 제작을 위해서는
다양한 소스를 확보하는 것이 중요한데요.
아래 소개해드리는 사이트가 큰 도움이 될 것입니다.
1) MOCKUPWORLD
![](https://img1.daumcdn.net/relay/cafe/original/?fname=http%3A%2F%2Fwww.edgerank.co.kr%2Fwp-content%2Fuploads%2F2017%2F04%2F03-4.png)
사이트 바로가기
MOCKUPWORLD는 카테고리 분류가 잘 되어 있고
외부 사이트의 자료까지 연결해주고 있어
원하는 소스를 쉽게 찾을 수 있습니다.
2) GRAPHIC BURGER
![](https://img1.daumcdn.net/relay/cafe/original/?fname=http%3A%2F%2Fwww.edgerank.co.kr%2Fwp-content%2Fuploads%2F2017%2F04%2F04-2.png)
사이트 바로가기
GRAPHIC BURGER의 자료는 모두 무료로 제공되고 있으며
개인적/상업적으로 사용 가능하다는 것이 가장 큰 장점입니다.
목업 뿐만 아니라 다양한 아이콘이나
텍스트 이펙트 소스도 얻을 수 있죠.
그야말로 최고의 목업 사이트라고 할 수 있는 곳입니다.
3) Dunnnk
![](https://img1.daumcdn.net/relay/cafe/original/?fname=http%3A%2F%2Fwww.edgerank.co.kr%2Fwp-content%2Fuploads%2F2017%2F04%2F05-2.png)
사이트 바로가기
Dunnnk는 애플 제품에 특화된 목업을 제공합니다.
다양한 상황과 각도로 연출된 목업 소스로
다이나믹한 이미지를 제작할 수 있죠.
4) freepik
![](https://img1.daumcdn.net/relay/cafe/original/?fname=http%3A%2F%2Fwww.edgerank.co.kr%2Fwp-content%2Fuploads%2F2017%2F04%2F06-2.png)
사이트 바로가기
freepik은 벡터 이미지, PSD 파일, 아이콘, 로고 등
다양한 그래픽 소스를 제공하는데요.
카테고리 정렬보다 검색에 특화되어 있는 인터페이스로
테마나 아이템별 소스를 모아보는 데 유용합니다.
━━━━━━━
디자인 목업은 콘텐츠 제작의 패러다임을 바꿨습니다.
실물을 일일이 제작하거나 촬영하지 않고도
빠르고 간편하게 이미지를 제작하거나
목업 디자인에 약간의 변화를 줘 바리에이션할 수도 있죠.
앞으로 목업 활용의 중요성은 더욱 커질 텐데요.
오늘 소개해드린 사이트를 잘 활용해
디자인 마스터로 거듭나시기 바랍니다.