Androidアプリケーションの開発 設計ツール
実際にAndroid アプリケーションを開発するに際し、どんなアプリにするか、必要な機能要望がまとまったら、設計を行います。
そこで、設計作業に使えそうなプロトタイプ作成ツールを調べてみました。
日本語対応のプロトタイプ作成ツール「Prott」
新規アカウントを作成する
まず、下記のリンクにアクセスします。
[無料ではじめる]をクリックします。
牲、名、ユーザ名、メールアドレス、パスワードを入力し、会社で利用か個人で利用を選択し、[次へ]をクリックする。
利用用途をフリーランス、趣味・サークル、副業、授業、その他から選択し、[サインアップ]をクリックする。
※最初の30日間は有料の機能を全て使用することができます。
※無料プランは1つのプロジェクトのみが編集可能ですが、スクリーンの数には制限がありません。
ログアウトして、再度サービスにログインするには、下記からログインします。
https://prottapp.com/users/sign_in
プロジェクトの作成
まず、新規にプロジェクトを作成します。
管理画面から「新規プロジェクト」をクリックします。
プロジェクト名を入力し、デバイス、デバイスの向きを選択し、[新規プロジェクトを作成する]をクリックします。
今回は、Androidアプリなので、デバイスは、Nexus７を選択しました。
※デバイスの向きは途中で変更できないので注意して下さい。
スクリーンを作成
プロジェクトを選択すると作業画面が表示されます。ここにスクリーンを追加して行きます。
スクリーン追加方法ですが、3つの方法があります。
- ワイヤーフレーム機能を使って作成
- PCから画像を追加
- Dropboxから画像を追加
ワイヤーフレーム機能の使い方
「ワイヤーフレームを描く」をクリックします。
要素をドラッグアンドドロップで配置
ワイヤーフレーム作成に必要な基本的なコンポーネントが用意されています。
Androidアプリ向けのコンポーネントも用意されていますので、使いたい要素をドラッグアンドドロップで簡単に配置ができます。
ワイヤーフレームの作成が出来ましたら、「保存」をクリックし、保存します。
プレビューでプロトタイプを確認
作成したプロトタイプをプレビュー機能で確認しましょう。スクリーンを選択し、画面上部の「▷プレビュー」をクリックします。
プロトタイプをシェア
URLを発行、共有するだけで、Prottを利用していない人にも簡単にシェアすることができます。
URL共有の他に、QRコード埋め込み、<iframe>タグ埋め込みが可能です。
まずは画面右上のシェアアイコン
を押してください。するとシェア画面が表示されます。
「共有設定をオンにする」をクリックします。
※共有によってプロトタイプが外部に漏れるリスクがある場合には、「パスワードを設定する」にチェックを入れて下さい。