SwapSkills Doubbble 2011(vol.2)「スマートフォンUX」レポート

この記事を読むのに必要な時間:およそ 2 分

MogSnap:制作から見るWebアプリケーションのUX

次に,KANTETSU WORKSの小林氏より「《つかいやすい》を《好き》に変える スマートフォンアプリのUXデザインとは?」というタイトルで,制作する過程でのお話しをしていただきました。

MogSnapを使っている人が会場に1/3くらいいるという事で、わりと使われている印象でした。実際には,2011年8月時点では2万人のユーザーがいらっしゃるという事でした。

まずは,MogSnapを作ろうと思ったきっかけからご紹介いただきました。

twitterで食べ物の投稿をするけれど,RTするまでもないし,コメントも大変。そこでFacebookのような「いいね!」は付けられないだろうか?という事から始まったそうです。

はじめに参考にしたサイト

開発にあたり,成功しているアプリを参考にされたようです。参考にされたアプリは以下の4つ。

  • foursquare
  • Gowalla
  • 育成ゲーム
  • MEGU

開発言語

Webアプリケーションという事でJSの起用をし,MogSnapの場合はTitanium Mobileの利用がマッチしていたという事で,以下の開発環境で作成されたと述べられました。

  • JavaScript
  • Titanium Mobile

問題遭遇

モックを手書きで作成し,実際に作っていこうと思ったところから,いくつかの問題に遭遇されたようです。その問題は全てUXにまつわるところになりました。

例えば,はじめはたくさんの機能を入れてしまった事が問題だったと言います。そのため階層も深くなり使いづらいものになってしまうところを改善し,その結果<ホーム画面><投稿画面><タイムライン><たべたい画面>の4つの画面に納めたようです。

はじめはどうしてもいろいろな機能を追加してしまいがちなのですが,思った以上にかなりの機能を削除する必要があったようです。そして,スクロールを短くして《たべたい》ボタンなどの位置を改善されたそうです。

今までのガラケーのようなインターフェースとは明らかに異なっています。

画像

《使いやすい》と《好き》の違い

使いやすさのポイントをいくつか紹介していただき,使いやすさだけに止まらないのがポイントだと解説されました。

使いやすいアプリは「別の使いやすいアプリ」に置き換えが可能だけど,好きなアプリは他のものにはとりかえない,という事です。

そこで,好きなアプリにする仕掛けとしてMogSnapでは,最初の《たべたい》でコインゲットする遊び感覚を取り入れ,アニメのキャラクターやサウンドにもこだわったと解説されました。さらに,《たべたい》などのフィードバック=つまり他の誰かが同じものを好きと返してくれる事で,より好きなアプリになるという事を解説されました。

画像

国内外でも同じ感覚

今回はじめてAndy氏と小林氏は出会ったのですが,ポイントになる解説が同じで参加者にもとっても参考になったのではないかと思います。ただ,やはりその結果だけを知ってどのサイトにも対応させるのは危険で,その都度の検証が必要であるとお二人のセッションで感じることができました。

モバイルのWebしかり,アプリケーションは,今までの携帯サイトとは明らかに違い,その考え方はパソコンともまた違うもので,制作前のタイミングで検証を常にする必要があるようです。思考と事例をご紹介いただいた事で,スマートフォンを中心とするモバイルサイト/アプリのあり方の全体像が見えてきたように思います。

著者プロフィール

SwapSkills

都内でWebプロフェッショナル向けに講座の開催をしているallWebクリエイター塾主催のマンスリー勉強会 。講座では教えられない内容,実務についてのウェブの技術者にむけて低価格にて提供しています。 2011年10月16日(日)に,スマートフォンサイト制作講座を予定してます。詳細は,スマートフォンサイト基礎講座詳細ページまで。