FREENANCE Ad

機能が多彩な個性派プロトタイプツール9選と、使いこなすためのポイント

プロトタイプ - 使い方とツールのオススメ
FREENANCE Ad
デザインや機能の変更に関する要望を早期に洗い出すのに便利な、プロトタイプの作成を支援するツールが増えています。

遠回りのように見えても、多くのプロトタイプを通して製品の質をあげることが、プロジェクトを成功させるための近道です。

プロトタイプを使いこなすための注意事項

プロトタイプに関する3つコツ

フィードバックしやすくするために工夫を

共有したプロトタイプに対してフィードバックをもらうためには、フィードバックを与えやすい状況を作っておくことが大切です。

フィードバックがしやすいツールを利用するのはもちろん、プロトタイプを送るときに、メッセージを添えましょう。

リアルな環境でのテストを

実際に使うことが想定されるターゲットや、実際の端末を使ってテストすることによって、より現実で起こりうる問題に気がつくことができます。ユーザビリティは徹底してテスティングをすべきでしょう。

本番の製品を開発したあとで問題が見つかった場合、修正するのに多くの時間とお金がかかってしまいがちです。

実際のコンテンツを使う

完成品にコンテンツが表示されるなら、実際に表示するコンテンツを使ったプロトタイプをデザインしましょう。ニュース配信アプリであれば、記事が表記されるところを空白や適当な文字で埋めてしまうと、実際のユーザーの目に映るデザインとは異なるため、あまり意味がありません。

機能重視&個性派プロトタイプツール9選

この記事で紹介する9つのプロトタイプツールには、それぞれ独自の機能や強みがあります。ただ人気があるからではなく、実際に自分の欲しい機能が備わっているかを見てから選ぶと良いでしょう。

1. CanvasFlip

キャンパスフリップ

トランジション型とインタラクション型を複合させた機能を持つ複合型のツール。インド発祥の『CanvasFlip』は、ユーザーからのフィードバックを自動で収集する機能がついたプロトタイプツールです。ユーザーテストを重視したい場合におすすめです。

料金:0円〜

CanvasFlip

2. CRAFT + inVision

フリーハンド

プロトタイピングに、手書きでフィードバックを与えられるツールです。フリー画像を使えるほか、チームで同時に編集できるなど、ブラッシュアップには欠かせない機能が盛りだくさんです。

料金:0円〜

CRAFT + inVision

3. Proto.io

Proto.io

『Proto.io』 は、モバイルアプリのデザインやプロトタイプを専門に行うWebベースのアプリです。コンポーネントのライブラリがあったりなど、さまざまな機能が備わっているため、求めているアプリを忠実に再現できます。タッチ、タップ、長押し、ピンチ(ズーム)などのジェスチャーやトランジションにも対応しています。

『Proto.io』 のライブラリには、アイコンやバナー、UI要素などを備えてあります。もちろん自分のパーツをアップロードして使うこともできます。対応OSは、iOS、Android、Windows Mobileなど。

誰もが知っている大手企業を含む幅広いユーザーから支持を得ています。

金額:24ドル〜 / 月

Proto.io

4. Pidoco

Proto.io

ドラッグ&ドロップでプロトタイプの作成ができるPidocoは、HTMLファイルとしても出力ができるツールです。400以上のインタラクティブ要素やアイコン、キーボードやタッチのジェスチャーがライブラリに揃っています。

フィードバックのためのコラボレーション機能が充実しているのも特徴。バージョニング、コメント履歴、問題追跡など、充実しています。Pidoco はデスクトップ、iOS、Androidで使えるので、実機でのテストが可能です。

金額:12ドル 〜/ 月

pidoco

5. InVision

InVision

日本でも多くデザイナーが利用している『InVision』も、おすすめのツールです。コード書かずに、動きのあるプロトタイプを作れます。最新の進捗状況を全員に共有するのにも適していて、そのぶんたくさんの愛用者がいます。その数すでに100万人近く。

UIデザインツールのSketchと連携させることができたり、画面の一覧がダウンロードできたりと、多彩な機能を自由に操れます。

金額:0円〜

InVision

6. HotGloo

HotGloo

『HotGloo』は、複数人で同時に編集できる、UX、ワイヤーフレーム、プロトタイピングのツールです。編集してからチームに報告してフィードバックを待つのではなく、リアルタイムで共同編集できるのです。チーム内の連携がとりやすくなります。

直感的な使用感も長所です。かといって簡素なものしか作れないわけではなく、複雑なeコマースのストアも作成できます。現在も着々とアップデートされている、注目のツールです。

金額:13ドル〜 / 月

HotGloo

7. PowerMockup

PowerMockup

『PowerMockup』は、Microsoftパワーポイントのアドオン。たったの数クリックでアプリのモックアップをデザインが作れる、効率化に徹したツールです。パワーポイントにすでに備え付けてあるおなじみのアニメーションやスライドショーの機能を利用しています。ホームページから体験版をダウンロードできるので、試してみては?

金額:59.99ドル〜 / 月

PowerMockup

8. Prott

protto

名だたる企業も導入している『Prott』は、コードを書かずに本物のようなアプリを再現できるプロトタイプツールです。ユーザテストにも使えるので、実装前にサービスの価値検証が可能です。

金額:0円〜

prott

9. Origami Studio

origami

デザインソフト『Skecth』との高い互換性が話題の『Origami Studio』。アニメーションをはじめとするインタラクティブな要素がうまく機能するかをテストできます。インポートした要素が、思いのままに動くかどうかを確認できます。実機にフルスクリーン表示させることもできるので、より正確な判断をだせそうです。

金額:0円〜

Origami Studio

 

(翻訳:Yutai Satake)

SHARE

  • 広告主募集
  • ライター・編集者募集
  • WorkshipSPACE
デザイナー副業案件
Workship