목업(Mock-up)이란 실제 제품으로 제작하기 전에 디자인과 설계를 검토하기 위해 실제와 비슷하게 제작하는 모형을 의미합니다. 그래서 목업 사이트는 주로 디자이너들이 많이 활용합니다. 목업 사이트를 통해 제품이나 서비스의 시안을 만들고 사용자나 고객으로부터 피드백을 주고 받을 때 사용하게 됩니다. 아래에서는 좋은 퀄리티의 목업을 제작할 수 있는 추천 사이트를 정리해서 소개해 보도록 하겠습니다.
1. Figma
피그마는 목업 뿐만 아니라 프로토타입과 디자인 시스템을 제작하고 관리하는데 사용할 수 있는 유용한 도구입니다. 기본적으로 웹 브라우저 기반으로 운영되는 목업 무료 사이트이기 때문에 별도의 설치 없이 어디서나 사용할 수 있습니다. 실시간으로 팀원들과 공유하며 협업할 수 있고 다양한 디바이스를 통해 접근할 수 있어 효율적인 도구이기도 합니다. 특히 커뮤니티를 통해 유저들과 다양한 디자인 소스와 템플릿을 공유할 수 있다는 것이 장점입니다.
다만 일부 기능은 유료버전에서만 사용할 수 있고 무료목업은 제한적입니다. 그리고 기능이 많은 만큼 처음 사용하는 사람들에게는 학습하는데 까지 다소 시간이 소요될 수 있습니다.
2. Unblast
언블래스트는 무료목업과 디자인 리소스를 제공해주는 목업 사이트입니다. 다양한 카테고리의 디자인을 제공하며 특히 목업, PDS 템플릿, 아이콘 등을 폭넓게 다루고 있습니다. 무료로 제공할 수 있는 리소스들이 많아 제한적인 예산으로 운영되는 프로젝트와 개인 사용자에게 유용합니다. 사용자 친화적으로 구성되어 쉽게 사용할 수 있으며 다른 디자이너들의 작업을 살펴보며 인사이트를 얻을 수 있다는 것도 큰 장점입니다.
다만, 무료로 제공되는 리소스 중에 일부는 상업적으로 사용하는 것에 제한이 있기 때문에 디자인 리소스들의 저작권에 대해 꼼꼼히 확인해야 합니다.
3. Mr.Mockup
미스터목업은 다양한 목업과 PSD 파일을 제공하는 웹사이트입니다. 웹과 앱 뿐만 아니라 포스터와 상품 패키징 등 디자인 프로젝트에 사용하는 것을 추천합니다.
주기적으로 새로운 목업과 디자인을 업데이트 하기 때문에 최신 버전의 디자인 리소스를 활용할 수 있으며, 전문적이고 퀄리티 높은 디자인을 제공하는 것이 장점입니다.
단점은 무료목업의 퀄리티가 유료 버전과 차이가 나며, 무료 버전이 다양하게 제공되지는 않습니다.
4. Mockup World
목업월드 역시 위에서 소개한 목업 사이트들과 마찬가지로 다양한 목업과 PSD 파일을 제공하는 주요 목업 사이트 중에 하나입니다. 다양한 유형과 카테고리의 목업을 지원하지만 특히 웹과 앱 디자인에 좀더 높은 비중을 두고 있습니다.
목업월드는 초보사용자도 쉽게 사용할 수 있을 만큼 사용자친화적으로 사이트가 구성되어 있습니다. 그리고 대부분의 목업을 무료로 다운 받아 사용할 수 있다는 것이 장점이며 레이어로 정리가 잘된 PSD를 원하는 사용자에게 추천하는 서비스입니다.
5. Balsamiq
Balsamiq는 아이디어를 시각화하기 위해 사용하는 목업 사이트로 와이어프레임과 프로토타입 작성에 많이 활용합니다. 프로토타입을 작성을 통해 실제 디자인을 개발하기 전에 사용자 인터페이스 아이디어를 테스트하고 개선하는 데에 유용합니다.
Balsamiq는 라이브러리에서 디자인 요소를 마우스로 드래그해서 사용하는 방식으로 빠르게 프로토타입을 작성할 수 있으며 다양한 템플릿과 컴포넌트를 제공합니다. 그리고 프로젝트의 버전 관리에 용이하며 요구사항을 문서화하기도 편리합니다.
반면, 디자인의 정밀도와 상세도가 부족하며 실제 개발에 직접 활용하기에는 한계가 있습니다.
6. Moqups
Moqups는 웹 기반으로 디자인과 프로토타이핑을 할 수 있는 목업 사이트로, 웹 디자인과 와이어프레임, 플로우 차트 등을 작성할 수 있습니다. 직관적인 인터페이스로 구성되어 있으며 다양한 디자인 컴포넌트와 아이콘 라이브러리를 지원하고 있습니다.
실시간으로 팀원들과 협업할 수 있으며 프로젝트의 버전 관리에 편리한 도구이며, 작업 이력을 확인하고 원하는 버전으로 파일을 복원할 수 있습니다.
단점은 실제 개발용으로 바로 활용할 수 없으며 대규모 프로젝트에서 활용하기에는 기능에서 다소 한계가 있습니다.
7. Axure RP
Axure은 웹 및 모바일 앱 프로토타입을 설계할 때 강력한 목업 도구입니다. Axure를 통해 실시간으로 팀원들과 협업하고 디자인 프로세스를 설계할 수 있으며 실제 앱 또는 웹사이트처럼 프로토 타입을 제작해 인터렉션, 동적 패널 등을 시뮬레이션 해볼 수 있습니다. 특히 대규모 프로젝트 관리와 문서화를 위한 기능을 제공하고 있어 효율적인 업무진행에 유용합니다.
단점은 전문적인 프로토 타입을 제공하기 위해 다양한 기능을 내장하고 있어 사용자가 도구를 학습하는 데 많은 시간이 필요합니다.
8. Pixeden
Pixeden은 디자인 리소스와 그래픽 템플릿을 지원하는 웹 서비스로 디자인, 포스터, 명함, 로고, 아이콘 등 여러 유형의 디자인 프로젝트에 사용할 수 있습니다. 디자인을 전공하지 않은 사용자들도 Pixeden에서 제공하는 편리한 템플릿과 고품질의 리소스를 통해 빠르게 디자인 작업을 수행할 수 있습니다. 특히 상업적으로 활용할 수 있는 라이선스가 포함된 디자인 리소스들을 많이 지원하고 있습니다.
단점은 무료목업이 제한적으로 지원되며 서비스에서 지원하는 디자인 템플릿과 리소스를 통해 작업할 수 있기 때문에 디테일한 디자인 수정 작업은 어려울 수 있습니다.
9. Pixso
픽소는 다양한 디자인 프로젝트와 목업, 프로토타입 제작부터 디자인 시스템 구축 및 관리까지 할 수 있는 강력한 디자인 협업툴입니다. 픽소는 프로토타입을 제작할 때 필요한 자동 배치, 구성 요소 변경 등 전문적인 도구를 가지고 있어 더욱 효율적인 업무 수행이 가능합니다. 특히 다양한 파일 형식과 시스템을 지원하기 때문에 도구 전환이 필요없으며 커뮤니티를 통해 다양한 무료 목업, 아이콘 등 디자인 리소스와 템플릿 등을 활용할 수 있습니다.
단점은 무료 버전에서는 히스토리 관리가 30일까지만 가능하다는 등 일부 기능에 제한이 있습니다.
마무리
작업 목적과 활용 방법에 따라 적절한 목업 사이트를 활용하는 것이 중요합니다. 사용자가 앱이나 웹서비스를 기획하기 위해 와이어프레임이나 프로토 타입을 제작한다면 실제 앱처럼 시뮬레이션 기능을 제공하는 목업 사이트를 사용해야 합니다. 반면 명함이나 포스터 등 인쇄물 디자인을 제작한다면 상업적으로 활용할 수 있는 저작권이 확보된 디자인 리소스를 제공하는 목업 사이트를 추천합니다.