Android版「FusionCalc」開発秘話(2)〜Androidデザイン・UIの最適化〜

1/16/2015 Leo Rivas(リオ・リーバス) 0 Comments

iOSで一度作ったアプリをAndroidへ移植するには、プログラムを完全に書き直す以外にも様々な最適化が必要です。デザイン一つをとっても、一度作った物を丸々使い回しできるほど単純ではありません。

Android版の「FusionCalc」を作る上でプログラムを自分で取得する事は今回は諦めましたが、流石に全てを丸投げできるわけはなく、それなりに自分でもAndroid開発の勉強をする必要がありました。

まず、画像リソースですが、Androidは解像度が異なる端末が沢山あるので、一つの画像につき5パターンほど大きさの違った画像を用意しなければなりません。
そのため、アプリ内で使用する画像全てをAndroid用にサイズを調整して作り直すという作業が地味に大変です。あと、Androidユーザーに馴染みのあるUIにするために、設定ボタンを別のものに変えたり、iOSでは別の設定画面に切り替えていたところを、ポップアップメニューで代用したりと、ちょっとした変更点もあります。

ちなみに下の画像はプログラマーの方に作ったガイドラインのうちの一つです。
既に参考になるiOS版が存在する事もあってそこまで細かい事を説明する必要はありませんでしたが、こんな感じの画像をいくつかと、あとは文章で注意点などをまとめて伝えました。一人でアプリを作るよりかは遥かに負担が減るとはいえ、こういうガイドラインを作ったりと、人と作る事で増える作業もあるんですよね。

そして今回、デザイン面で一番力を入れたのがアイコンです。アイコンに関してはAndroid用に完全に作り直しました。AndroidではiOSと違ってアイコンの形に決まりがないので、結構自由に考えられて、作りがいがありました。

最初は思い切ってiOSとは全然違うアイコンにしてみようかとか考えて、色々と作ってみましたが、結局最後はiOSのイメージをベースとしたデザインに落ち着きました。
Androidユーザーの中にも既にFusionCalcの存在を知っている人もいるはずなので、少しでもそういう人達の目に止まるものの方が良いだろうと思ったからです。
iOS版のFusionCalcのアイコンデザインの印象を残しつつ、最近のAndriodアプリのアイコンで多く使用されている「ロングシャドウ」デザインを取り入れて、Androidぽさを出してみました。

付箋のようにメモとして残せる事が売りである電卓である事がアイコンからも伝えられるデザインに仕上がって、個人的に結構気に入っています。

同じスマホでも、iOSとAndroidではデザインやUIのスタイルが異なるため、両OSでアプリを作る場合は、細かい部分での調整が重要になります。これまであまり深くAndroidデザインを研究する機会がなかったので、今回のAndroid版の開発を切っ掛けに、これからはもっとAndroidのデザインも勉強してみたいと思います!
Get it on Google Play


0 コメント: