昨日のブログに引き続き『PhotoMoney』の開発にまつわるイロイロについて。
（過去記事
あの娘ぼくが『PhotoMoney』のアイコンデザイン決めたらどんな顔するだろう）
今回は
アプリのアイコンと起動後のデザインに統一感を持たせることで、UIにリズム感が出るように工夫してみたヨ☆
という話です。
試行錯誤を経て出来上がった『PhotoMoney』のアイコンがコチラ。
下の部分に影をつけることで、立体的なボタンっぽいデザインになっています。
そして、このアイコンをホーム画面に置くとこうなります。
（アラ！？もしかして@100nasuのホーム画面初公開かも？ホーム画面の解説は機会があればまた改めてｍ(_ _)ｍ
『PhotoMoney』のアイコンが色違いで２つ並んでいるところなんかは、他の人から見ればちょっと不思議な感じ・・・ですかね？？？）
当然のコトですが、ボタン型のアイコンをタップするとアプリが起動します。
つまりユーザーはここで
「あ、ボタンを押すと何かが起こるんだな～」
という体験を（無意識のうちに）します。
アプリを起動直後にユーザーが目にするのは、支出の写真がズラッと並んだ画面です。
（もちろん初回起動時は写真は０枚ですが）
ここでユーザーが行えるコトは主に以下の２つ。
・支出を入力する画面を開く
・各支出を大きな写真で確認する
『PhotoMoney』は家計簿アプリなので、ユーザーの動線としては一つ目の「支出を入力する画面を開く」がメインだと思われます。
なので「支出を入力する画面を開く」ためのタップ領域を、アイコンと似ているボタンで表現。
ここでユーザーは再び
「ボタンを押すと何かが起こる（支出入力画面が開く）」
という体験をします。
支出の「写真」と「金額」を入力した後にタップするいわゆる「完了」ボタンも、アイコンと似ているデザインにしています。
つまりここでもユーザーは
「ボタンを押すと何かが起こる（支出が保存される）」
という体験をするわけです。
文章にするとなんだか小難しくなっちゃいましたが、要するに
「ポンッ！ポンッ！ポンッ！」って感じですw
家計簿をつける際の最大のネックは「面倒くささ」ですが、それを何というかスピードをつけて勢いで
「ホップ！ステップ！ジャ～ンプ！！」とユーザーに飛び越えてもらうイメージとでも申しましょうか。
アプリのUIではリズム感も超～大事（｀・ε・´）b
個人的には「ボタン型のアイコン」⇒「ボタン型のUI」でユーザーの動線を作る手法はかなり有効な気がしています！
これからもアプリ開発＆アプリUIの試行錯誤、色々チャレンジしてみますヨ～☆
しかし、アレコレ考えて作った『PhotoMoney』も、いまだランキング浮上する気配ナシ・・・（涙）
アプリ開発は甘くないネ～щ(´∀｀;)щ
