↑MIXIニュースの画面を情報整理してみました。
↓こちらが現行のデザインです。
情報アーキテクチャとは情報分かりやすさ・見つけやすさ
を作ることです。
そのためには必要最低限の文字数、画像数、にしぼり、
文字と画像の大きさを大きくしてユーザーに探しやすくする事です。
大量の文章を新聞のように表示してしまうと
情報がみつけづらくなります。
ーーーーー
そして大量のコンテンツがあるサイトは大カテゴリ＞中カテゴリ＞小カテゴリ
の視線誘導が分かりやすく表現されている事が重要で、
誰にでもわかるように、探しやすくなるように注意して作ったのが下の画面です。
「コミュニティ」の列＝大カテゴリ、「エンタメ」 の列＝中カテゴリ↓
特に目立たせたい箇所には赤、次に目立たせたいところやクリックできる箇所には青を
使うのですが、それも見つけやすくするために
他の箇所は薄いグレーなど目立たない色を使います。
ニュースの絞り込みは左側のボタンを使います。
これは位置が固定されていますので
ユーザーはすぐに見つけられます。
例えば「検索システム」が必要とします。すると画面上部に、横長の検索窓を置きます。
これは普通のデザインです。
一歩先のデザインはユーザーの気持ちを考えて何を用意すべきか考えたものです。
例えばYouTubeの検索システムで検索するとします。
検索結果のサムネイルを縦スクロールで見て行きますが、
「昔の動画が混ざっている。もっと新しいのだけにしたいな」
となれば一度画面上部に縦スクロールして
ページの一番上に帰ってからフィルターボタンを押します。
この時にいつも面倒だと思うのですが、、
画面の左側にボタンの配置があるのであれば
検索した時だけ配置を変えて絞り込み用のボタンを置いても
良い気がします。
↓例
（figmaで作りました。右上の再生ボタンを押して、
画面が変わったのちに右上の拡大ボタンを押すと最大サイズになります）
このデザインについて
画面左サイドの元からあったボタンはどうするの？という意見が出そうなのですが、
検索中は使いませんので表示する意味がなく、隠して使うべきボタンに
置き換える方がユーザー寄りのUIになります。
もしくは
絞り込み用ボタンの下に移動します。
ボタンは動かないという概念はもう無くてもよいのではと感じます。
その場、その場でユーザーは何がしたいのか？、どうすればユーザーが助かるのか？
を永遠と考えて概念を気にせず、寄り添ったUIにするのが大事な事だ感じます。
ボタンのカスタマイズ機能、もしくは
ユーザーの挙動を記録して更新ボタンクリックによって
自動で並び替えられるUIだってありだと感じます。
それが概念のないユーザー寄りの未来のUIUX設計だと感じます。
ーーーーー
・色による視線誘導
・境界認知
・層の考え方
色による視線誘導
ユーザーの視線を引かなければいけない場面がサイトにはあります。
例えば「新しいメールが来ている」
「これについて気を付けてほしい」
といった場面ですが、
良く使われるのが「赤」で視線を引く効果があります。
その効果を上げるには赤系を普通のUIに使わない事です。
極力グレー系にして赤を際立てます。
そうすると見てほしいものに視線誘導ができ、
ユーザーを迷わすようなトラブルが起こりづらくなります。
他の色が持つ意味としては
青はクリックできるという意味、
紫はクリック済であるという意味、
などがあり、
ユーザーに分かりやすくするために
色に意味を持たせる必要があります。
ーーーーー
境界認知
よく見かけるのが、これの欠如したUIが増えている問題です。
例として文字が表示されているだけでボタンと認識しづらいサイトがあります。
クリックできる範囲がわかるように淵に線を入れるか、
ボタンの範囲の色を変えるかした方が分かりやすいです。
noteのような投稿コンテンツの集合体であるサイトでも
境界線が不明で分かりづらいです。
慣れれば気になりませんが、
どのサイトでも最初が肝心で初めて来る顧客が簡単に
理解できるかどうかは大きな問題です。
改善例はこちらに書きました。
【右上に拡大表示のボタンがあります】
ーーーーー
層の考え方
サイトの表面の部分でクリックしていない状態では
第一層が見えている状態とします。
ユーザーが何かクリックしてページ移動した状態では
第二層にいると考えます。
さらにクリックすえば第三層にいると考えます。
ユーザー目線で考えると深層に入り込むほど
ボタンの位置など認識しなおしになりますし、
読み込み時間分待たされ、
手前の画面に帰る手間も発生します。
よってUX向上を目標にした場合に極力、深層に入り込まない事が
テーマになります。
ユーザーの見たい情報がなるべくページの上に表示されて、
発見しやすい事も大事です。
例えば求人アプリでは
閲覧者の見たいものは
・給与
・応募資格
・リモートで働けるか
辺りになるのではないでしょうか？
特に応募資格は先に見せてもらわないと、
無駄にいろいろな情報を見てから「あ、、応募できない、、」
となってしまい無駄な時間を使ってしまいます。
よって層の考え方
からすると上記の３点は「第一層」に表示すればUXが上がるという事になります。
そして求人の詳細ページは項目が探しやすい事、
見られる率の高い項目が上の方に表示される事も大事です。
その辺を踏まえてデザインするとこうなります。
↑のプロトタイプに「ブロック」というボタンがありますが、
これはその企業の募集を表示しないためのアイデアです。
求人は毎日見るもので、応募しない予定の企業が沢山あるのに
何度でも沢山表示されて、時間の浪費になります。
こういう不満を分かってあげて、
概念に屈せず、手間を減らしてあげるアイデアが
UX向上につながります。
ーーーーー
漫画はスマホだと文字が小さくて読みづらい現状があります。
そこでコマを分けて
縦読みにするプロダクトも出ています。↓
しかし、これは手間が必要で中間に作業する人が入る分利益が減ります。
であれば漫画をアップロードした後に作者本人が赤枠でファーカス範囲を指定し、
タップやスワイプで１コマづつ読めるプロダクトを作れば良いと感じます。
作者さんは１コマづつ、どうスマホに表示するかを考えつつ枠を動かして
ボタンを押していくだけなので、とても簡単にフォーカス機能を使えます。
拡大、縮小も簡単にできるようにします。
エフェクト
を入れたいコマにはBGM,効果音、横揺れ、拡大縮小、フラッシュ、
雨、ブラックアウトなどをボタン１クリックで
楽に入れていけます。
エフェクト用の音楽素材はサイトにあるものを使ったり、自分でアップロードしたり、
アニメ的な表現を可能にします。
これらの機能に似たイメージのプロトタイプを過去に作っておりましたので
載せておきます。
①次世代コミックリーダー
【XDで作っています。画面右上の拡大ボタンを押して大きく見れます。
表示されましたら、画面のどこかをクリックすればページが進みます】
ーーーーー
②こちらはその漫画を登録するためのプロダクトです。
https://xd.adobe.com/view/b7e91e4a-0c83-417a-861d-a049fa030312-e2ba/
ーーーーー
③こちらは私のポートフォリオです。
https://risuah.hatenablog.com/entry/2024/02/23/194751#h2
漫画をこのように見せるものは２０１４年にめちゃコミックから類似したものが
作られていたようですが、スタッフ様がアップロードしたりしていたみたいで広がらなかったようです。
もっと簡単なUIで、作者さんが操作できるようにする事で広がっていく可能性があります。
そして私の考えるコミックリーダーは「自動再生機能」があり、
ページをめくらなくてもコマが進みます。
多言語を表示し、漫画を世界に発信する機能もあります。
例えば、ADOさんなどの有名人に５回ほど連続で出演いきます。
見る事、なれる事でなじみ、サービス使用率は上がるはずです。
視聴者全員にイラスト・音声などのNFTを配っても良い気がします。
ーーーーー
初見さんが簡単にすぐ配信可能なようにアバターのセットを用意します。
まず参加してもらう事が重要で、
イラストをカスタマイズしたり、独自のものを用意するなどは
楽しめた後で良いと思われます。
次のステップとして顔や服装などを好きにカスタマイズ可能になりますよう
パーツ分けされたイラストも用意します。
サービスは敷居を下げるほど使用率があがると思われます。
その次のステップでユーザー自身が作ったイラスト使っていただきます。
「体験」がとても重要なので簡単に体験できるファーストステップの準備が必要です。
パーツに関しては有名人が監修した有料パーツを用意して売り上げ向上も考慮します。
例
メイク、アクセサリー
ーーーーー
トークテーマで困らないようにサイコロを振って
「コイバナ」「はまっている事」「趣味」「びっくりした事」など
会話のきっかけを与えられるようにします。
ーーーーー
人それぞれ、聞いていて楽しい話題があります。
プロダクトの求める姿が「つながり」であれば話題のカテゴリは重要と感じます。
「手芸」「野球」「ゲーム」「K－POP」「アイドル」「山登り」など、
カテゴリを用意する事で楽しめる率は上がると感じます。
ーーーーー
アニメの放送記念、ゲームの発売記念など宣伝したい企業様は常におられますので
コラボを積極的に行い、プロダクトの宣伝を常に行います。
ポケモンのような可愛いモンスター、サンリオキャラクターなども
アバターとしてニーズがありそうな気がします。
ーーーーー
機能概要‥握手している画像が表示され、２秒程度オーディエンス側も話せる機能で、
配信者に音声メッセージが送れます。
おそらく差別化が図れ、「つながり」を感じられる機能になります。
「いつも楽しく聞いています」など生声でのふれあいは良いものだと感じます。
時間制限、人数制限などを設定し行えるようにします。
ーーーーー
配信中に３人のユーザーからブロック・通報を受けた場合に
①か②の対応をします。
①コメントを一時非表示にしてスタッフに自動的にコメント内容を送信→審議
②対象ユーザーを即時退室にして、スタッフにコメント内容を自動送信し、「審議中」である旨を伝えます。
有名人のライブの場合は所属事務所のスタッフさん、アプリの運営さんがリアルタイムでコメントを非表示可能にして、ライブを守るようにします。
ーーーーー
ビギナーの定着率向上は最重要課題と思われ、
データが必要になりますので
ビギナーのスマホ画面に映ったアバターでクリック率の高いライバーデータ、
入室後に極力長い時間滞在させたライバーデータなどを抽出し
分析をしますが、ビギナー様にはそういった優秀な成績のライバー様を
おすすめ表示するようにします。
ーーーーー
ライバーがオーディエンスのコメントを取り上げて話す場合に分かりやすく
ピックアップ表示として画面に少し大きめに表示できるようにします。
ユーザーにはピックアップのご褒美をプレゼントします。（コイン・ライバーアイコンの描かれた記念コインなど）
オーディエンスの喜びを演出し、再来を促します。
ーーーーー
匿名で質問できるように匿名の質問箱を用意し、ライブ中以外でも送信可能にします。
これは任意で話のタネが欲しいライバーさんが使います。
ーーーーー
オーディエンスがライバーをいろいろ評価できるようにし、
マッチング機能に使います。
（マッチング機能は次項で説明します）
評価項目例
・声色‥かわいい声、いやしの声、かっこいい声、など
評価をするとコメント欄に表示され、ポジティブな選択肢しか用意しませんので
ライバーはうれしくなります。
・トーク内容‥分かりやすい、楽しい、癒されるなど
ーーーーー
おすすめの制度を上げたり、アプリをダウンロードしたばかりのユーザーが
マッチしたライバーに出会えるようにするためのソート機能です。
ソート項目例
・声色（ユーザーによる評価を元にAIが判断します）
・顔のタイプ（丸顔などライバーが判断し、設定）
・トークタイプ（声色同様にAIが判断）
・話題（話題カテゴリから判断）
・コメント発生率（被コメントが多いユーザーなどデータを元にAIが判断）
・体系（ライバーが指定しておます）
ユーザーはソートしたい部分だけを入力し、良いライブに出会えるようにします。
ーーーーー
アマゾンなどで欲しいものを指定しておくと買ってもらえるかもしれない機能です。
ーーーーー
トークテーマにしたい動画、記事、ツイートなどを
画面に表示できる機能です。
ーーーーー
２～６人程度のライバーで同時に会話できる機能です。
入室条件を設定し、（ランク、〇〇について語れる方など）
入退室が繰り返されるイメージのライブです。
大人数の場合はライバーの感情がオーディエンスに伝わるように
「笑いのマーク」
「怒りのマーク」
などを表示できるようにします。
ーーーーー
ライバーがオーディエンスと話したくなった場合に参加募集を開始し、
音声で話したいユーザーが手を挙げ、
ライバーが手をタップして会話が可能になります。
制限時間３分などライバーが設定できるようにします。
ーーーーー
アプリを代表するブイチューバ―の育成を目標として
オーディションを行い、特別にトークの上手な方を選定し、
ビギナーに好まれる容姿などの分析に合わせた
容姿のブイチューバ―を作り、
YouTubeで配信したり、漫画動画を作ったりして
アプリに引き込めるように集客の場を拡大します。
シナリオライター、作画デザイナーなども合わせて選定します。
私は漫画動画も作っていますし、ストーリーなど選定や、監修、修正が行えます。
ーーーーー
UIUX改善、IA改善、アルゴリズム設計、起業で作ったアプリや
プログラミングで作ったゲーム、漫画制作の方法、その他のアイデアなど
記載されております。
●アップルビジョンプロ対応ゲーム
・ゲーム概要
VRゴーグルをつけて、
空を飛び、陸海空のモンスターを右手で捕まえて、飼い、試合で勝利を目指すゲーム
・コントロール方法
左手でスティックタイプのコントローラーを使い空を飛ぶ方向、速度を加減します。
・飼う方法
アップルビジョンプロなどを使っているときに
名前を呼ぶと現れ、なでたり、餌を与えて育てます。
時には２匹を呼び出して戦わせて鍛えます。
それらは目の前で行われ、名前を呼んで指示を出します。
・売りの部分
世界中の人が好きなモンスターと同じ空間にいられるゲームでることが売りで、
AIを導入し会話もできるようにします。（可能であれば）
・モンスターのパラメーター
「生き物」であることを強く思わせる設定で、通常のゲーム用に細かくコントロールはできず、運の要素は強くなります。
それは競馬で思うように強い馬が作れないのと同じです。
餌を与える種類があっていないと知力が上がらなかったり、
戦わせる頻度が多すぎて、性格が荒くなって試合中に支持を聞かなかったり、
ケガをしたり。
餌を与え過ぎて動きが鈍ったり。
ダービースタリオンのように乱数を多く採用し、想像できないような成長曲線を
描くものにします。
・餌の入手方法
試合で勝利するか、モンスターを売るかでお金を獲得し、
マップ上のお店に行き買います。
・協業イベント
レアモンスターを見つけられないユーザーのために
例えば小売り業、外食業のお店で買い物をして、レシートに印刷された
QRコードをスマホアプリで読み込むとアカウントにモンスターが追加されます。
ディズニー、ラウンドワンなどの娯楽地ではVRゴーグルや、スマホでモンスターを探せます。
ーーーーー
●ダンスレッスン
K-ＰＯＰなどのダンスが流行ってきていますが、ダンスを学ぶのに
教室に通ったり、テレビを見て踊ったりするのが主流になっています。
アップルビジョンプロを使うと、Ｋ－ＰＯＰのスターが自分の部屋に現れて
ダンスの指導をしてくれます。
新曲の度に教えてくれます。
人気のスターMOMOのインスタフォロワーは１４００万人いますので
スターの起用で宣伝効果が見込めます。
手を差し伸べると握手ができたり、ハグができたり、
声もAIで作れますので会話も可能になりえます。
ーーーーー
●英語学習
子供の好奇心をくすぐる形での英語学習です。
例えばリンゴの単語を覚えるときでも手で触れるようにして
回転、移動も可能にします。
そして正しい発音で学べます。
アップルビジョンプロではタイピングもできますので
スペルも学べます。
AIを導入すれば留学したような体験で会話練習ができますし、
AIが導入できなくても
臨場感ある映像を用いた会話ゲームができます。
例
・マクドナルドでチーズバーガーを注文する
正しく発音し、店員に伝わるとゲームクリア
・道順を聞く
これらの会話は留学を意識した会話の内容で
実際の留学費用よりも安く学ぶためのものです。
ナビゲートします。
ーーーーー
・概要
目の前から鬼が襲ってくる対戦ゲームです。
・攻撃方法
短い棒を持つか、人差し指を立てて剣を振ります。
剣を横に向けると防御できます。
・移動方法
体を左右に傾けるとよけます。
距離を取るときは「逃げる」と言います。
鬼は少しすると追いかけてきます。
・必殺技
技名を言ってから攻撃します。
必殺技を使うと体力ゲージが減ります。
体力ゲージは攻撃を受けても減りますが
時間が経つにつれて回復します。
鬼か、人間のどちらかの体力が０になると
ゲームが終わります。
ーーーーー
●オンラインブラックジャック・ポーカー
スマホの全面カメラに自分の顔を撮影しつつ、オンライン対戦で
ブラックジャック、ポーカーができます。
ゲームはディーラーとプレイヤー側に分かれ、プレイヤー側には複数人いる状態です。
ディーラーは全員の顔が見えます。
心理戦ですので顔色をうかがいつつ勝負するプレイヤーを見極めます。
プレイヤーはディーラーの表情をうかがいつつ
勝負を判断します。
カードはCGで表示されます。
ライブチャットのように会話も可能です。
●ダウト
自分の顔を全面カメラで撮影しつつプレイします。
数字を言いつつ、カードを捨てますが、顔のアップが皆のスマホ画面に表示されます。
その表情を見ながら
ダウトするか判断します。
カードは画面下に表示されます。
●オンライン対戦ポケモンゲーム
小売り店、外食店などでの
会計時に受け取るレシートに印刷されたQRコードをアプリで読み取ると
自分のアカウントにランダムなポケモンがゲットされます。
・試合の進め方
ポケモンが生きて自分の考えで動いていると仮定し、戦い方の詳細は
格ポケモンの判断に任せ、
プレイヤーはざっくりな支持を出しますが、
従うかは不明です。
不確定要素が面白さを作り、熱くします。
ポケモンはたまごっちのように普段触れ合うことができるので
普段の付き合い方、餌など世話の仕方で忠誠心などの
隠れパラメーターが変動します。
支持の出し方は
・任せる
・攻撃
・とくぎ
・よける
・休む
で、休むとHPが回復します。
破壊力のある技ほど空振りが多く、HPを消費します。
大事に育てていると会心の一撃が出やすくなります。
餌は広告を見ると増えます。
ーーーーー
●アイドルくじ
小売り、外食店の会計レシートのQRコード、
CDを購入し、中などに封入されたQRコードをスキャンすることで
選んだアイドルのメッセージ付き動画がARで再生されます。
１人のアイドルにつきいろいろな動画を用意して
販売数を上げます。
コンプリートする事ができるようにNFTにして
サイトで取引できるようにします。
ーーーーー
●頭上の文字当てゲーム
・概要
ARで頭上の上に文字を表示し、頭上の文字が分かるように
他のプレイヤー達がヒントを出してあげて、
文字を早く当てた人が勝利するゲームです。
・ゲームの流れ
使う文字数とは頭上の文字の数で、
ひらがなだけを使います。
いつまでも正解が出ない事もありますので
何ターン遊ぶかを決めておきます。
ゲーム開始の前に参加プレイヤーの頭上の文字を決めますが、
参加者をカメラで認識させた状態で文字を打ち込みます。
ゲームは「ヒントターン」と「コマンドターン」の２構成で
この２構成を１ターンとし、
最終ターンまで繰り返します。
途中で自分の頭上の文字を当てるとその人が勝利者になります。
途中で攻撃により１人が残った場合は残った人が勝利者になります。
最終ターンまで勝負がつかなかった場合はAIが勝利者判定をします。
ーーーーー
ヒントターンで各プレイヤーがヒントをもらった後は
コマンドターンになるのですが、
そのコマンドターンでは３パターンのコマンドから１つを選んで
行動します。
①自分のワード当てる
②アイテムを得る
③アイテムを使う
自分の頭上のワードが分からない場合は
アイテムを得たり、使ったりして他のプレイヤーを攻撃
することも可能になります。
アイテムは３個まで所有できます。
・トラップ‥トラップワードを決め、そのワードがそのターン内に
頭上のワードとして書き込まれた場合に書き込んだプレイヤーは
失格になります。
・トラップ避け‥トラップが発動されると予感できた場合に２ターントラップを
避ける事ができます。
・強制失格‥トラップのアイテムを３個集めると作れます。
発動すると誰か１人が強制的に失格になります。
これはトラップ避けを発動中のプレイヤーには無効です。
・アイテムを奪う‥誰かのアイテムを１つ奪い取ります。
・ヒント‥５０％の確率で自分の頭上のワードを１つ知ることができます。
・アイテム消去‥誰かのアイテムを一つ消去します。
全プレイヤーは「ちゃんとヒントを出さなかったプレイヤー１人を指定します」
指定されたプレイヤーは原点１０になり、
その後は各自プレイヤーの所持アイテムをポイントに交換し、
合計点数で勝者を決めます。
学生が３人くらい遊ぶイメージです。
おそらく下品なワードなどを入れあって沢山笑えると予測しています。
そして録画をしてティックトックなどで拡散されると
流行っていく可能性があると感じます。
オンライン対戦用の
UIも考えられますので
知らない人の顔をみながらするゲームが皆無な事も踏まえ、イノベーションであり、
世界的に流行る可能性もあり得ます。
流行るとは＝遠い距離のところにまで影響を与えるもの
遠い距離のところとは＝外国
外国にまで影響を与えるものは流行ったものであり、
それを分析していくと流行らせる方法が見えます。
ーーーーー
日本人として外国から来たもので強い影響を受け、使い続けたり、愛してしまったり
したものは
何でしょうか？
私個人としてパソコンやスマホがそれに該当しますが
パソコンやスマホが恋しいのではなく、
その中に映し出されるものに恋しさを感じます。
よって、
厳密には外国のものに影響を強く受けていません。
国内をずっと気にしています。
それは漫画だったり、ゲームだったり、アイドルだったりです。
逆に日本が世界に影響を与えているものは何でしょうか？
その最たるはアニメだと思います。
では外国の方がアニメの何に惚れているのでしょうか？
キャラクターだと思います。
キャラクターとは人間と同類のものです。
強い影響を与えるものとは結局人間、
もしくは人間を模したものです。
ではタイトルの「何かを流行らせる方法」とは
それに必要なものとは
人間、人間に模した者です。
実際にあるのがCMに出演するタレントさん、
アンバサダーがそれに該当する行動です。
SNSで有名人がお気に入りの何かは流行らせる効果があります。
結論ですが、流行らせたいときに
愛される人間、人間に模したもの、キャラクター
に関係させてリリースするのは流行させる可能性を
上げることになります。
実例としてTIKTOKはリリース初期に若い女性が出てくる動画CMが沢山宣伝に使われました。
外食チェーンは人気のアニメキャラクターとのコラボイベントで認知を上げています。
ゲームアプリは人気キャラクターとのコラボイベントを行っています。
もし何かプロダクト、コンテンツを作る場合は興味を
ひけるキャラクターなどを中にいれて作ると良い効果が望めます。
便利な物を作ってもなかなか売れません。
学習セットを作っても売れません。
売るにはポケモン学習セットのように愛されるものと
一緒になっていることが重要です。
