読者です 読者をやめる 読者になる 読者になる

ぬんびりぶろぐ

アイロンビーズ/スマートフォン/Webサービス/開発などについて書いてるブログです。ゆっくりしていってね。

お天気ニュースアプリのUIができるまで

iPhone アプリ デザイン
 

 
 

アイロンビーズが日課!ヌン(@nun_)です!

f:id:nunchaku:20121217113643j:plain

iOSのお天気ニュースアプリのUIをつくってみました!

リリースされていないし、リリース予定とかないですけど!

さわって楽しむお天気ニュースアプリ「パタパタ天気」

どんな課程でできあがったのかをまとめてみます。

 

 

お題「お天気ニュースアプリ」

 

 

1.どんなアプリにしたいか

 

だれに、いつ、どこでアプリを使うのか/使ってもらいたいか を

イメージして導き出しました。

 

だれに

・通勤や通学をする人に

→学生や社会人の男性、女性

 

いつ

・通勤や通学する前に自宅で使う

→どちらかというと忙しいシーン

 

どこで

・電車の中

→込み合っている電車で、片手は吊革をつかんでいる

 

ということは、

 

・片手で操作できる

→親指で画面をスクロールする操作

 

・すばやく見たい情報に行きつける

→起動したらすぐに1画面に見たい情報がおさまっている

見たい情報:今日一日と週のお天気情報

 

 

2.絶対に盛り込みたいこと

 

毎日使うアプリなので、楽しく使えるものにしたい!

 

・「楽しく」とは?

→触りたくなるしかけがあること

 

 

3.デザインのモチーフを決定

 

モチーフは 触りたくなるしかけ を入れられる かつ、

1.のどんなアプリにしたいか とマッチするもの

スクロールするとパタパタと折れたり開いたりするじゃばら

 

スクロールすることが自然で、

アニメーションや音を組み合わせることができ、

見せたい情報を表示させられるスペースをとれるモチーフ

ということから、じゃばらを思いつきました。

 

モチーフが決まったあたりから、なんとなくだったアプリ名を本腰いれて考えます。

素敵なアプリには素敵な名前が必要です。

 

 

4.ちょっと突っ込んだラフスケッチを描く

 

f:id:nunchaku:20121217114644j:plain

スケッチはアイデア出しの段階から描いてますが、すこし突っ込んで描いてみます。

これはiPad miniのノートアプリを使用して描きました!

 

 

5.Photoshopでデータをつくって完成!

 

f:id:nunchaku:20121217113643j:plain

という感じで出来上がりました。

もっとかっこよくつくれるようになりたい・・・

さわって楽しむお天気ニュースアプリ「パタパタ天気」

 

 

■寄り道

 

じゃばらのアイデアは後からでたので、

それまではタブにしてみたり、いろいろ悩みました。

こんなのとか↓

f:id:nunchaku:20121217114750j:plain

 週の天気表示できてないし、うううううううううん><

 

 

■想定している仕様や野望

 

・全世界向けにリリースしたい

→曜日のところと時刻表示を変更可能にするとか

 

・触ったときの音やアニメーションがどうすればもっと素敵になるのか考える

 

・スクロールする幅によって時の流れに変化をつけたい

→長めにスクロールすると6:00から一気に18:00にできる

 

・起動したら1つぶんパタッと動くアニメーションをつけたい

→動かせる方向がすぐにわかるようにするため

 

Android版を考えるときは、ウィジェットやライブ壁紙との組み合わせを検討したい

 

あと、いま背景が木目なんですが

木目でなきゃいけない根拠がない ので、

もっと最適なものがあるんじゃないかと思って、いまだに探しております。。。