1. デザインの味付け
  2. #130/なぜカルーセルUIは絶滅..
2025-12-01 23:21

#130/なぜカルーセルUIは絶滅しないのか

spotify

今回は「なぜカルーセルUIは絶滅しないのか」をテーマに、代表の梅本@dubhunter とサービスデザイナーの神田淳生が話す回です。


カルーセルUIは「1枚目以外見られない」ため絶滅すると思いきや、形を変えて生き残っています 。リコメンドエリアには不向きでも、ユーザーが能動的に商品リストなどを探す場面では今も有効。流行の変化や今のトレンドを話しました。


番組のキーワード

カルーセルUI,UIデザイン,UX,メンタルモデル,Webデザイン

サマリー

ポッドキャストエピソードでは、カルーセルUIがなぜ根強く残っているのかを探求しています。LINEのAI活用やYouTube、Appleのサイトにおけるカルーセルの変遷を交えつつ、ユーザーの行動に基づいた仮説が提案されています。また、カルーセルUIは、ユーザーがコンテンツを探索する際にその使い方が進化しており、AmazonやAppleのUIが参考にされています。エピソード内では、カルーセルの最適化とその影響について議論されています。

AI活用の現状
s-umemoto
デザインの味付け。
はい、始まりました。デザインの味付け。
この番組は株式会社ajike代表の梅本と、その仲間たちがデザインについて雑談を交えながら話す番組です。
今日のお相手は、神田さんです。神田さん、よろしくお願いします。
神田淳生
はい、神田です。よろしくお願いします。
s-umemoto
最近、AI、神田さん、何に使いましたか?
神田淳生
AIですか。めっちゃ身近なところで言うと、LINEのAIで知ってますか?
s-umemoto
いや知らない。何それ。
神田淳生
なんかちょっと何かで使ったんですけど、変身自動で出てくるっていう。
s-umemoto
え?それ奥さんに言うとこかな。
危ない危ない。
彼自動でやってやりますよ。
そんなとこまで出てきましたよ。
LINEのメッセージ変身のところであるんですか。
それです。仕事でフィグマメイクとか、自分結構ちょこちょこ使ってみてるんです。めっちゃ便利なんですけども。
神田淳生
仕事の領域で結構AIを頑張って活用するっていうのをちょっとやってきてましたが、最近もう私生活にも起きてるんで。
s-umemoto
いいですね。
神田淳生
大丈夫ですかね。
s-umemoto
大丈夫ですよ。
神田淳生
大丈夫ですか。
s-umemoto
絶対大丈夫だと思います。
神田淳生
わかりました。神田さんのAI事情を最初にアイスブレイクで聞いてみましたところで。
カルーセルUIの意義
s-umemoto
さて、今日のテーマは何でございましょう。
今日のテーマは、なぜカルーセルUIは絶滅しないのかというテーマで話したいと思います。
めっちゃピンポイントやね。
神田淳生
打って変わって、先週とは。
s-umemoto
ほんまやね。先週は事業戦略フェーズの話とかね。
神田淳生
カルーセルUIはなぜ絶滅しないか。なぜこのテーマにしたのか教えてもらっていいですか。
まずカルーセルUIっていうのも何のこっちゃっていうところかもしれないんですけども。
皆さんが普段使われているサイトだったりアプリとかでも必ずと言っていいほどあるかなと思うんですけども。
カルーセルってのは複数のコンテンツをスライド形式でパッパッと切り替えて表示するUIのことです。
s-umemoto
元々カルーセルっていうのは英語でメリーゴーランドとかのことを指す言葉らしいんですね。
なのでパッパッと切り替えてくるくる回転してるみたいな感じじゃないですか。
神田淳生
あれのことをカルーセルで呼ぶようになったみたいです。
s-umemoto
昔はスライド形式みたいな言い方もよくしてたと思うんですけど。
いつからかカルーセルで統合されたよね、確かに。
神田淳生
そうですよね。
左右の矢印でポチポチ押したら画面が見えたりとか、
今何枚目見てるよみたいなところが分かるインジケーターが下にポチポチ。
3個とか5個とかインジケーターがついていて、今3枚目、4枚目見てるみたいなのが分かったりする。
s-umemoto
あのUIのことです。
神田淳生
カルーセルですね。
自分はいろんなサイトの記事とか、今までの流れとか、自分がしてきた仕事とかで、
s-umemoto
あのUIもいつか無くなるのかなって思ってたんですけども。
神田淳生
そんなこともないみたいで、今回そのテーマで話したいなと思いました。
s-umemoto
なるほど。確かに無くなりそうなUIではあるよね。
神田淳生
たぶんこの後話されるからネタバレしちゃいけないと思うんで。
s-umemoto
なんで絶滅すると思ったんですか?
神田淳生
まず、他のサイトのUIの流れを振り返ってみました。
まず1個目がYouTubeなんですけども。
YouTubeも覚えてるかわからないんですが、
数年前このトップページの動画の一覧のところ、
s-umemoto
あれ、PCで見るとカルーセルで動かせるようになってたんですよ。
一覧ページに横並びで3つとか4つとか動画のサムネイルが並んでてですね。
神田淳生
右側に矢印ボタンがあって、それを押していったらコンテンツがスライドしていって、
別の動画のサムネイルが出てくるみたいなのがあったんですけども、
今はそれも無くなってますね。
コンテンツエリアの幅に合わせてサムネイルが配置されております。
縦にずっとね。
次にAppleとかのサイトを見てもですね、
昔はトップページの黄色エリアとかキービジュアルのエリアですね。
あそこにもカルーセルのUIが採用されてたことがあったんですけれども、
それもずいぶん前からもうAppleのサイトはカルーセルのUI無くなってます。
この理由とかっていうのも結構記事出てるんですけれども、
このカルーセルのUIの良くないところですね。
s-umemoto
これは単純に1枚目以外ほとんど見てくれないっていう。
神田淳生
そういうデメリットがありまして、
クリック数がですね、1枚目が全体の90%を占めて、
残りのカルーセルで隠れている部分全部合わせても10%ぐらいになっちゃうみたいな、
そんなデータもあったりとかありました。
そこらへんの数字もファクトみたいなところで考えると、
カルーセルで目立たせたいと思ったけれども見てもらえないっていうところだと思うんで、
減っていってもいいのかなというふうにも思ってたところです。
s-umemoto
確かに。1枚目しか見ないってことやもんね。
神田淳生
自分で矢印を動かして選んでみるみたいなっていうのは、
確かにあんまりやらないよなっていうのは思います。
自分自身も昔、メディアのサイトのデザインをしていたときも、
注目記事みたいなんで、ページの一番上部にですね、
5枚、5記事分ぐらいカルーセルで配置して、
そういうUIを作っていたこともあるんですけども、
Googleアナリティクスとかで分析してみると、
実際数字もすごい減っていって、それよりもメインエリアじゃなくても、
下のエリアに配置した記事のほうがクリックされてるじゃんみたいな、
そういうようなのもあったんで、
自分もそこら辺の経験からカルーセルのUIみたいなのは、
s-umemoto
あんまりお勧めしてこなかったというか、
そういうような経験もありました。
神田淳生
そこら辺から考えてたんですけれども、
最近のサイトを改めていろいろ見ててもですね、
合理的に考えると減っていってもいいのになと思いつつ、
能動的な行動とカルーセル
神田淳生
でもやっぱり結構残ってるんですよ。
Appleのサイトの話をしたんですけども、
Heroのトップページの一番ファーストビューのエリアではですね、
カルーセルっていうのは実際今も配置はされてなくて、
使われてないんですけども、仮想ページに入ったらあるんですよ。
s-umemoto
それが何かというと、商品のリストの部分ですね。
神田淳生
例えばこのiPhoneのページとかMacのページとか、
そこら辺に遷移すると商品が横並びに配置されてて、
ぽちぽちスライドしていって、
s-umemoto
商品を閲覧したり選んだりすることができると。
神田淳生
そういうような形になっております。
s-umemoto
ほんまや。すごい。このカルーセルもおしゃれやな。
神田淳生
全然Appleサイトみたい。相変わらずおしゃれですね。
久しぶりに見るとおしゃれですよね。
s-umemoto
おしゃれでございます。
神田淳生
ここから仮説なんですけども、商品を選ぶとか、
利用者自身が能動的な行動をする部分では、
やっぱりカルーセルっていうのは引き続けているのかなと。
そういう仮説です。
s-umemoto
なるほど。
神田淳生
配置されている部分っていうのは、
結構事業側からユーザーにお勧めしているコンテンツとか、
事業側からこういうのを見てほしいなっていう風に思って配置している。
そういうものはカルーセルの効果っていうのはすごい薄くて、
わざわざ矢印を動かして見てくれる人があんまりいないっていうことなのかなと思うんですけども、
興味持った人が実際その商品を選ぼうとか、
見たい動画コンテンツを選ぼうとか、
そういうようなシーンになるときには、
カルーセルっていうのは結構有効。やっぱり有効なのかな。
s-umemoto
その仮説めっちゃ面白いじゃないですか。
神田淳生
あ、ほんとですか。当たってそうじゃないですか。
自分の仮説です。
s-umemoto
自分の頭で考えたチキリン?
神田淳生
そうですよ。
s-umemoto
まじでか。
神田淳生
はいはいはい。
s-umemoto
すごい。いや自分も今聞いてて、ほんまやなと思って聞いてました。
そうですよね。ちょっと当たってそうじゃないですか。
なんか当たってそう。なんか調べたらあるかもしれないね。
神田淳生
そうですね。
s-umemoto
確かにパーって自動的に見るっていうのをYouTubeで探すっていうときは、
そんなに何かを前のめりに探そうじゃなくて、何かないかなとか。
何か欲しい場合は多分検索まで使うもんね、おそらく。
神田淳生
そうなんですよ。
s-umemoto
一方で商品サイトとかだと、カルーセルじゃないけど、
目的の商品を見つけてカラーバリエーション見たいとか、
例えばカバンだったらつけてるときどんな感じなのかなっていうのを見たいっていうときは、
ピッピッってもしかしたら右左右に動かすっていうのはあるもんね。
そのときは能動的やもんね。
神田淳生
そうなんですよ。めちゃくちゃいいこと言ってくれましたね。
YouTube出たんですけども、YouTubeのスマホのアプリとか見てほしいんですが、
トップページっておすすめじゃないですか。
リコメンドのコンテンツ。
このトップページにカルーセルUIないんですよ。
s-umemoto
ないね。
神田淳生
全部縦に並んでるだけだと思うんですね。
でも一個検索するじゃないですか。何でもいいんですけども。
一個検索して検索結果一覧のところではカルーセルのUI出現するんですよ。
s-umemoto
一覧のところでは。一覧?
何かのワードで検索するじゃないですか。検索結果一覧ですね。
神田淳生
そこも基本縦に並んでるんですけれども、
縦に並んでるのと横にスライドするのと組み合わせたUIになってるんですね。
s-umemoto
横のやつはあれ?ショートとかの話じゃなくて。
神田淳生
ショートとかもありますし、最近の最新動画みたいなのとかもあったりしますね。
多分これ検索のワードによって違うような気がするんですけど。
s-umemoto
本当。ちょっと今そういうの自分見つかってなくて、
神田淳生
ツートライブで検索しましたけどこれが出ないですね。
出てなかったですか。
ツートライブとショートしか出てこなかったです。
例えばサッカーの日本代表とかで検索してたんで、それで検索したり。
s-umemoto
したことのない検索ワードでした。
神田淳生
出てきた出てきた。トップニュースで出てきた。はいはいはい。
s-umemoto
これは横のスライドのUIが採用されていて、
神田淳生
メンタルモデルとして探そうとしてる人なんで、
カルーセルUIの進化
s-umemoto
トップページとはちょっとユーザーの心情が違って、
神田淳生
見たいコンテンツを探すっていうときには横スライドがあったとしても
こんなに数字が減らないっていうことなのかなっていうのはそういうふうに思ってました。
s-umemoto
確かに。だから縦は種類で横は似たような属性のものを出すみたいな、
より詳細になってるのかね、これ確かにメンタルモデルとしては。
神田淳生
はい。そのように思います。
確かに言われてみたらそうだね。すごいね。
なんで結構このカルーセルのUI1個取っても使い方変わってきてるし、
s-umemoto
今までの改善の積み重ねみたいなんで、今のところの最適化みたいなのが出てるのかなと思います。
確かに今までだと企業サイトでもそうだけどトップページの一番上に
4つの回転のエリアを作ってくださいみたいな感じだったもんね。
神田淳生
そうですそうです。
s-umemoto
4枚目誰が見んねやろうみたいな感じの。
神田淳生
そうですそうです。
ここら辺は今のAmazonとかAppleとかUI参考にしたほうがいいと思いますね。
結構大きなエレメントで、ビッグUIみたいな感じで、
ドーンドーンドーンと配置されてるようなのが、今一番主流というか。
Amazonもだっけ。
Amazonもカテゴリがドーンドーンドーンと並んでるようなUIになってる。
Appleですかね。
s-umemoto
Appleは確かにそうですね。
最近もスクロールに対してのアクションとか多いよね。
スクロールでクリエイティブに見せるというか縦に一周。
ちょっとずつ変化をしてみたいなところでクリエイティビティを競ってるような表現がよく見えますけど。
神田淳生
あれはなくなるのかなくなるのかどっちなのかいつも見てますけど。
s-umemoto
確かに。
神田淳生
昔一番出てきたときはパララックスみたいなんで。
フラッシュのパララックスとかで。
10年以上前ですかね。
そうね、みんなこぞってパララックスにして。
s-umemoto
視作効果ですね。
レイヤー構造でデザインのレイアウトしてスピードを変えることで臨場感あるような表現なんですけど。
パララックスが懐かしいな、言葉的に。
よく出てきましたね。
よく出てきたね。
神田淳生
自分らもフラッシュとかやってたときもよー作ったもんね、パララックスみたいな。
s-umemoto
そうですね。本当にフラッシュのときも作りました。
神田淳生
フラッシュが廃止されてからも、奥行きのある表現ができるのが新しく出たみたいな感じで結構流行ってましたよね。
流行ってたね。
今も結構流行ってはいると思いますけどね。流行ってきてる感じはしますけどね。
s-umemoto
なるほど。
神田淳生
すごいピンポイントなカルーゼルUIの話でしょうけども。
s-umemoto
珍しいですね。我々がこんな1個のUIに対してあーだこーだ言うのは。
そうかもね。
s-umemoto
私もなんか考えときますわ、企画とかテーマとか。
神田淳生
そうですよ。あれは原さんの回はどうですか?
s-umemoto
原さんの回は、原稿むちゃくちゃ書いてきてますね。
さすが。いいですね。
神田淳生
そこでも置物スキル発動してますから。
s-umemoto
ラジオなのにほぼ置物。
神田淳生
すごいですね。
s-umemoto
原さんに質問ちょこちょこっと言ったら、わーっと話してくれるのを聞いて、ちょこちょこっと質問するぐらいです。
神田淳生
あらら。これでいけるんですか?
s-umemoto
それでいきます。
神田淳生
自分の時と全然パワーのかけ方が変わりますね。めっちゃ疲れるじゃないですか。
s-umemoto
原さんのとき、自分もしっかり喋らなあかんやんみたいな。
そのほうが楽しいかな。
もちろん、そのほうが楽しい。
神田淳生
またちょっとニッチなテーマ持ってきたいと思います。
s-umemoto
わかりました。
そんなこんなで、今日は以上で終わりましょうか。
ロボット掃除機の進化
神田淳生
はい。
s-umemoto
今日も聞いていただきましてありがとうございました。
神田淳生
ありがとうございました。
s-umemoto
編集後期、お疲れ様でした。
神田淳生
お疲れ様でした。
s-umemoto
最初にAIの話聞いたじゃないですか。
はいはいはい。
神田淳生
私最近、ロボット掃除機を買い替えました。
ルンバみたいなやつですか?
s-umemoto
ルンバみたいなやつか。ちょっとメーカー変えたんですけど。
神田淳生
はい。
s-umemoto
めちゃくちゃそのAIでの性能すごいですね。
えー、そうなんですか。
前のやつはですね、家を走りながらマッピングっていって
だいたいここはこういう家の部屋の構造ですよみたいな
把握しながら地図を作っていくんですね。
神田淳生
はい。
s-umemoto
それがちょっと精度が甘かったりとかするなと思って見てるんで
たまに玄関のところでガコーンと落ちたりとかしてて。
神田淳生
えー、そうですか。
s-umemoto
うん、してたんですけど。
買い替えてからマッピングの精度がむちゃくちゃ上がってて
たぶんAIとカメラがめっちゃうまく動いてるのかなと。
ちょっと怖いですけどね、変に使われてて怖さはあるんですけど。
神田淳生
はい。
なんか稼働時間もめっちゃ短くなって、ちゃんとマッピングできてるから
s-umemoto
何回も何回も行き来せんでも
しっかりこの地図に沿ってやりましたよみたいな感じの精度が上がって
4,5年前の機種だったかもしれないですけど
神田淳生
めっちゃ精度上がってるなと思ってびっくりしましたね。
いや進化すごいですよね、ロボット掃除機も。
すごい。
s-umemoto
それ海外のメーカーですか?
中国のメーカーなんですけど。
シェアで言うとナンバーワンのところなんですけどね。
神田淳生
ルンバーが抜かされたんですよね、確か。
s-umemoto
すごいですね、AI。
確かにこう、よく言われてますけど
画像認識とかそこの精度でうまく使えたら
むちゃくちゃ便利になるとかよく言うじゃないですか。
神田淳生
そうですね。
s-umemoto
ディープランニングの話だと思うんですけど。
はい。
怖いですよ、やっぱり家の中が見られるっていうのは怖いですけど。
データが取れるのは怖いですけど。
便利さと引き換えに魂打ったなという感じがありますけど。
神田淳生
でもちょっと感動体験だったってことですか?
s-umemoto
そうですね。びっくりしてめちゃくちゃ綺麗になったんですよ。
神田淳生
そんなに違いますか?
s-umemoto
いやそうなのよ。
神田淳生
めっちゃ何回もあったり自分で掃除機かけたりとかしてて。
s-umemoto
いまいち綺麗にできてないなみたいなあったんですけど。
神田淳生
たまに玄関から落ちて転がってたり。
たまに玄関から落ちて、なんだこいつはと思いながら。
s-umemoto
そういうのがなく。
いまむちゃくちゃ可愛くなってきて。
僕ちょっと掃除機好きなんですけど。
はいはいはい。
めちゃくちゃ可愛くていま掃除機が。
神田淳生
へーゆうことき。賢いなってことですか?
s-umemoto
そう。ペットロボットぐらい可愛くなってますね。
そんなんすか。
神田淳生
それはなかなかすごいですね。そんなことまで思えるなんて。
めっちゃ可愛い。めっちゃ掃除してるもんなら掃除機の掃除してるもんね。可愛いな。メンテナンスして。
いやそれは素晴らしい。そんなにすごいなんて。
s-umemoto
自分も全然5,6年今のロボット掃除機使ってるような気がするんで。
神田淳生
なんかちょっといま新しいのに変えたら全然違いそうですね。
s-umemoto
いやそうよ。可愛いわ。
神田淳生
いやすごい。
s-umemoto
そんな愛情表現をしたところで終わりましょうか。
神田淳生
はい。
s-umemoto
はい。ということで、きょうも聞いていただきましてありがとうございました。
神田淳生
はい。ありがとうございました。
23:21

コメント

スクロール