2015年12月24日木曜日

制作事例紹介:Misoca iOSアプリ


今年手がけたお仕事の紹介です。

少し前になってしまいますが、8月にMisoca(ミソカ)様のiOSアプリのUIデザインをTHE GUILDにご依頼いただき、今年THE GUILDにジョインした@nobtakaと2人で担当させていただきました。





Misocaについて

Misoca様は名古屋を拠点に、Web上で請求書の作成・処理が行える無料サービス「Misoca」を運営し急成長している企業です。

個人事業主やフリーランスの方には手間と時間がかかる、顧客に請求書を送る業務を全てオンラインで行う事が出来る非常に便利なサービスなので、THE GUILDメンバーを始めフリーランス界隈ではMisocaファンが数多く居ます。

元々はWebだけで運営されていたのですが、例えばヘアメイクやスタイリストの方など普段の業務でPCに触れる機会が少ないユーザーにもリーチすべく、iOSアプリの開発が企画され大変光栄にもTHE GUILDにアプリのUIデザインをご依頼いただきました。






アプリの特徴

今回のローンチではデバイスはiPhoneのみをターゲットにしました。期間が比較的短かった事と、ファーストリリースである事からWeb版が備えている全ての機能ではなく、請求書を送るために必要最低限な機能をシンプルに提供する事を第一に目指しました。

アプリの特徴としては、何と言っても「請求書をアプリで作成して郵送する」事がアプリだけで完結出来る点です。従来であれば、PCで請求書を作成して、印刷して、押印して、封筒に宛名を書いて、切手を貼って、投函....とそれだけで1時間程度は時間を割いてしまう様な作業だったのですが、Misocaを使えば5分もあれば請求書を郵送する事が可能です。



作成した請求書は郵送前にアプリ上で印刷される状態をプレビューする事が出来ます。


作成した請求書は送付の状態等のステータス別に一覧する事が出来、入金の状態の管理も可能です。



取引先画面では、顧客別に請求書を一覧する事が出来るので毎月発生する定期的な請求も逃さず管理出来ます。



請求書に印字する会社ロゴや印影も全てアプリ上で設定する事が出来、PCに触れる必要がありません。




Misocaアプリのオンボーディング

Misocaアプリのある機能をご紹介します。アプリを初めて起動した時に1度だけ表示されるオンボーディングのUIです。

よく目にするオンボーディングの用途は

 ・アプリの概要説明(ユーザーに対するメリットのインプット)
 ・機能の説明(操作方法)
 ・ユーザーインタビュー(ユーザーからのインプット)

等が挙げられます。

一般的なアプリはダウンロードされ2回以上起動される確率が約20%程度と言われており、ダウンロードされてから3日目以降のリテンションはそれ以下と示すデータがあります。
Twenty-Two Percent of Mobile Apps Are Only Used Once
New data shows losing 80% of mobile users is normal, and why the best apps do better

オンボーディングはアプリの中で一度しか実行されない事が殆どである為、オンボーディングの検討・設計が後回しにされ、プロジェクト終盤で残り僅かの工数で実装するというケースは割とアプリあるあるだと思います。

しかし、8割のユーザーが2回めの起動を行わない主たる要因はアプリが目的の機能を果たしていない為と仮定すると、必ず一度は通るオンボーディングがリテンションの向上に寄与出来る可能性が高く、コストを掛ける価値があると考えられます。

例えば、Mobile and Designの自社アプリのStaccalではオンボーディングに相当の工数を掛けて実装しています。これは当アプリがかなり多くの機能を詰め込んだものであり、反作用としてどうしても直感性が損なわれる機能が出てしまう為、ユーザーの学習コストをオンボーディングに圧縮する必要があるという考えに基づいています。






しかしながら、オンボーディングが必ずしもアプローチという訳ではなく、Apple自身はHUGで極力UI自体の改善によって目的の実現を可能とさせ、チュートリアルはユーザーに興味を惹かせるに留める事を推奨しています。

Misocaアプリのオンボーディングでは、アプリのシンプルさからするとチュートリアル等の施策は必要では無かった為、Staccalとは全く異なりアプリの操作等については一切触れておらず「興味を惹く」を目的としています。

興味を持たせる為のアプローチとして、よく目にするのは以下のGIFの様に4〜5ページのスライドでアプリのコンセプトやユーザーの利益を伝える方法です。



このアプローチの弱点としては、文章としてユーザーが読んで理解する必要が有るため、読み飛ばされる可能性が高い点です。これに対する施策として、最近では操作感の楽しいアニメーションを組み合わせて補完しているケースが多くなっているように見受けます。





そこでMisocaアプリではオンボーディングに動画を組み合わせました。動画を一通り見せるという訳ではなく10秒程度の動画をオンボーディングの背景に流す形ですが、Misocaのターゲットとなるユーザーにとって、アプリ・サービスとの接点が感じられる様なイメージを表現し、ごく限られた時間でMisocaの持つ世界観を伝える事を狙いました。







今回映像を制作していただいたのは、国内・海外を問わず素晴らしい映像作品を制作する事で度々話題に挙がるデジタル・エージェンシー「augment5」さんです。私自身がaugment5さんの数年来のファンである為、今回無理を言って制作してもらいました。

以下、augment5さんの代表作です。素晴らしい映像なのでぜひご覧下さい。







以上、Misocaアプリのご紹介でした。
本当に素晴らしいサービスなので、個人事業主・フリーランスの方、また毎月請求書の作成で苦労されている企業の方も、是非一度ダウンロードして使ってみてください。