ツイート画像スタイルの刷新

2020-06-14

2019年1月以来となる、ツイッター画像の全面的な変更を行いました。まだ一部のツイート画像は古いスタイルのままですが、漸次的に変更していきます。

変更前後の比較

変更前

変更後

※画像は改修中のものです。

変更のねらい

これまでにDMないしリプライでユーザから頂戴したご指摘を分析して対応しました。

1. 総合ランキングの上位報酬が判りやすいヘッダ画像にした

ボーダーbotのツイートにおいてご指摘が最も多いのは、「上位報酬が間違っている」です。ぶっちぎりで多いです。

ボーダーbotは総合ランキングの上位報酬カードは自動取得するようになっており、上位報酬が誤取得されるケースはほぼありません。ではなぜこの指摘が来るかというと、中間ランキング期間中には、ヘッダーに中間ランキングの上位報酬を出力していたためです。中間ランキング期間中は中間終了日を基準に出力した方がランナーには嬉しいだろうなという前提で作られていました。

しかしながら、おそらくは、利用しているユーザの一定数はそもそも中間イベントの存在を認識しておらず(または少なくとも重要視しておらず)、出力されている上位報酬の画像と想定している(=いま狙いに行こうとボーダーbotを参照している)上位報酬が異なったことが、この指摘につながったものと考えています。

これまでも注意書きなどを追加するなど小手先の改善を続けてきましたが、本格対応として、これまで上位報酬のミニアイコンを焼き付けていたヘッダーを、イベントトップ画像を背景にするよう変更しました。そのうえで、各ランキングの上位報酬アイドルはヘッダ外の本文中に貼り付けるようにしました。

実はイベントトップ画像と上位報酬は同一とは限りません(ex. 花見DEドリームライブフェスティバル)。とはいえ、少なくとも中間上位報酬ではなく、イベント中のメダル報酬SRなどのアイドルがトップ画像には設定されるため、問題ないだろうと思います。

2. 画像サイズをPCではなくスマートフォンに最適化した

ボーダーbot Webポータルの広告解析から、50%のユーザがアスペクト比 9:19.5 / 9:21 などの大型スマートフォンを利用してボーダーbotを見ていることがわかりました。スマートフォン・タブレットの割合は80%弱に上ります。(PCは残りの2割しかいない)

Redmi note 9sなどの最近のミドルレンジスマホにおいても縦長液晶の製品が増えていることから、横に延ばすよりは縦に延伸する画像に変更することにしました。

3. ミュージックJAMの並走4ランキングに対応した

イベント中に4つのランキング(総合+3つのステージ)が同時に並走するミュージックJAMに対応しました。

4. 日本語を解せないプロデューサーからの問い合わせを軽減する

これまでの設計方針として、「関連する内容はなるべく1枚の画像に集約したほうが、ヘビーユーザには使いやすいだろう」という想定で出力する画像をデザインしてきました。私はそれなりにヘビーにイベントを触っていますし、ボーダーbotも活用するなかで、その方が便利だったからです。

しかし、ボーダーbot利用者の15%は海外の(おそらくそのほとんどは日本語ネイティブではない)ユーザです。DeepLやGoogleで翻訳可能なWebポータルと異なり、ツイート画像は日本語を現地の言語に変換することができません。

1枚の画像に複数の内容が出力されている場合、日本語を読めない海外ユーザにはなにが複数載っているのか理解しがたいようで、「これはなんなのか」という問い合わせが来ることがあります。

現実問題として海外ユーザからの問い合わせは、日本語に翻訳したうえで送っていただいたとしても回答に体力がかかります。データの誤りなどへのご指摘はありがたいですが、同種の質問DMへの回答時間は削減したいのが正直なところです。

「1画像には1つの情報のみ」「比較は同時に1イベントのみ」に分離することで、文字を読まなくとも”なんとなく”なにが出力されているのかわかりやすいようにしました。

5. データの正確性を保証しない旨の追加

たまにmobageからのデータ取得タイミングによっては、値が不正確なことがあったり、データの欠損により新旧イベント間比較の結果が一時的に誤っていることがあるので、正確性が保証されない旨の記載を末尾に追加しました。

お叱りをいただいたことがありますので、これは「逃げ」として追加しています。

今後

  • UIの変更なので、おそらく見やすさとしては前の方がよかった~という意見もあると思います。私も前の方が良かったなと思う部分がまだあります。
  • とはいえ、誤解されづらくて、比較的はじめての方にわかりやすくて、かつ問い合わせが減るようになることが目下の優先事項です。