Indigo.Design 로고

프로토타입 갤러리에 오신 것을 환영합니다.

Indigo Studio로 첫 번째 프로토타입 만들기

IFTTT 온보딩

IFTTT.com은 온보딩 튜토리얼로 유명합니다. Indig.Design에서 스와이프 제스처와 UI 상태를 사용하여 이를 다시 만듭니다. 모형 없이도 고품질 경험을 전달할 수 있음을 보여주기 위해 회색조로 만들어졌습니다.

Indigo Studio로 첫 번째 프로토타입 만들기

가입 확인

사람들이 양식 필드에 입력하는 내용이나 상호 작용 방식(예: Enter 누르기)을 기반으로 분기된 사용자 흐름을 트리거합니다. 사용자가 양식을 작성하지 않고 가입을 탭하면 오류 조건을 시뮬레이션합니다. Indigo.Design 사용하면 논리 흐름을 쉽게 만들 수 있습니다.

Indigo Studio로 첫 번째 프로토타입 만들기

머니 앱

월별 지출을 추적하기 위한 개인 지출 추적 앱의 프로토타입을 보여줍니다. 핵심 사용자 스토리만이 프로토타입이었습니다. 예를 들어 새로운 비용을 추가하고 분류된 거래를 통해 이달의 예산을 볼 수 있습니다.

Indigo Studio로 첫 번째 프로토타입 만들기

세계 통계

이 iPad 프로토타입은 GapMinder.org의 몇 가지 주요 시나리오를 시뮬레이션하고 Indigo.Design의 애니메이션 기능을 보여줍니다. 각 UI 요소의 전환을 애니메이션화하기 위해 애니메이션 타임라인을 사용합니다. 프로토타입을 실행하고 플레이를 누르세요!

Indigo Studio로 첫 번째 프로토타입 만들기

팬더를 찾아라!

프로토타입 제작이 항상 진지할 필요는 없습니다! 이 프로토타입에서 팬더를 찾을 수 있나요? 목차를 보려면 프로토타입 도구 모음을 사용해 보십시오. 프로토타입을 다운로드하여 어떻게 제작되었는지 확인하세요.

Indigo Studio로 첫 번째 프로토타입 만들기

인디고 스튜디오 웹사이트

Indigo Studio의 새 웹사이트 코딩을 시작하기 전에 모형과 핫스팟을 사용하여 프로토타입을 만들었습니다. 또한 기본 탐색 및 예상 애니메이션을 빠르게 전달하기 위해 화면 부분을 사용합니다.

Indigo Studio로 첫 번째 프로토타입 만들기

데스크탑 날씨

이 프로토타입은 Windows 10 데스크톱의 날씨 앱을 시뮬레이션합니다. 중첩된 동작이 포함된 화면 부분으로 생성된 사용자 정의 UI 요소의 예를 보려면 사이드 메뉴를 클릭하세요. 실제로 전체 화면은 여러 개의 화면 부분으로 구성됩니다.

Indigo Studio로 첫 번째 프로토타입 만들기

GetBootstrap.com

Indigo.Design 사용하여 Bootstrap의 반응형 뷰포트를 어떻게 쉽게 만들 수 있는지 알아보세요. Bootstrap에서 도입한 모바일 우선 접근 방식과 함께 12열 레이아웃이 어떻게 작동하는지 알아보세요. getbootstrap.com의 프로토타입을 제작하는 것보다 이를 보여주는 더 좋은 방법이 있을까요?

더 많은 프로토타입을 보고 싶으십니까?

모든 프로토타입 보기

Indigo.Design 데스크탑 Mac 및 Windows

Indigo.Design 데스크탑 사용 시작

무료로 받으세요

가격 보기 (월 구독은 $39/월부터 시작)