AR系Androidアプリ「Sushi Fan!」を作成してました!


つい先日のことになりますが、AR SDKを利用した、Androidアプリを作成しました。
とあるコンテスト用に作成し、先月・1/15に無事に提出完了。

振り返ると、作ることの楽しさ・面白さを知った、ひと時でした。

きっかけは些細な一言から始まった
全ては、ここにまとめられたTweetから始まりました。
#sushimaの謎 〜はじまりはここから〜
うっかりアイディアをTweetしてみるものだな、と思いました(苦笑

チーム体制でのアプリ開発でした。
アプリは、総勢8名のチーム「チーム・スシマ」で作成されました。
デザイナ1人、プランナー2人、プログラマー4人、協力者1人という構成。
東京と大阪での遠隔地だったため、やり取りはGoogle Gruop・メール・Skypeなどで行いました。

その中で、わたしは、デザイナとして、UI設計・UIデザイン・ビジュアルデザインを担当しました。
ということで。
デザイナ的視点で、本アプリのコンセプト・気をつけたことなどを書いていきます。

そのまえに「sushi Fan」ってどんなアプリ?
「Sushi Fan」とは、お寿司が浮かぶARアプリです。
お寿司に関するクイズを回答しあい、ポイントを競い合うゲームです。
※本アプリで遊ぶためには、複数台のAndroid端末が必要です。

デザイン的なアレコレ。
■ビジュアルデザイン
「陰陽」をコンセプトにしました。
まず、アプリ概要が「お寿司が浮かぶARアプリ」だったため、日本らしさを出そうと思いました。
また、プランナー&プログラム担当してたm氏より、
「シンプルなデザインがイイナー」との声を事前にいただいていました。
この二つを掛け合わせて、水墨画や書道のように黒と白のコントラスト・・・、つまり「陰陽」をビジュアルにて表現すればいいと考えました。
アイディアベースで、お寿司を掲載することはほぼ決定でしたので、試行錯誤した結果、写真のようなトップ画面になりました。
残り画面もトップ画面のテイストを継承し作っていきました。

■イラストレーション
お寿司は、トロ・エンガワ・玉子・イクラの4種類をIllusutratorにて描きました。
シャリの米粒具合と、ネタの表現が難しかったです。
(描いている間、大変おなかがすきました・苦笑)
お寿司以外のイラストは@megumixxxxxさんに描いていただきました。

■UI設計
Cacooにて行いました。
工程としてはこんな感じで進めました。

Cacoo上で画面設計→実装担当のプログラマさんに確認→
修正&修正→Ai&Psでビジュアルデザイン

気をつけたこととか
作成してる間、以下のことに特に気を配りました。

  • アプリの仕様あわせを綿密にした
  • 実装できることとできないことをききまくった
  • Fixしたら打ち上げしようね!と言い合った

コミュニケーション、大事ですね!ってことです。
過去の反省をいかせたと思います。

最後に振り返って。
ARでどんなことができるか・実装できるのかなど、よくわからぬままに走り出しましたが、
アイディアだしからアプリに落とし込むまでの工程がすごく楽しかったです。
何より、自分のつくったビジュアルがデバイスの中で動くのをみることができることに感激。

自分は、デザイナです。
コードがかけませんし、どういったことが実現できるのかプログラマさんに聞いてみないとわからないことがたくさんあります。
どんなにすばらしいUIを作ったとしても、実装困難だったりそもそも使いづらかったりしたら、それはアプリとしてどうなの?って言うことになると思うのです。
アプリの性質によってもUIとして向くもの・向かないモノも中にはあります。
そういうことが、今までいくつかのアプリデザインをやってきてようやく把握できて来ました。
中心ワークである、Webと似通っている部分は実際多いのですが、Web以上に気を配ることが多いなぁと思っています。
より高いUX体験をさせるにはどうしたらいいかなど、Webに対しての意識も以前より強くなりましたし、情報設計・機能設計などへの興味も一段と高くなりました。
不明部分を聞いたり、勉強したりなど、自分から吸収していく姿勢は本当に大事だなとつくづく感じました。

そして、次に続くよ(笑
今回のメンバーをベースにした新たなチームで、新たなアプリを作ろうと、既に動き始めています。今からすごく楽しみです。

フェリシモ「コレクション」
JAL 日本航空
ベルメゾンネット

この投稿へのコメント

コメントはありません。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

この投稿へのトラックバック

  1. keikudo.com » [works]TechBooster 名刺 said on 2011/09/04 at 22:43

    […] デザインや色のイメージは、ひつじさん、こと@mhidakaさんとサクッと話し合って決めていきました。 以前、一緒にAndroidアプリ「Sushi Fan!」を作ったこともあり、意思共有などもスムーズに進めることができました。 […]

トラックバック URL