画面遷移プロトタイピングツールを15分間だけ色々試してみる
プロダクトの最初に大抵やること。それはペーパープロトタイプの作成!
作成したラフスケッチをペーパープロトとしてデバイス上で管理、動作をつけられる
アプリケーションを試してみました!
15分だけ!
なので、深い所は分かりませんが、最初に触った直感のみの感想を書きたいと思います。
Prott
【プロトタイプ対象】
- スマートフォンアプリ
【動作環境】
【特徴】
- スマホのアプリのモックアップを作成するためのツール
- 最初のチュートリアルでは、完成されているUIに対して、リンクと動作を貼っていく
- 画像をアップロードして、その画像に対してアクションを設定する事がメイン
- ワイヤーフレームを用意されているパーツを用いて新しく作成可能。
- 基本的なパーツは揃っている。
- 凝ったUIをこれを使って作成しようとすると難がありそう
- 凝ったUIはそれこそ他のソフトやラフスケッチにして画像として取り込み、そこへのリンクを前提としている。
- すぐにデバイスをモチーフとした形のプレビューを表示出来る
- モバイル上でも編集、追加が可能。
日本製のアプリケーションということもあり、親近感が湧きます。
画像だけでなく、簡単なUIならワイヤーフレームの機能を使い、新規で作成できるので、
かゆいところに手が届くものになっていますね。
POP
【プロトタイプ対象】
- スマートフォンアプリ
【用途】
- ペーパープロトタイプ画面遷移
【特徴】
- スマホのアプリのモックアップを作成するためのツール
- 画像をアップロードして、その画像に対してアクションを設定する事がメイン
- 画像からのみのモックアップ。新しくUIを一から作成することはできない
- プレビューをすぐに表示可能。
- モバイル上でも編集、追加が可能。
Prottとほぼ変わりません。ただ、UIを新しくアプリケーション上で作成できず、画像のみの使用となります。
その点を除けば他に大きな違いはありません。
Marvel
【用途】
- ペーパープロトタイプ画面遷移
- 簡単なUIをフリーハンドで描画できる
- Webプラウザ
【特徴】
- スマホ、PC、タブレット、Watchのプロト遷移を作るためのツール
- 画像をアップロードして、その画像に対してアクションを設定する事がメイン
- 簡単なUIをフリーハンドで描画できるCanvas機能
- プレビューをすぐに表示可能。
ProttとPopと違い、ほぼ全てのデバイスの遷移のプロトを作れるというツールです。
シンプルで分かりやすく、アクションの文字もでかくてスッキリしてるなという印象です。
InVision
【用途】
- ペーパープロトタイプ画面遷移
- インスピレーション用Boards
- Workflowを用いたかんばん形式のプロト管理
【プロトタイプ対象】
- Desktop(Web)
- Tablet
- SmartPhone
- Watch
【動作環境】
【特徴】
- スマホ、PC、タブレット、Watchのプロト遷移を作るためのツール
- 画像をアップロードして、その画像に対してアクションを設定できる
- プロジェクトに関わっている人がインスピレーションを共有できるボードもある
- Workflowを用いたカンバン形式のプロト進捗管理
- プレビューをすぐに表示可能
- LiveShare
- ホワイトボード
- スナップ写真
- その他色々。。(多くて書ききれませんでした(汗))
ほぼ全ての環境でのプロトが実現できるツール。機能が豊富で、Workflowを用いたプロトの進捗も管理できます。
色々な環境のUIのプロトを製作したいアプリには必見です。これは本当にすごいです!
調べて使ってみたいなと思ったもの
【チームで使うなら】
チームで使うなら是非「InVision」を使ってみたいです!!
コメントを一番残しやすく、WorkflowとBoardsがなんといっても魅力的でした。
自由度がとてもあるので、チームメンバーとはこれを使って盛り上がりたいですね。
【個人で使うなら】
個人で使うなら「Prott」を使いたいです!
日本製という親近感はやはり捨てがたいですし、プレビューを見せる時にデバイスをモチーフにして見せてくれるところとかが良いですね。
ささっと紙に書いて、ささっとアクションを貼って、ささっと確認するのにいいなとすごく思いました。