アプリ開発に役立つ！「Prott」はドラッグ＆ドロップで「動くプロトタイプ」が作れる神ツール

前職を卒業する数年前、プロトタイピングツール「Prott」に出会っていれば……と思うと悔しい。

社外からは「華形」と言われ、社内からは「開発もデザインもできない雑用」として扱われるアプリのプロデューサーやディレクター。実際に動くものを作るエンジニアやデザイナーも大変だが、そこに行き着くまで脳内にあるイメージを正確にアウトプットするのは意外と難しいのだ。

さらに上司や役員などに新規アプリをプレゼンする場合は難易度がさらに上がる。実際イメージしてもらいやすいために「動くプロトタイプ」を作る必要があるが、これがとにかく難しいのだ。パワーポイントでスマホの画面を描き、レイヤーを重ねながらアニメーションで画面の遷移を再現している人もいるのではないだろうか。

可能であれば新しいアプリ案を次々と考えたい。画面遷移図やプロトタイプの重要性はよく理解しているが、できるならもっと効率的に作業をしたい。

プロデューサー/ディレクターの皆さん、「Prott」を使いましょう。今すぐ、使いましょう。

UI/UXデザインを専門とするGoodpatch（グッドパッチ）のプロトタイピングツール「Prott」を今更見せてもらったのだが、あまりにも便利すぎて鼻血が出そうになったので、まだ使ったことがない人は目を通してみるべし！

ブラウザで実際に動作するプロトタイプを作成し、iPhoneで確認できる神ツール

まずは「Prott」の紹介動画をどうぞ。

「Prott」は一言で言うとブラウザで実際に動作するプロトタイプを作成し、iPhoneで確認できるツールだ。ハッキリ言ってアプリのプロデューサー/ディレクターにとって神ツールと言っても過言ではない。僕が会社員時代、無駄にした時間を是非とも返して欲しいと思えるほど便利な機能が揃っている。

以下に個人的にアピールしたい「Prott」の魅力をいくつか紹介する！

あらゆる画面サイズに対応したプロトタイプを作成可能

新規アプリを考える場合、iOSアプリだけではなくAndroidアプリも用意することが当たり前になてきた。ただ、それぞれの画面遷移を作るのはかなりのハードワークだ。もっと効率化したい。

「Prott」は「iPhone 6/6 Plus」やiPadを含むiOSアプリはもちろんのこと、Androidアプリにも対応。ウェブ用のプロトタイプを作成できる他、最近ではApple Watch用アプリにも対応している。

使い方は至ってシンプル。手書きで画面図を作成し、それをiPhoneアプリやAndroidアプリで撮影し取り込む。タップ領域とタップの遷移先、そしてタップ時のアニメーションを選ぶことによって実際に動作するプロトタイプを簡単に制作することができるのだ。

実際に「Prott」を使っている様子は以下の動画で確認するべし！

SlackやHipChat、Dropboxなど外部サービスとも連携可能

地味に嬉しいのがSlackやHipChatなどのチャットツールに対応しているということ。

アプリ開発には多くの人が関わり、多くの人の思いや考え方がぶつかり合う場だ。「Prott」では作成したプロトタイプの各要素ごとにコメントを入れることができ、それらを外部のチャットツールと連携することによって見逃さずにチェックできるようになる。

さらに、Dropboxとも連携するようになっため、Dropbox内に保存したファイルなどを簡単に呼び出し追加することができるようになった。この機能はワイヤーフレーム機能を使用する時にも力を発揮する。

困った時に！ワンクリックで呼び出せるチャット機能の提供

この手のサービスを使い始めて最も避けたいのは途中で使い方が分からなくなり、「結局パワポで作った方がいいじゃん」となってしまうということ。

運営するGoodpatchはこれを解決するためにワンクリックで担当者を呼び出せるヘルプチャットを用意。営業時間内であればなかなかのスピード感を持って返信をもらえるとのこと。行き詰まってしまった場合は活用するべし！