私はお天気アプリが大好きなのですが、違うデザインのものが大量にあることに不満でした。特にDribbbleBehanceで見られるように、どのデザイナーも美しいデザインのアプリを作成しています。しかし、ユーザーの位置情報を利用したものばかりで、それ以外にユーザーが自分好みにアプリをカスタマイズできる機能を搭載したアプリは見たことがありません。

 

そのような経緯があって自分でアプリをデザインしてみることに決めましたが、デザイナー向けのサイトでつまらないコメントをもらうためだけにすべての作業をする気はありませんでした。もしやるとしたら、本当に成功するアプリを作ると決めていました。だけどお天気アプリがうまくいくものでしょうか?お天気アプリなんて無数にあります….そう、なぜならユーザーも無数にいるからです!(この話を読まずにアプリを利用したい方はこのリンクをクリックしてください。

 

ユーザーに素晴らしいサービスを提供すればインストール数は多くなります。どんなユーザーにもニーズはあるが競合の多いジャンルのアプリだとか、競合はいないニッチなジャンルで限られたユーザーをターゲットにするといったことは関係ないのです。

 

Microsoft在籍時には、運よくWindows Phone 7のためのMetro 1)Microsoft社が作ったUIのフレームワーク。現在はMetroではなく「Modern UI」という名称で呼ばれているのユーザーインターフェースの基礎を開発するチームに入ることができました。さらに、企業が新しいMicrosoftのプラットフォームに対応するようにiPhoneのアプリをデザインしなおすのを手伝ってきたので、私は今までかなり長い間アプリを開発してきました。その後も、ニューヨークにあるRG/AのInteractive Creative DirecterとしてFortune 100 2)グローバル企業の総収入ランキングトップ100のことに入っている企業のアプリをたくさんデザインしてきました。また、Pixable、Contactive、そして現在(Experience) Design部門のトップをやっているSports Illustrated Playのようなスタートアップでも多くのアプリのデザインを手がけました。しかし、今までアプリ制作のすべての工程を自分だけで行ったことはありませんでした。PR、セールス、マーケティング、そしてソーシャルメディア戦略などいつも「UX」とは直接かかわりがない人がチームにいたのです。そのため、ある種の実験としてこの内職を一人ではじめました。

 

まず、普段行っているプロジェクトのほとんどで利用していいるこのUXのフレームワークにしたがって始めました。

定義と発見>アイデア書き出し>洗練>検証>開発

機能性ではなく、美しさというベクトルでしかイノベーションが起こらないジャンルであるお天気アプリに新たな風を吹き込むことに集中していました。

 

定義と発見

私はこのアプリを通じて達成したいゴールを明確に決めていました。1日の習慣的な行動の中で、ある瞬間にどんな天気になるのかがわかるタイムラインを作るのです。午後7時に自転車で出かけても大丈夫かどうか、明日、町で買い物をしているときに雨が降るかどうか、正午から午後3時に町が雪に覆われるかどうかなどがわかるようになります。

 

%e3%81%82

 

そのほか、よくある天気情報ももちろん利用できます。しかし、一目でわかることを大事にしていました。そのため、見た目だけでその日、その週が暑いのか、それとも寒いのかがわかるようにデータの可視化を行いました。

 

そこで、私はユーザーの毎日のルーティーンを設定できるタイムラインをデザインしました。いくらかばらつきはあるとはいえ、1週間の中でルーティーンがあるものです。例えば、家を出て、帰ってくる、ランニングに行く、ジムに行く、色々な方法で通勤するなどです。そして、非常に寒い (灰色)から 非常に暑い(紫)まで気温の幅を示すものさしをつくり、ユーザーが温度を見なくても、気温が上昇するのか、下降するのかわかるようにしました。

 

1-vpexcees22mshcqzzo1xvg

ルーティーンのエディット画面

 

 アイデアの書き出し

また、画像のタイムラインがどのように機能し、見た目とUIがどんな風になるのか、はっきりとしたアイデアが頭の中にありました。自分以外の誰にも売らなくてもよかったので、ユーザーがアプリと関わる時に重要になってくるムードボードやストーリーボードを作らずに済みました。しかしながら、デベロッパーにはアプリ制作の最後の方の工程でしか手伝ってもらわない予定だったので、正確なフローチャート、ワイヤーフレーム、そしてアプリの遷移の見取り図を作らなければいけませんでした。

 

最初搭載する予定はなかったが、たくさんのリクエストが来たために搭載したポートレートモード

 

 洗練

この段階でUXを考慮し始め、ピクセル単位でパーツをデザインしてゆきます。アプリを作るときには最小限のものしか使わないという私のポリシーにしたがって、シンプルで美しいUIを作ることが鍵となりました。気温による色の違いの修正を簡単にするため、インターフェースは無彩色にする必要がありました。

 

そして、習慣的なことから、もっとエキサイティングなことまですべてのことを表すアイコンのセットをユーザーのために準備する必要がありました。アイコンに求められることは明らかで「シンプルで、Apple Watchでも見やすく、男女関係なく利用でき、アニメーションを作ることが簡単なもの」でなくてはいけませんでした。そこで、ベクタ形式 3)画像を円や直線の集まりとして表現するコンピューターグラフィックスの表示形式のイラストを簡単に早く作ることができるIllustratorを使用し、近頃の素晴らしいPhotoshopで加工しました。さらに、自動的に一括処理でiOSとAndroidに必要な解像度に変更するのにはPNG Expressを使いました。

 

最終的に時間がかかったのは歩いているアイコンと、雨、雪、風などの天気の部分のアニメーションでした。よくわからないアニメーション作成用ソフトを探す代わりに、私が専門的な知識を持っている分野であるPhotoshopのアニメーション機能を利用することにしました。(Photoshopも結局不便で欠点が多いとわかったのですが)PNG Expressのデータの抜き出しを効率的に行うために、手作業で何百もあるレイヤーの名前を変更したりするのにほとんどの時間を使いました。しかし、その出来は満足できるもので、やる価値がありました。

 

検証

ユーザビリティのテストのほとんどを検証の段階で行いましたが、プロトタイプを作る時間はありませんでした。早く開発を始めたかったので、シンプルで、早く、安い方法であるプロトタイプを紙に書き出してゆくアプローチをとりました。これは、UIの要素を書き出してゆき、ユーザーがかかわるパーツを切り取ってそれらを板の上にならべて、そして、誰かにタッチスクリーンの上で行うようにそのパーツを動かして実際にアプリ上でおこなわれる動作を再現してもらう方法です。デジタルのプロトタイプとは明らかに違いますが、それでも、機能性が不十分なところを洗い出すのには十分でした。

 

1-iisrstqwsmmpgo6swftwsw

 

1-frzsbt8zoh2wj4yxe73pog

 

1-6jlrolcxwp0t97a7nlqdvg

 

開発

最高のデザインと、最高のコンテンツを用意しても、デベロッパーが自分たちが何をしているのかわからない状態だったら、そのアプリは大失敗になるといっても差し支えないかと思います。

私はスーパーヒーローではありませんし、いくらUXにかかわる技術に関して様々なレベルの専門的なスキルを持っているとはいっても、(フラッシュがDAだったときを除けば)プログラミングのスキルはすぐれたものではなかったので、ウクライナですばらしいiOSのデベロッパーを雇いました。そして、何回かSkypeでやりとりした後、彼はプロジェクトを開始し、数か月後MVPが完成したので、App Storeにアップしました。

 

アメリカとスペイン版用のロゴ

アメリカとスペイン版用のロゴ

 

名前

私はアプリをデザインする前日にはアプリの名前を決めていました。ASO(アプリストア最適化)については学べるサイトが他にたくさんあるので詳しいことはここで紹介しませんが、3つの条件を自分に課しました。

 

  1. アルファベット順に並べられたときに一番上にくるように「A」で始まる名前にすること。
  2. “Weather”の文字をどこかに入れること。
  3. ダブルミーニングを使ったりして覚えられやすく、キャッチ―な名前にすること。

 

そうして“A Weather Way”という名前は誕生し幸運なことに、名前がかぶっていたのはどこかの道路だけでした。その名前の製品も、ブランドも存在せず、さらにドメインを利用することもできました。完璧です。

Appleではとても長い名前を付けることができるので、名前と一緒にアプリの名前の後にアプリの説明が表示されるようにアプリの名前にタグを足しました。

 

Webサイト

そこまで時間をかける気がなかったのはwebページの作成です。エンジニアではない人がすぐWebサイトを作成することができるWeid.ioを見つけたとき、このタスクをどれだけ早く終わらせることができるかを考えていました。画像をいくつか再利用し、1日か2日でwww.aweatherway.comwww.ojoaltiempo.com(スペイン語版)を作成しました。

 

早くて無料のWebサイトビルダー、Weld.io

早くて無料のWebサイトビルダー、Weld.io

 

100万分の1

私はこのプロジェクトを副業としてやるつもりで始めたので、チャートのトップをとるために細かい数字や施策を気にするつもりはありませんでした。本当にチャート上位に食い込ませようとおもったらフルタイム並みに取り組まなければいけません。私はデザイナーが本業で、時間がなかったので、PR、メディアへのアピール、統計や分析のモニタリング、そして、それらの知見からアプリを改善するのは後回しになりました。

ついにアプリがストアに並ぶ日が来ました。私が行った唯一のPRとして私の友達と家族みんなにリンクを送って、レビューで貴重な評価5をくれるのを待って、それをさらに友達に薦めてくれるように願っていました。

 

雪降るアルプスのセントモリッツ、ピレネーの穏やかで平穏な生活、風の強いブエノスアイレス、そして湿気の強いニューヨーク

雪降るアルプスのサンモリッツ、ピレネーの穏やかで平穏な生活、
風の強いブエノスアイレス、そして湿気の強いニューヨーク

 

アプリには広告を消し、ルーティーンを表すアイコンすべてが利用可能になるPremiumにアップグレードする機能があります。可能な限りすべての機能を利用してもらうために、Premiumへのアップグレードを無料にしました。これはよい選択でした。大抵の人はアプリに課金したくないと思っているのはご存知でしょう。それで、たくさんの評価5のレビューをもらうことができました。そのうち評価1が来ることは知っていましたが、その影響を最小限にする良いバッファーをはじめの時点で手に入れることができました。

 

成功するための準備、、、かもしれない。

私がまだマーケティングに関してぐずぐずしているある朝、突然フィードバックのメールがほぼ1時間に1回のペースで来るようになりました。誰かがこのアプリを取り上げているのだと思ったので、メールの送り主の1人に聞いたところこんな答えが返ってきました。

「App Store内のBest New Appにフィーチャーされていますよ。知ってましたか?」

冗談でしょう!App Storeのプロモーション用の問い合わせに送ったメールが実際誰かに見られているとは思っていませんでした。

 

この結果、1日で12,000インストールがされました!この影響はどのくらい長く続いたでしょうか?App Storeに新しいアプリが上がってくるスピードから10日ほどだろうということがわかりました。これは素晴らしいこと、、かもしれません。何千ものインストールがあり、”アプリ内課金”がまだ無料になっていたので、私の収入は0でした。残念なことに、Premiumを無料から$1,99にするのは簡単でしたが、App Store上でアップデートの申請をしなくてはならないですし、アプリの説明文を変更するのにもアップデートが必要ということがわかったのです説明文に無料でアップグレードできると書いてある限りは有料にする気はなかったので、以前のものと同じ構成の説明文言をアップデートしましたが、驚くべきことに、取り下げられてしまいました。(同じ構成のものは取り下げられるようになっているか、アプリをレビューした人によるかもしれません。)なので、Premiumという文言を含めてアプリをアップデートしたときにはもうアプリはフィーチャーされていませんでした。まだ1日に2,000のインストールされていましたがユーザーの購入の波はあっという間に引いて行ってしまったので、この大きな拡大からの収益を逃していしまいました。大きな失敗です。

 

しかし、しばらくした後、App Storeのソーシャルメディアチャネルのマネージャーからソーシャルアカウントでプロモーションをする許可を乞うメールが来ました。素晴らしいことです!インストール数が少なくなるころにはFacebook、Twitter、などその他のSNSにアプリを載せてもう一押ししてみようと思っていたところだったのです。実際素晴らしく、、、なかったかもしれません。どうしてかというと、アプリはまだ取り上げられておらず、メールを返すのは時間の無駄だったのです。

 

大当たりから1か月後、アプリのインストール数はよくて1日100ほどに落ち込んでしまいました。たった数日のうちにアプリがこんなに成功から転落するなんて信じられません!

 

App Storeにフィーチャーされるとアプリのインストール数が(アメリカ版で)100%の増加を見せることを示したレポートとは異なり、”A Weather Way”のインストール数は1000%の増加となりました。

 

1-bi9ue26c5xq22oy8mlschw

 

Appleがアプリを異なるパラメーターによってプロモーションしていくアルゴリズムを使っていることは知っていました。リテンション、クラッシュの回数、App Storeでのビュー数などがそのパラメータに含まれていると思うので、それらを最適化していくのが大事なのですが、この記事は長くなりすぎてしまって、もうそれぞれを細かく振り返って解説ことができなくなってしまいました。次の記事で説明するかもしれません。しかし、アップデートによってリテンションがよくなった場合にそれがストアにおいてすぐに違いを生み出すのかはとても気になります。

 

興味深いデータを示しておきます。

  • ダウンロード数が3から12,000になるのに2日もかからなかった
  • ダウンロード数が12,000から300になるのに25日もかかった
  • ギニアビサウのApp Storeで総合12位に入った
  • アメリカのApp Storeで総合390位、お天気アプリで3位になった
  • 世界55か国のApp Storeでお天気アプリ1位になった
  • ダウンロードは50%がアメリカから、10%がスペイン、6%が中国、5%がメキシコ、29%が残りの国からだった

 

今もう一度、この我が子のようなアプリをランキングのトップに押し上げるために、週末と夜の時間を使っています。ここまでのところ、この実験はやる価値があるものでした。山あり、谷ありでしたが、学ぶこともたくさん、得られたこともたくさんありました。

“A Weather Way”の機能の説明動画

App Storeから“A Weather Way”をダウンロードする。

 

この記事は、Prototypr.io上の記事”How I designed a mobile app that went from 0 to 100,000 downloads in 25 days. を著者の了解を得て日本語に抄訳し掲載するものです。 Repro published the Japanese translation of this original article on Prototypr.io in English under the permission from the author.

 

無料資料ダウンロード

アプリのUX改善で大事なことは「定量分析」と「定性分析」の組み合わせです。
このグロースハックガイドではアプリの使いにくいところを発見し、使い勝手を向上させることで継続率やコンバージョン率を改善する「UX改善」について実際の改善事例を交えながらご紹介します。人気動画アプリやニュースアプリがどのような手法を用いてUX改善を行っているのか知りたい方はぜひDLしてください。
ダウンロードはこちら

注釈   [ + ]

1. Microsoft社が作ったUIのフレームワーク。現在はMetroではなく「Modern UI」という名称で呼ばれている
2. グローバル企業の総収入ランキングトップ100のこと
3. 画像を円や直線の集まりとして表現するコンピューターグラフィックスの表示形式