*

「なんか違う。」を潰しきれ!アプリのプロトタイプを手軽に作れるPrott

      2015/10/07

Prott

今日は10月から正式にローンチしたProttについてご紹介します。

Prottはベータ版まではブラウザ版のみでしたが、10月からMac、Windowsアプリと、iOSアプリが出ています。

なお、今回はブラウザ版を中心に書きます。

Prottとは

アプリのプロトタイプをサクッと作れるサービスです。(おおざっぱ。)

詳しくはこちらのサイトをご覧下さい。

あっという間にプロトタイプがつくれるツール「Prott」!グッドパッチ様とユーザーレビュー会も開催しました!

私は今まで3つアプリを作りましたが、

『まずは機能を作るんだ!デザイン?気に入らなかったらそこだけ直せばいーじゃん。OK,OK。』

と、突っ走って開発を先行して進めました。

その結果どうなったか。

『なんか違う。』

その言葉とともに、かけた工数が一瞬で水泡に帰すという刑を何度も受けるはめになりました。。。

もう、泣くに泣けない。

だって自分が悪いんだもの。

とくに個人で開発しているので、一日にかけられる時間が少ない。

つまり、可能な限り時間を節約しなきゃいけない。

それなのに、逆に時間がかかってしまう結果となってしまったんですよね。

そこで今回は、悪魔の言葉『なんか違う。』を極力潰しきるため、プロトタイプをまずしっかり作ろうと考えました。

人は学習する生き物だからね。(3回目でやっと覚えた。)

Prottを使う

Prottを使う場合、はじめに公式サイトでユーザ登録をします。

https://prottapp.com/ja/

Prott for Browserの下のアカウント作成ボタンを押しましょう。

その後、アカウント情報を入力して登録が完了すると、ツール画面が開きます。

最初にチュートリアルのプロジェクトがありますので、チュートリアルを見つつ、やり方を覚えましょう。

このチュートリアルで大概の操作はわかりますので、見ておいた方が良いですよ。

画面の作成はイメージを投稿するだけ

新しいプロジェクトを作成したら、画面を作ります。

画面は基本的にイメージをドラッグ&ドロップで持って行くか、ファイルを選択して追加します。

私はスケッチブックに書いたラフを写真に撮って、それを投稿しました。

ブログ感覚でイメージを投稿出来るのはありがたいです。

ちなみに、iOSアプリの場合はアプリから直接写真を撮影して投稿することができるので、かなり捗りそうです。

マウス操作で簡単に遷移ができる。

画面の遷移設定も簡単。

ボタンとなる場所をドラッグで選択して、遷移先のページを選ぶだけ。

さらに、タップやスワイプといった遷移方法も選べます。

これがほんと簡単。サササッと10分も経たずに設定が終わりました。

設定が済んだら、プレビューを見ましょう。

遷移を設定したエリアを押す事で、画面が切り替わって行きます。

これでプロトタイプの出来上がりです。

アプリでさらに実感が湧く!

iPhoneだけですが、Prottはスマホアプリがリリースされています。

このアプリがほんといい!

何といってもプレビュー機能が素敵。

ブラウザはiOSシュミレータで動かすような形になりますが、アプリでは実機テストと同じ形になります。

ですから、より実感が溢れるものになります。

自分も使っていて、ここのボタン配置は押しにくいなと、ブラウザでは気が付かなかった事に気付きました。

これはほんと使えます。

無料プランは1プロジェクトまで。

正式ローンチされ、有料プランも出来ました。

料金プラン

無料プランは1プロジェクトまで。

2プロジェクト以上作りたい人は、有料プランになります。

機能制限等は今の所ないようですね。

個人開発としては、同時並行でアプリの作業をする事は無いので、1プロジェクトだけでも十分活用出来る内容です。

最後に

個人開発ですとデザイナーなんていませんから、自分で考えるしか無い。

でも、それだとどうしでも独りよがりなものになってしまうんですよね。

こういったプロトタイプがあれば、周りの人からも意見が貰いやすいので、良いアプリ作りに活かせそうです。

 - アプリ, ライフ