ブランドに適合する上質なデザインを構築
Sketchに組み込めるデザインライブラリーが提供されます。このライブラリーは実開発で利用できるUI要素や画面パターン、アプリケーションのひな形が含まれています。各コンポーネントの拡張性とカスタマイズ性が高いため、ブランドに適合する社内標準デザインを作成することができます。
プロトタイプの共有、フィードバック、ユーザビリティテスト
デザインした画面をインポートし、クラウド上でプロトタイプを作成できます。関係者やエンドユーザーへの共有、フィードバックループ、ユーザビリティテストを実施し、ゴールを共有するのに役立ちます。手戻りのない画面実装を実現しましょう。
1クリックでコードを生成
作成、テストされたプロトタイプをもとに画面コード(HTML/CSS/Angularコード)を生成します。①のデザインライブラリーは実開発で利用できるUIコンポーネント、Ignite UI for Angularがあらかじめマッピングされているため、デザインを忠実に再現することができます。
Indigo Design System
-
Ignite UI for AngularにマップされたSketchライブラリーを使ってデザイン
50種類以上のIndigo.Design Sketch UIコンポーネントが、Ignite UI for Angular UIコンポーネントにマッピングされています。 このSketch UIコンポーネントを使って画面デザインを行うことで、HTML、CSS、Angularコードが出力できるようになります。
プロトタイピング & ユーザビリティテスト
-
クラウド上でプロトタイプを作成
Sketchドキュメントやイメージをインポートし、ユーザーフローを示すインタラクション、トランジションを追加できます。作成したプロトタイプは共有可能かつ、さまざまなデバイスで確認することができます。
Angularコードアセット
-
Angularアプリケーションコードを生成
Visual Studio Codeプラグインを使用し、Indigo.Designにアップロードされているプロトタイプにアクセスできます。プロトタイプ内の必要な画面を選択し、コード生成を実行することで、Angular向けに最適化されたHTML、CSS、TypeScriptファイルが生成され、プロジェクトに追加されます。
製品ロードマップ
Indigo.Designはデザイナーとデベロッパーの間で起こりがちな技術的制約、コミュニケーション不足を理由とした画面デザインと実装コードの差異、また顧客の要件から乖離することで発生する実装時の手戻りといったプロジェクトの遅延、失敗要因を取り除くことができる画面設計・開発プロセスを提供するアプリケーションデザインプラットフォームです。
Indigo.Designは4つの主要コンポーネントから構成されています。
- Sketchライブラリーとして提供されるコンポーネント、パターン、アプリケーションデザインが含まれるIndigo.Design Sketch UIキット
- クラウドサービスとしてイメージベースプロトタイピングやフィードバック、リモートユーザビリティテストが実施できるIndigo.Design Cloud
- Visual Studio Codeの拡張機能としてAngularコードを生成するIndigo.Designコードジェネレーター
- モバイル、デスクトップ、Webアプリ向け高パフォーマンス、タッチファーストAngularアプリケーションの構築を支援するIgnite UI for Angular
個々のコンポーネントはそれぞれ下記の要素に関して個別にロードマップが策定されています。
- ツール連携の中で開発チームのコラボレーションと生産性向上に寄与できる価値をどのように提供するのか
- それぞれのコンポーネントにおいて、対応するツールの数をどのように拡張していくのか
2018年後半にかけては、それぞれコンポーネントにおいて個々の機能強化を予定しています。近日公開予定のロードマップをこちらで公開いたします。ご期待ください！
製品の提供時期につきまして(2018年7月18日更新)
Indigo.Designは2018年7月19日の提供開始を目指し開発を進めて参りましたが、皆様にご満足いただける、より質の高い製品・サービスを提供するために提供開始日を2018年7月26日と変更いたしました。ご迷惑をおかけいたしますが、今しばらくお待ちいただけますと幸いです。また、ご連絡フォームにご記入いただくことで製品の提供開始を個別にご案内いたします。何卒、よろしくお願いいたします。
