Indigo.Design 로고

Sketch 프로토타입에서 빠르게 작동하는 앱 가져오기

디자인 시스템의 모든 기능을 활용하고 Sketch 및 App Builder ™ 용 Indigo.Design로 창의력을 발휘하여 Sketch 프로토타입을 프로덕션 준비가 완료된 코드가 있는 앱으로 빠르게 변환할 수 있습니다. 실제 UI 구성 요소로 프로토타입을 제작할 때 UI에 대한 혼란을 제거하고 완벽하게 작동하는 최신 애플리케이션으로 디자인을 웹에 가져올 수 있습니다.

Sketch 프로토타이핑을 Indigo.Design로 내보내기

Design to Code: 프로토타입 Sketch 구축하고 실제 앱으로 변환

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

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

프로토타입 패턴과 구성 요소를 특징으로 하는 Indigo.Design 아이콘

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

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

디자인을 리브랜딩하기 위한 Sketch 앱 프로토타이핑을 특징으로 하는 Indigo.Design 아이콘

Sketch 프로토타입 공유하기

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

Sketch 프로토타입 공유

몇 초 만에 코딩으로 설계

단일 작업 환경을 통해 Sketch 설계를 생산 준비 Angular로 빠르게 만들거나 코드를 Blazor 수 있습니다. 디자이너는 Adobe XD 또는 Sketch와 같은 선호하는 디자인 도구를 사용할 수 있으며 개발자는 Visual Studio, GitHub 또는 즐겨 사용하는 IDE를 사용할 수 있습니다. 설계 사일로를 제거하고 완전히 통합된 design-to-code 시스템으로 잘못된 커뮤니케이션을 줄입니다.

디자인을 코드로 프로토타이핑하는 Sketch 위한 Indigo.Design 특징으로 하는 아이콘

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

사용자 지정 테마와 스타일 Sketch 있는 앱 프로토타이핑을 특징으로 하는 Indigo.Design 아이콘

유연한 테마 기반

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

원격 사용자 테스트를 위한 프로토타입 공유 Sketch

Sketch 프로토타입 제작 및 원격 사용자 테스트

Sketch에서 직접 클라우드 기반 인터랙티브 프로토타입을 제작하고 이해 관계자 피드백을 수집하거나 UX 모범 사례에 따라 사용자 테스트 시나리오를 정의 하여 첫 번째 시도에서 올바른 경험을 만들 수 있습니다.

Sketch 프로토타이핑을 App Builder로 내보내기

모든 것은 App Builder ™ 로 끝납니다

Sketch에서 직접 최첨단 웹 애플리케이션을 생성하고, App Builder의 데이터에 바인딩하고, 하나의 통합된 design-to-code를 통해 코드를 GitHub에 푸시하여 디자이너와 개발자를 전례 없이 하나로 모을 수 있습니다.

참조 앱 갤러리 살펴보기

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

Sketch 및 Adobe XD 지원

Sketch 없음, 문제 없음

Adobe XD에 대한 지원이 이미 제공되고 Figma 제작 중이므로 UX 및 UI 디자인을 위한 주요 도구에 대해 알려드리겠습니다. UI 키트는 동일한 구성 요소, 패턴, 스타일링 및 사용자 정의 세트를 제공하지만 각각은 빌드된 도구의 장점을 활용합니다.

Indigo.Design에 대해 문의하세요

Indigo.Design은 팀이 애플리케이션을 더 빠르게 설계, 구축, 테스트하는 데 필요한 도구를 갖춘 완벽한 디지털 제품 디자인 플랫폼입니다. 자세한 내용을 알아보려면 아래 양식을 작성하세요. 그러면 팀원이 후속 조치를 취하고 귀하와 함께 일할 수 있는 날짜와 시간을 예약합니다.

자주 묻는 질문

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

What is Sketch prototyping?

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

How to prototype in Sketch?

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

How to export a Sketch prototype?

Sketch 프로토타입을 스크린 이미지로 내보내는 것은 더 이상 필요하지 않으며, 진지하게 말하면 2022년입니다. Sketch 플러그인을 사용하여 몇 번의 클릭만으로 번거로움 없이 Indigo.Design 클라우드에 디자인을 게시한 다음 조정할 때만 ctrl+shift+Y로 동기화할 수 있습니다. 이전 방식에 대한 감정이 있고 여전히 화면을 jpeg로 내보내고 싶다면 Indigo.Design Cloud에서 프로토타입 제작을 시작할 때 사용할 수 있는 이미지 기반 프로토타이핑 흐름을 Indigo.Design 있습니다.

How to share a Sketch prototype?

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

대화에 참여