What is Sketch prototyping?

In Sketch, you typically draw hotspots over areas you would like to be clickable and by choosing the destination artboard of the hotspot you can create interactive prototypes. Once you publish a Sketch design with hotspots to the Indigo.Design cloud, the hotspots will be detected, and you will end up with a prototype with interactions baked in.

How to prototype in Sketch?

Instead of defining hotspots in Sketch and cluttering your design file, you may publish your Indigo.Design-based project to our cloud and it will automatically detect components, letting you easily link screens. This gives you a clean interactive prototype with smooth user flow to share and test.

How to export a Sketch prototype?

Exporting Sketch prototypes to screen images is not necessary anymore, and seriously, it is 2022, who would ever want that. Use the Sketch plugin to publish your design to the Indigo.Design cloud hassle-free with just a few clicks and then only sync it with ctrl+shift+Y as you make tweaks. If you have a sentiment for the old ways and still want to export your screens as jpegs, Indigo.Design still has you covered with the Image-based prototyping flow available when you start creating a prototype in the Indigo.Design Cloud.

How to share a Sketch prototype?

With your prototype in the Indigo.Design cloud, you may either share it directly with stakeholders to leave their feedback as comments or create usability tests defining tasks and scenarios for users to complete. This is a unique advantage of our design system as it follows user testing best practices, provides concrete insights and user click maps, letting you identify issues early on and iterate your design quickly to assure a smooth user flow.

Sketch 프로토타입을 통해 빠르게 작동하는 앱 얻기

Name: App Builder
Brand: Infragistics
SKU: 0446310786
Availability: InStock
Rating: 4.3 (53 reviews)

Indigo.Design for Sketch 및 App Builder ™를 사용하여 디자인 시스템의 모든 기능을 활용하고 창의력을 발휘하여 Sketch 프로토타입을 생산 준비 코드가 포함된 앱으로 신속하게 전환하세요. 실제 UI 구성 요소로 프로토타입을 제작할 때 UI의 복잡한 레이어를 제거하고 완벽하게 작동하는 최신 애플리케이션으로 디자인을 웹에 가져올 수 있습니다.

데모 요청

코드에 맞게 설계: Sketch 프로토타입을 제작하고 실제 앱으로 변환

디자인 워크플로우를 시작해보세요

수백 개의 사전 구축된 UI 패턴과 그리드, 차트, 드롭다운 메뉴 등과 같은 60개 이상의 원자 구성 요소를 사용하여 성공적으로 시작하세요.

디자인을 새롭게 브랜딩하세요

밝은 모드와 어두운 모드 사이를 전환하고, 사용자 정의 색상 팔레트를 정의하고, 간편하고 재사용 가능한 테마로 완벽한 타이포그래피를 선택하세요. SketchUI 키트에는 400개 이상의 아이콘, 특수 색상 팔레트 및 17개의 사용자 정의 가능한 일러스트레이션이 포함되어 있습니다.

Sketch 프로토타입 공유

Sketch 플러그인을 사용하면 "게시" 또는 "앱 만들기"를 클릭하기만 하면 프로토타입을 화면 이미지로 내보낼 필요가 없습니다! 그런 다음 이해관계자와 직접 공유하거나, 유용성 테스트를 생성하거나, App Builder ™에서 실제 생산 준비가 완료된 소스 코드를 얻으세요!

몇 초 만에 코딩으로 설계

단일 작업 환경을 통해 Sketch 디자인을 즉시 제작 가능한 Angular 또는 Blazor 코드로 가속화하세요. 디자이너는 Adobe XD 또는 Sketch와 같은 선호하는 디자인 도구를 사용할 수 있고, 개발자는 Visual Studio, GitHub 또는 선호하는 IDE를 사용할 수 있습니다. 완전히 통합된 설계-코드 시스템으로 설계 사일로를 제거 하고 잘못된 의사소통을 줄입니다.

훌륭한 앱을 쉽게 설계하고 구축할 수 있게 해주는 기능

사용자 정의 테마와 스타일을 사용한 Sketch 앱 프로토타이핑 기능을 갖춘 Indigo.Design 아이콘

유연한 테마 기반

Indigo Design System 브랜드 지침에 맞게 쉽고 자동으로 조정할 수 있는 실제 UI 구성 요소와 패턴에 적용되는 색상 변수, 색상 스타일 및 텍스트 스타일의 구조를 제공합니다.

원격으로 Sketch 프로토타입 생성 및 사용자 테스트

Sketch에서 직접 클라우드 기반 대화형 프로토타입을 만들고 이해관계자 피드백을 수집하거나 UX 모범 사례에 따라 사용자 테스트 시나리오를 정의하여 첫 번째 시도부터 올바른 경험을 만들어 보세요.

모든 것은 App Builder ™에서 끝납니다

Sketch에서 직접 최첨단 웹 애플리케이션을 생성하고 이를 App Builder의 데이터에 바인딩하고 이전과는 전혀 다른 방식으로 디자이너와 개발자를 하나로 묶는 하나의 통합된 디자인-코드를 통해 GitHub에 코드를 푸시합니다.

참조 앱 갤러리 살펴보기

Indigo.Design의 전문가가 되어 갤러리에 있는 몇 가지 참조 앱을 탐색하여 기본 디자인 시스템 원리를 알아보세요. Sketch 파일로 다운로드하고 App Builder에서 동일한 앱을 보면서 계층 구조를 살펴보세요.

Sketch 없음, 문제 없음

이미 사용 가능한 Adobe XD 지원과 제작 중인 Figma 통해 UX 및 UI 디자인을 위한 주요 도구를 다루었습니다. UI 키트는 동일한 구성 요소, 패턴, 스타일 지정 및 사용자 정의 세트를 제공하지만 각 키트는 해당 도구의 장점을 사용합니다.

Indigo.Design에 대해 문의하세요

Indigo.Design 팀이 애플리케이션을 더 빠르게 설계, 구축 및 테스트하는 데 필요한 도구를 갖춘 완전한 디지털 제품 설계 플랫폼입니다. 더 많은 정보를 얻으려면 아래 양식을 작성해 주세요. 그러면 저희 팀원이 후속 조치를 취해 귀하와 협력할 수 있는 날짜와 시간을 확인하고 일정을 잡을 것입니다.

필수 필드

비즈니스 이메일

이름

성

회사 이름

직위

핸드폰

관심사가 무엇인가:

프로토타이핑

User Testing

Code Generation

Embed

Other

본인은 Infragisitcs의 이용약관 및 개인정보 보호정책을 이해하고 이에 동의합니다.

자주 묻는 질문

Sketch 프로토타이핑에 대한 질문과 답변

Sketch 에서는 일반적으로 클릭할 수 있는 영역 위에 핫스팟을 그리고 핫스팟의 대상 아트보드를 선택하여 대화형 프로토타입을 만들 수 있습니다. 핫스팟이 포함된 Sketch 디자인을 Indigo.Design 클라우드에 게시하면 핫스팟이 감지되고 상호 작용이 포함된 프로토타입이 완성됩니다.

Sketch에서 핫스팟을 정의하고 디자인 파일을 복잡하게 만드는 대신 Indigo.Design 기반 프로젝트를 클라우드에 게시하면 구성 요소가 자동으로 감지되어 화면을 쉽게 연결할 수 있습니다. 이를 통해 공유하고 테스트할 수 있는 원활한 사용자 흐름을 갖춘 깔끔한 대화형 프로토타입을 제공합니다.

Sketch 프로토타입을 화면 이미지로 내보내는 것은 더 이상 필요하지 않으며, 진지하게 2022년이 되면 누가 그것을 원할 것입니까? Sketch 플러그인을 사용하면 단 몇 번의 클릭만으로 번거로움 없이 Indigo.Design 클라우드에 디자인을 게시할 수 있으며, 수정하면서 Ctrl+Shift+Y 만으로 동기화할 수 있습니다. 이전 방식에 대한 감정이 있고 여전히 화면을 jpeg로 내보내고 싶다면 Indigo.Design Cloud에서 프로토타입 생성을 시작할 때 사용할 수 있는 이미지 기반 프로토타입 제작 흐름을 Indigo.Design에서 제공합니다.

Indigo.Design 클라우드의 프로토타입을 사용하여 이해관계자와 직접 공유하여 피드백을 댓글로 남기거나 사용자가 완료할 작업 및 시나리오를 정의하는 사용성 테스트를 만들 수 있습니다. 이는 사용자 테스트 모범 사례를 따르고 구체적인 통찰력과 사용자 클릭 맵을 제공하여 문제를 조기에 식별하고 디자인을 빠르게 반복하여 원활한 사용자 흐름을 보장한다는 점에서 우리 디자인 시스템의 고유한 이점입니다.

대화에 참여