InAppTranslationのUXレビュー

昨日の朝, 友人のUXデザイナーに蔦屋東京六本木のスターバックスでInAppTranslationのUXについてレビューをしてもらいました。1時間半ほどでたくさんの貴重なフィードバックをもらったので、ここにまとめてみました。

AppsとUpgradeの階層関係について

Apps -> Each App -> Translation/Analytics/UserFeedbacks/AppSettings

Upgrade -> My Profile/Billing/Plans/Email Notification

「という階層が複雑。まとめると下のようになっているが、2つの大きな階層AppsトUpgradeが存在している。Upgradeの意味がわかりにくい。」

「Upgradeの下の、My Profile, Billing, and Email Notificatioは、右上のEmailアドレスをクリックすると現れるドロップダウンの方にまとめた方がいいのではないか。」

「そして今“Upgrade”の下にあるPlanを“Upgrade”のいちにおいてアクセスしやすくする。」

New Hierarchy

結果的に上のような階層にするとすっきりするということがわかりました。

Translationダッシュボード

「翻訳データのテーブルの上の空間がありすぎる。
例えば12インチのMacBookで見た時は、翻訳データの部分は2行くらいしか見えない。一番インタラクションの多い翻訳データのテーブルに毎回スクロールして移動しないといけない。例えば下のような方法でスペースを縮める
- アプリのタイトルエリアの高さを縮める
- アプリのタイトルをタブエリアに移動する。
- タブタイトルのエリア(グレーの部分)の高さを縮める」

「“+”ボタンが他のコンテンツ(テーブルや、タブボタンや他のボタン)から離れすぎていて意識がそちらに行かない。」

「“+”ボタンはこれだけではどういう機能なのか最初想像ができないので、文字を入れた方がいいのではないか。」

Alternatives of ➕button, with a title

このフィードバックをもとに上のような案を作ってみました。例えば最初だけAdd Memberというテキストを表示しておいて、1人でもメンバーが追加されたら “+”ボタンだけにするというのもいいかもしれません。

ADD NEW KEYの部分をヘビーユーザー向けにリデザインする

「ADD NEW KEYは頻繁に使う機能なので今のように毎回ダイアログが出るよりテキストフィールドをそのまま配置して、文字入力 ->Returnキーの動作で1つのKEYを追加し、この動作の繰り返しで連続して複数のKEYが素早く入力できるのではないか。」

省くことができるかもしれない機能

Username

「Emailだけで管理することはできないか?」
Add Team Memberの機能ではユーザー名でチームメンバーを探して追加する。もしUsernameをアカウントからなくす場合、今のこのフローを変えないといけない。
今のように今いる人を表示せず(Emailを表示するとプライバシー的に問題なので)、Emailを入力するフィールドだけがあり、ボタンを押すと、その人がいれば追加され、いなければInvitationが送られる仕組みか。
ここはデザインが難しくなりそうだなと感じました。

Email verification

EmailのベリフィケーションはそれだけでLoginへと進むユーザーの気持ちを砕くもの、というのはわかっているのですが、バックエンドのエンジニア的にはあった方がいい機能。社内で協議してみようと思いました。

All Appsページのサーチ機能

「1ユーザー(=1開発者)あたりどれくらいのアプリを持っていて、InAppTranslationを導入するだろうか。」

おそらく10個以上アプリを登録する人は少ないでしょう。10個であれば今のインタフェースで簡単に目的のアプリを探すことができます。

「サーチバーがあると、例えばアプリを1、2個しか開発していない開発者にとってはこのサービスが自分向けにデザインされたものではなく、もっと大きな会社向けに開発されたものだと思ってしまうのではないか。」

これは非常に新しい考えで大変参考になりました。

(両方取りなアイデアかもしれませんが)アプリの数が12個より増えたら(通常のブラウザで3行以上にアプリのカードが増えたら)、サーチバーを表示するというのがいいかもれないと思いました。

トップのAll Apps pageで“Add Team” ボタンを各アプリのカードの下に置かなくてもいいのではないか。

「チームメンバーを追加するというのはアプリ個々の設定、アプリにグッと入ってからやりたいことなので、トップのアプリ一覧にそのコントローラーがあるのが違和感がある。」

Onboarding Flow

「ログインしてまずユーザーが見るビューが上。空白が多い。例えばステップ1でこれをやってステップ2でこれをやって、というふうな説明が表示されていると親切なのではないか。」

⇩のイメージを考えてみました。

ログイン後、次に何をしたらいいかをユーザーに伝えるのは重要ですよね、ただいまは余裕がなくてまだできていませんでした。
 Step2のアプリのコードを埋め込む指示は、なかなかすぐにやらない部分かもしれないので、例えばアプリからのAPIがサーバー側で受信するまでは表示し続けてもいいかもしれないと思いました。

ランディングページのレビュー

「すでにGET STARTEDボタンが2つあるのでSign upボタンが入らないのではないか。Sign inボタンはすでにアカウントを持っている人がランディングページに来た時のために残す。」

トップのタイトルと文章

非エンジニアにも読みやすいものに変える。
「今のコピーは純粋にエンジニア用に作られていて、プロジェクトマネージャーなどの非エンジニアにはわかりにくいものになっている。プロジェクトマネージャーやエンジニアではない人にも訴えかけるフレーズが欲しい。(バランスをとることが難しいが重要)」。

何を最も売り込みたいか、それを表現する
また、彼にはこんなことも言われたました。

「何を一番ユーザーに売り込みたいのか。」

今現在のInAppTranslationのコア機能は翻訳データを管理/配信というところにある。これは下の図で言うと左下の部分。

しかし、将来的には、ユーザーはKeyを追加した後に翻訳をGengoにオーダーし翻訳結果は自動的に追加されていく、そういう使い方、ユーザーの行動を作りたいと思っていることに改めて気づきました。これは上の図で言うと右上の部分であり、これをむしろランディングページで伝えた方がいいのではないかと思いました。

「どんなツールでもインストールは簡単に作ってきているはずだから、”Easy Implementation”だとアピールに欠ける。もっとユニークなコピーが必要」

「”Simple and easy to use dashboard”だと伝わりにくいからもっとSpecificでディテールを入れたものにする。写真も1つのスクリーンショットだとわからないから複数にするなど。」

「それぞれのアプリを広めていくステージと言語対応地域の関連性を見せるとどうだろう」

アーティストらしい発想ですが、そう言われて上のようなスケッチを作ってみました。それぞれのアプリを広めていくステージごとにどの国・地域をサポートしていくかを上のようにマッピングしていくとこのAnalytics画面のユースケースがよりイメージしやすいかもしれません。
- 1st stage -> US, Japan, China
- 2nd stage -> Europe
- 3rd stage -> South East Asia
- 4th stage -> Africa
のような感じでユーザーが考えれるとワクワクするかもしれませんね。

もう1つ説明ブロックを足してコア機能を説明する

「上の青、マゼンダ、黄色のブロックの中にはこのサービスのコア機能を説明したブロックがないから、最後の黄色のAnalyticsの部分がコア機能に見えてしまう。」

コア機能を説明したブロッックを黄色のブロックの上に入れることが確かに必要かもしません。

Need any help?は、ランディングページをまだ見ている段階では使い方でわからないところなどの質問に至ることはないから、Request a demoなど違う言葉にした方が自然ではないか。」

このダイアログは実際にログインした後に画面右下に表示しているものを使いまわしたのでNeed any help?という言葉になっているのですが、Request a demoなどだと、使う前のユーザーに対してもサポートを行っているような印象を与えていいと思いました。

あとはこのダイアログのプレースホルダが長すぎるという指摘をもらいました。

その友人のUXデザイナーはフランス人で英語でのフィードバックだったので、それを要約してまとめてみました。少しニュアンスの違う部分もありますが、このような貴重なフィードバックをもらいました。

これをベースにチームでは改善案を考え始めたところです。
もし、すでにInAppTranslationを使っていたらどんなフィードバックでもいただけるとありがたいです。これらのフィードバックと同じようにすぐにチーム内で検討して改善案を考えていきます。
まだInAppTranslationを使っていない方、アプリのローカライズに興味がありましたら是非確認してください。inapptranslation.com

また弊社Goldrush Computingではアプリのローカライズに関するあらゆる仕事をやってみたいと思ってます。アプリのローカライズに関するコンサルティング、翻訳、作業委託、現地の人による評価調査や改善などInAppTranslationの導入とは関係ないことでも色々とやらせてもらってローカライズに関する洞察、経験を深めたいと考えてます。
ローカライズの必要性や作業をお持ちの方、興味のある方は是非ご連絡ください。mizutori@goldrushcomputing.com

Like what you read? Give Taka Mizutori (JP) a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.