UI Mockups를 만들어 모바일 앱, 데스크톱 소프트웨어 또는 단순히 웹 사이트를 디자인하려는 경우 미래의 프로젝트에 대한 첫 번째 시각을 얻을 수 있으며 디자인 아이디어를 더 나은 방식으로 고객에게 제시 할 수 있습니다.

UI Mockup 생성은 Wireframing과 다릅니다. Wireframing은 집이나 엔지니어링 프로젝트에 대한 청사진을 만드는 것과 같지만 Mockup을 만드는 것은 고객을위한 집의 창의적인 디자인 (최종 외관)과 함께 나옵니다.

편리한 Mockup 도구에 액세스하면 UI 디자인 단계에서 전체 프로세스 속도를 높일 수 있습니다.

UI Mockup 도구가 부족하지 않습니다. 그러나 선택할 수있는 옵션이 너무 많으므로 어느 것을 먼저 사용해야하는지 혼동 될 수 있습니다.

현재의 무기고에 전동 공구를 더 추가하려는 전문가이든 처음으로 Mockup 디자인을 처음 시도하는 초보자이든이 가이드는 2019 년 UI Mockup을 만드는 최고의 도구를 소개합니다.

UI 모형을 만드는 가장 좋은 도구는 무엇입니까?

모의 흐름

• 가격 – 무료 제한 / 프리미엄 월 $ 19 플랜 – 사용자 당 월 $ 14 연간 플랜

MockFlow는 개인 및 조직을위한 와이어 프레임, 프로토 타이핑 및 UI Mockup 도구를 제공하는 프리미엄 클라우드 기반 솔루션입니다. 무료 및 프리미엄 요금제로 제공되며 PC에서도 사용할 수 있습니다.

가격은 연간 계획과 월간 계획으로 나뉩니다. 연간 요금제와 비교할 때 월별 요금제는 비쌀뿐만 아니라 일부 기능이 누락되었습니다. 연간 요금제에서는 상당한 할인 혜택을받을뿐만 아니라 3 개월 무료 서비스, 오프라인 액세스 및 파워 업도 제공됩니다.

이 도구를 사용하려면 무료 계정으로 가입해야합니다. 무료 계정을 사용하면 각 앱에서 하나의 프로젝트, 프로젝트 당 두 명의 검토 자, 제한된 앱 선택 및 지원 없음을 만들 수 있습니다. 그러나 무료 계정은 MockFlow의 유용성에 대한 공정한 아이디어를 제공합니다.

MockFlow는 컴퓨터를 실행하는 Windows 및 Mac OS에서 오프라인 액세스를 제공합니다. MockFlow 확장을 사용하면 Microsoft Office, Chrome, Google Docs, Slack, JIRA 등과 같은 앱에서이 도구를 사용할 수 있습니다.

MockFlow에는 WireFrame 및 UI Mockups, Sitemap, StyleGuide, DesignCollab, Annotate Pro 및 Website Pro의 6 가지 기본 기능이 있습니다. UI 모형을 만들려면 대시 보드에서 첫 번째 WireFrame 옵션을 사용하고 + 아이콘을 클릭하십시오.

iOS 기기, 스마트 시계, 웹 사이트, Microsoft 앱 등과 같은 모형을 만들 플랫폼을 선택하십시오.

편집 대시 보드는 6 개의 탭으로 나뉩니다. 요소 탭에서 모바일 프레임, 아이콘, 배경 이미지, 메뉴 탭, 체크 아웃 옵션 등과 같은 미리 디자인 된 개체를 끌어서 놓거나 원하는 경우 빈 페이지에서 시작할 수 있습니다.

간단한 더블 클릭으로 개체를 추가로 사용자 정의 할 수 있습니다. UI를보다 쉽게 ​​이동하고 확장 할 수 있도록 여러 요소를 그룹화 할 수 있습니다.

편집기의 다른 탭은 동일한 앱에 대해 여러 페이지를 작성하는 페이지, 이미지 탭, 프로젝트의 상태를 추가하고 확인하는 플로우 탭, 더 많은 앱 및 템플리트를 추가하기 위해 저장 및 전원 공급 탭입니다.

MockFlow는 UI Mockup 등을 만드는 데 유용한 다목적 도구입니다. 그러나 프리미엄 플랜은 제공하는 기능의 적어도 절반을 사용할 수있는 진지한 사용자를위한 것입니다.

MockFlow 사용해보기

• 또한 읽기: 초보자 및 고급 사용자를위한 10 가지 최고의 무료 3D 디자인 소프트웨어

발사 미크

• 가격 – 무료 30 일 평가판 / 온라인 버전은 한 달에 $ 9에서 시작 / 오프라인 버전은 $ 89 영구 라이센스에서 시작

Balsamiq은 빠르고 접근하기 쉬운 협업 와이어 프레이밍을 제공하는 UI 디자이너 및 개발자를위한 최신 클라우드 기반 솔루션입니다. 오프라인 솔루션을 선호하는 경우 Balsamiq도 적용됩니다.

Balsamiq는 Mac 및 Windows 컴퓨터 용 온라인 및 오프라인 데스크톱 앱의 두 가지 버전의 도구를 제공합니다. 오프라인 버전은 한 번 구매하면 단일 사용자에 대해 $ 89의 비용이 듭니다. 온라인 버전은 사용자 당 월 $ 9에서 시작하여 두 개의 프로젝트를위한 공간이 있습니다.

다행히 무료로 가입하고 무제한 와이어 프레임 및 무제한 사용자를 통해 30 일 동안 무료로 웹 앱을 사용할 수 있습니다.

무료 평가판 계정에 가입하는 것은 쉽지만 사용자가 전자 메일을 확인해야합니다. 완료되면 공간을 만들어 시작하고 이름을 지정하십시오. 그런 다음 첫 번째 프로젝트 작성을 진행하십시오.

프로젝트 편집기에는 매우 간단하고 사용자 친화적 인 인터페이스가 있습니다. 모든 속성은 툴바에 멋지게 퍼져 있습니다. 페이지 또는 와이어 프레임이 왼쪽에 표시되며 상단의 + 아이콘을 클릭하여 여러 페이지를 추가 할 수 있습니다.

템플릿을 편집기로 끌어서 놓거나 기본 편집 도구를 사용하여 처음부터 시작할 수 있습니다. 추가 컨트롤 옵션을 사용하여 라이브러리에서 더 많은 템플릿과 아이콘을 검색하십시오. 데스크톱 응용 프로그램 및 다이어그램에서 하드웨어 및 레이아웃 UI에 이르기까지 Balsamiq 라이브러리에는 Mockup and Wireframes를 쉽게 만드는 데 필요한 모든 것이 있습니다.

객체 속성을 변경하려면 객체를 선택하면 해당 옵션이 오른쪽 창에 표시됩니다.

개발자는 이메일을 통해 링크를 보내 클라이언트가 프리젠 테이션을하도록 초대 할 수 있습니다. 팀 구성원을 프로젝트에 추가하고 각 팀 구성원에게 역할을 지정할 수도 있습니다.

또한 Balsamiq은 Google Drive, Confluence 및 Jira와 같은 비즈니스 앱과의 통합도 제공합니다. 웹 사이트의 UI 디자인 리소스는 경험이 많거나 초보자에게도 유용합니다.

Balsamiq은 훌륭한 도구이며 오프라인 및 온라인 소프트웨어 제품군으로 의심 할 여지없이 비즈니스 최고 중 하나입니다. 30 일 무료 평가판과 함께 사용하면 구매하기 전에 도구를 평가할 시간이 충분합니다.

Balsamiq 사용해보기

• 읽는다: 소책자를 만들고 마케팅 게임을 지배하는 8 가지 멋진 소프트웨어

모크 플러스

• 가격 – 무료 평가판 / 연간 $ 59 개인 라이센스 / $ 199 영구 라이센스 / 팀 계획은 연간 $ 299에서 시작

MockPlus는 모든 화면 크기 및 플랫폼에 대한 모형 및 프로토 타입을 생성 할 수있는 유연한 도구를 찾고있는 사람에게 적합합니다. 오프라인 응용 프로그램이며 Windows, Mac, Android 및 iOS 장치에서 사용할 수 있습니다.

MockPlus는 Microsoft 및 IBM을 포함한 기술 산업의 일부 주요 이름에서 사용됩니다. 구매하기 전에 도구를 사용해 볼 수있는 7 일 무료 평가판이 있습니다.

MockPlus의 사용자 인터페이스는 잘 배치되어 있으며 현대적으로 보입니다. 공간이 충분하고 불필요한 도구로 작업 공간을 어지럽히 지 않습니다. 또한 생산성 향상을 위해 여러 창에서 소프트웨어를 사용할 수있는 다중 창 옵션이 있습니다.

사전 디자인 된 구성 요소를 편집기로 끌어서 놓기 만하면 대화식 프로토 타입을 쉽게 만들 수 있습니다. 이 라이브러리에는 3000 개가 넘는 아이콘과 200 개가 넘는 사전 디자인 된 구성 요소가 장착되어있어 드래그 앤 드롭 기능을 모두 지원할 수 있습니다.

앱에서 생성 된 QR 코드를 사용하여 프로토 타입을 즉시 테스트 할 수 있습니다. 또한 프로젝트를 웹에 게시하여 프로토 타입에 대한 웹 링크를 공유하여 클라이언트 및 팀 구성원의 의견을 얻을 수 있습니다.

MockPlus는 그 기능이 뛰어나고이 프로토 타입 소프트웨어의 특징과 기능은 전문 지식에 관계없이 UI 및 UX 설계자에게 이상적인 도구입니다.

MockPlus 다운로드

• 읽기: PC에서 대화 형 타임 라인을 생성하는 9 가지 기능이 풍부한 소프트웨어

모프

• 가격 – 무료 평가판 / 월 $ 19에 시작 – 개인 계획

Moqups는 클라우드 기반 웹 앱으로, 와이어 프레임, 모형, 다이어그램 및 프로토 타입을 생성하고 다른 팀 구성원과 실시간으로 협업 할 수 있습니다.

개인 및 팀 계정이있는 프리미엄 도구입니다. 무료 평가판을 사용하려면 계정을 등록해야하며 300 개의 개체로 제한되는 하나의 프로젝트로 5MB의 저장소를 제공합니다.

사용자 인터페이스는 MockFlow와 비슷하지만 도구와 레이아웃이 다릅니다. 새 프로젝트를 만든 후에는 스텐실 탭에서 요소를 끌어서 놓을 수 있습니다.

프로젝트에 더 많은 페이지를 추가하고, 개요를 사용자 정의하고, 템플릿을 작성하고, 이미지를 업로드 및 추가하고, 광범위한 아이콘 라이브러리에서 찾아보고 프로젝트에 주석을 추가 할 수 있습니다.

크기, 회전, 정렬 및 스타일을 조정하기 위해 개체를 편집 할 수 있습니다. 그룹화 기능을 사용하면 여러 개체를 쉽게 그룹화하여 쉽게 이동할 수 있습니다.

모형이 준비되면 Google 드라이브, Dropbox 또는 컴퓨터의 로컬 드라이브 인 PNG, PDF 또는 HTML 형식으로 내보낼 수 있습니다.

Moqups는 와이어 프레이밍을 위해 사용하기 쉬운 도구이며, 다이어그램과 모형을 신속하게 만들 수 있습니다. 무료 계정에 가입하고 도구를 사용하여 요구 사항을 충족하는지 확인하십시오.

Moqups 사용해보기

결론

전문 UI 디자이너이든 초보자이든 관계없이 UI 모형을 만드는 데 사용할 도구를 아는 것이 중요합니다. 와이어 프레이밍 툴만 찾고 있다면 Wireframes.cc를 사용하는 것이 좋습니다.

앱 또는 웹 사이트를위한 간단하고 효과적인 와이어 프레임을 생성하는 최소한의 디자인과 소수의 기능을 갖춘 웹 기반 앱입니다. 결국에는 항상 더 나은 것은 아닙니다.

그러나 기능이 풍부한 Mockup 도구를 찾고있는 UX / UI 디자이너의 경우 위의 권장 도구를 모두 사용해보십시오. 이러한 도구는 모두 무료 평가판 또는 기본 무료 계정으로 제한없이 시작할 수 있습니다.

필수 도구 목록에서 가장 많은 상자를 선택하는 도구를 결정하기 전에 이러한 도구 각각에 시간을 할애 할 수 있습니다.

하나의 도구만으로는 모든 사람의 요구를 충족 할 수 없다는 사실을 알기 때문에 대부분의 디자이너 요구를 충족시킬 수있는 UI 모형을 만들 수있는 최상의 도구를 포함하려고했습니다.

즐겨 사용하는 모형 및 와이어 프레이밍 소프트웨어를 알려주거나 아래 의견에서이 목록에서 유용한 대안을 제외했다고 생각하는 경우 알려주십시오.