はじめてでも、プロトタイプを作成できます
リッチでインタラクティブなワイヤーフレームを作成して Web アプリやモバイル アプリを定義することで、作業のやり直しや、誤解を避けることができます。
プロトタイプをドラッグ & ドロップでビルド
ワイヤーフレームからインタラクティブなプロトタイプへ
![]()
Justinmind を使用することで、豊富なコンポーネントやアクションのギャラリーを用いて、非常にインタラクティブなワイヤーフレームを簡単に描くことができます。長方形やテキストなどの基本図形は、もちろんのこと、メニュー、フォームフィールドやデータ一覧など、ディスプレイ特有のコンポーネントも提供しています。
モバイル アプリのプロトタイプ用ジェスチャー
![]()
iPhone、Android、iPad 向けアプリケーションのすばらしいプロトタイプを作成できます。作成したプロトタイプ内で、スワイプ、タップ & ホールド、ピンチや回転のジェスチャーのシミュレーションが可能です。デバイスの向きのキャプチャも可能で、反応の良いデザインのシミュレーションが可能になります。
オリジナル ウィジェットの作成
![]()
オリジナルのウィジェットを作成して、独自のウィジェット ライブラリに含めることができます。アイテムをグループ化し、ウィジェット ライブラリにドラッグするのと同じくらい簡単です。Justinmind では、iPhone、SAP、iPad、Blackberry や Android 用のウィジェット ライブラリを提供しています。
スタイルの定義
![]()
ガイドラインや丸まった角、画像のクロップや色のグラデーションを使用して、忠実度の高いワイヤーフレームを作成することができます。Justinmind のテンプレートやデザイン ツールを使用することで、コンポーネントのビジュアル アスペクトをピクセル単位で設定できます。
画像の読み込み作業も簡単
![]()
Photoshop の様なデザイン ツールや Web ブラウザーから画像をドラッグ & ドロップでインポートできます。カラーキャプチャ ツールで、作成するデザインの色のキャプチャや保存が可能です。
変更部分をすぐにテスト
![]()
[Simulate (シミュレート)] ボタンクリックするだけで、変更したプロトタイプのデザインをすぐに確認できます。このプロトタイプ作成ソフトウェアにより、すぐに作成したアプリケーションのプロトタイプのシミュレーションができます。
アクションの追加
すぐに動作のシミュレーション
![]()
一行のコードも書かずに、"show and hide content (コンテンツの表示/非表示)", "change styles (スタイルの変更)", や "conditional navigation (条件付のナビゲーション)" などのアクションのシミュレーションが可能です。これらのアクションは、Onclick, OnMouseOver, OnkeyPress などのイベントがきっかけとなり動作します。
フォーム & データグリッドのシミュレーション
![]()
フォームやデータグリッドの動作のシミュレーションも可能です。更にフォームのバリデーションやメッセージも追加することができます。コーディングやデータベースの知識は必要ありません。
画像データの追加
![]()
ワイヤーフレームに画像を追加し、イメージマップ コンポーネントでリンクやアクションを追加することができます。Justinmind のコンポーネントで静的な画像に双方向性を追加することで、より生産性の高いプロトタイプの作成が可能になります。
If…Then… (条件分岐もコード不要)
![]()
ドラッグ & ドロップで、条件分岐やフォームのバリデーションを作成できます。演算子やフィールド、変数やデータの組み合わせなどの技術的な専門知識なしで、ワイヤフレームで高度な動作のシミュレーションが可能です。
再利用と一括変更
![]()
テンプレートを使用して、すべてのコンポーネントが規定の外観になるようにワイヤーフレームのスタイルガイドを設定できます。
データの共有
![]()
変数を使用することにより、任意のデータを特定の画面から別の画面に移動したり、ある条件の確認に使用することもできます。変数やデータ マスターを使用して、動的なアクションやビジネス ロジックのシミュレーションが可能です。
ドラッグ & ドロップのシミュレーション
![]()
アニメーション ユーティリティを使用すると、コンポーネント上で、プログレスバーや動的なメッセージや動作をワイヤーフレームに追加することができます。
オンライン コンテンツ、HTML & Flash
![]()
インターネット上にある Flash やビデオ コンテンツも追加できます。Google マップや YouTube ビデオ、またオリジナルのオンライン ウィジェットもワイヤーフレームに追加可能です。
共同作業 (共有 & エクスポート)
ワンクリックでドキュメントができます!
![]()
Justinmind で、作成したプロトタイプのすべての情報を Microsoft Word または Open Office ドキュメントにエクスポートでき、簡単に仕様書を作成することができます。
インタラクティブ HTML へのエクスポート
![]()
作成したワイヤーフレームをすべてのアクション、コンディション、バリデーションを含めてエキスポートできます。HTML のプロトタイプをユーザーやお客様、プロバイダーへ送り、彼らの Web ブラウザでテストすることができます。
一つのプロトタイプを複数のデザイナーで共有
![]()
チーム内で、同時に同じプロトタイプで作業することができます。特別なサーバーなどを用意する必要もありません。Justinmind のクラウド サービス「Usernote」ですべてのことを処理できます。
アプリのプロトタイプをモバイル デバイスでテスト
![]()
作成したワイヤーフレームをクラウド コラボレーション サービス (別名 "Usernote") で公開し、iPhone や iPad などのモバイルデバイスでテストすることができます。詳細はこちら。
便利な機能
機能 | 概要 |
基本的なプロトタイプ作成 | 基本的なモバイル向けプロトタイプの作成方法 |
SVG ファイル | デバイスに左右されないイメージを提供する SVG ファイルの活用方法 |
Sketch との統合 | Sketch で作成したデザインをプロトタイプへ変換する方法 |
外部リンクの実装 | ビデオ、オーディオなどの外部リンクをプロトタイプへ実装する方法 |
メッセンジャーアプリの作成 | メッセンジャーアプリを作成する方法 |
機能比較
Enterprise Edition と Pro Edition の機能比較
Web とモバイル プロトタイプ開発 | Enterprise Edition
| Pro Edition
|
---|---|---|
プロトタイプ数 | 無制限 |
無制限 |
スクリーン数 | 無制限 |
無制限 |
ユーザーの数 | 無制限 |
無制限 |
インストール済みの UI キット - Web, iOS, Android, ダイアグラムを含む。 | ![]() |
![]() |
基本的なインタラクション:リンク | ![]() |
![]() |
レスポンシブ デザイン - パーセンテージ ベースのコンポーネントと優れたピン止めオプション。 | ![]() |
![]() |
Sketch 統合 - Sketch Artboards からインポートした素材を Justinmind 上で編集が可能。 | ![]() |
![]() |
UI キットの追加 - Kendo, Zurb, Font Awesome を含む多数の UI キット。 | ![]() |
![]() |
Web インタラクション | ![]() |
![]() |
条件付きナビゲーション | ![]() |
![]() |
モバイル ジェスチャー | ![]() |
![]() |
アニメーション、トランジション、エフェクト | ![]() |
![]() |
フォーム/データリスト | ![]() |
![]() |
独自の UI キットの作成 - Web およびモバイル アプリのすべての画面でレイアウトのデザイン、コンテンツの再利用が可能。 | ![]() |
![]() |
グローバル デザインシステム - UI キットを一括管理し、デザイン チーム間での同期機能。 | ![]() |
コラボレーションとテスト | Enterprise Edition
| Pro Edition
|
---|---|---|
コラボレーション サービス | Cloud |
Cloud |
シェア/コメント | ![]() |
![]() |
デバイス上でプロトタイプのテスト | ![]() |
![]() |
設計 - 開発ハンドオフ- プロトタイプから CSS の取得。 | ![]() |
![]() |
コラボレーション サービスの保存 - オンラインでデザインの公開、フィードバックの集計。 | 600 MB/ユーザー |
300 MB/ユーザー |
チームプロトタイピング | ![]() |
![]() |
ユーザー テスト ツールの統合 - お好みのテスト デバイスでプロトタイプをテスト。 | ![]() |
要求管理とフロー チャート | Enterprise Edition
| Pro Edition
|
---|---|---|
ダイアグラムを使用してのフロー チャート | ![]() |
![]() |
要求管理 | ![]() |
|
JIRA、TFSとドアの統合 | ![]() |
|
カスタマイズ可能な要件 | ![]() |
Export and Documentation | Enterprise Edition
| Pro Edition
|
---|---|---|
ドキュメントの生成 - 仕様書のエクスポート | ![]() |
![]() |
インタラクティブな HTML にエクスポート | ![]() |
![]() |
独自の仕様書の生成 | ![]() |
|
API と SDK -プラグインもしくは、他ツールを使用してプロトタイプの出力先の変更が可能。 | ![]() |