デザイナーがこだわったAndroidアプリのデザインを実現するXMLコーディングを解説する連載の第2回。前回は、デザイナーが作りたいと思うアプリと、こだわりたいポイントについて挙げていきました。

　今回から実際のコーディングに入っていきますが、その前に、作るアプリについてしっかりと考えておきましょう。前回でも述べたとおり、ただのインスピレーションのデザインではなくて、ユーザーが使いやすいインタフェースを設計する必要があるからです。

作りたいアプリを決める

　前回でも紹介しましたが、今回実装するのは、「CAT PATH」と題する仮想アプリです。

　XMLコーディングのサンプルですのでシステム的な仕様はありませんが、画面を作っていく上で、ユーザーのユースケースなどはきちんと考えてインタフェースを設計する必要がありますので、大まかな内容だけ決めておきます。

＜アプリの概要＞

  • 自分のアカウントを持ち、自分の猫の写真をアップしてアルバム（ギャラリー）にしていく
  • 他のユーザーの猫とフレンド（友猫）になれる
  • 気に入った友猫の写真をお気に入りに追加し、お気に入りギャラリーとしても楽しめる

＜アプリの機能＞

  • 撮影する（エフェクト効果はとくになし）
  • 友猫を名前で検索できる→フレンドになる
  • 気に入った友猫の写真をお気に入りに追加する

　まずは最小限の機能で考えていきましょう。

　ここで、次のようなインタフェースが考えられます。

図1●CAT PATHの画面
左は自分の猫の写真一覧が並ぶホーム画面（GridView）、右は友猫検索画面（ListView）
[画像のクリックで拡大表示]

　ホーム画面のデザインもアプリのイメージを高めるために起こしましたが、今回のサンプルとしては「友猫検索画面」を実際にコーディングしていきます。