ソリューションアートUI/UXデザインプロダクトマネジメント
体験価値を高めるために、あえて機能を削ぎ落とす。チームラボアプリの「経路案内機能」のデザイン

プロジェクトの紹介

2025.9.12

みなさんこんにちは。チームラボカタリストチームの井澤と申します。

井澤謙介 カタリスト プロダクトチーム

2009年デザイン情報学科卒業後、情報科学芸術大学院大学(IAMAS)メディア表現研究科に進学。インタラクションデザイン、プロトタイピングをキーワードに、アイデアをすぐに形にして「作りながら考える」を実践し、動物型の電子玩具や紙の書籍をめくるのに近い感覚で電子書籍をブラウズできるインタフェースなどを制作。入社後は、システム開発や空間演出の業務に携わり、現在は自社サービスの開発に携わっている。

私は東京・豊洲の「チームラボプラネッツ」や麻布台ヒルズの「チームラボボーダレス」に代表されるチームラボの展覧会で、ガイドとして利用できる「チームラボアプリ」の企画・デザイン・開発を担当してきましたが、今回は目的の作品に辿り着きやすくする新機能「経路案内機能」を実装した際の制作プロセスについてご紹介させて頂きます。

チームラボアプリ : 経路案内機能

「経路案内」と聞くと、多くの方が「Google Maps」のような地図アプリを思い浮かべるのではないでしょうか。出発地と目的地を入力すると最適なルートを地図上に表示してくれる、便利な機能です。


しかし、展覧会における体験を最大化することを目指したこの「チームラボアプリ」では、このような地図アプリでできる機能をあえて削ぎ落とすことで、来場者自身が「体験」しながら必要な情報を得ることができるような作りとしました。


今回はこの「チームラボアプリ」の経路案内機能を例に制作背景やプロセスを紹介したいと思います。

チームラボアプリについて
チームラボアプリの機能概要

チームラボの展覧会では作品が空間を移動したり、時間、季節によって様々に変化します。作品が固定されている一般的な美術館のようにキャプションパネルを設置することが難しいため、アプリ上でキャプションを読めるようにすることを目的に制作が始まりました。


以降も機能改善を重ねてきましたが、アプリの位置づけとして一貫しているのは、「アプリから作品に参加することができる」「アプリから混雑している作品の整理券を発券して、スムーズに鑑賞することができる」といったような「展覧会における体験を最大化すること」です。


最も重視しているのは展示空間での体験であり、その体験を妨げることなく、より深く豊かにするためにはどうすべきかという視点を大切にしています。


会場によって利用できる機能は異なりますが、以下のようなものが実装されています。


・作品のキャプションが読める

・アプリから作品演出に参加することができる

・混雑している作品の整理券を発券でき、列に並ぶことなく体験できる

・作品に最短距離でたどり着ける

経路案内機能の企画背景

チームラボの展示会場の規模は年々拡大しています。作品の数も増えており、作品の空間も大小さまざまで、中には混雑を避けるためにアプリで整理券を発券しているものもあります。


そのため、以下のような問題が発生する可能性があり、経路案内機能を実装することにしました。


・展示会場は広く、決まった順路もないため、自分の現在地を把握しづらい

・アプリから整理券を発券できるが、自分の番になっても作品空間にスムーズに戻れない

経路案内機能を通じて解決したかったこと

また2025年4月18日には、アブダビにて、チームラボの展覧会として最大規模となる「teamLab Phenomena Abu Dhabi」がオープンしました。これにあわせてアプリの機能を強化することで、展覧会での体験の質をより良くしたいという考えもありました。


会場における経路案内機能の要件

上述した課題は、一般的な地図アプリにあるような機能を用意することで解決できそうでしたが、チームラボアプリではあえて同じような機能は用意しない方向性で検討をしました。

結果として、以下のような地図アプリで経路案内を行う際に多くの人が利用する機能を実装しないという結論に至りました。


・建物や空間など詳細がわかる地図表示

・地図をスクロールして現在地以外の情報を得る

・地図の縮尺を操作して空間全体を見渡す

あえて機能を削ぎ落とす理由


その理由は、このアプリが最も重視しているのが「展覧会での体験の質を最大化する」だからです。空間内を来場者自らが探索し、自分の足で作品を発見し、没入していく——そうした体験を考えたときに、一般的な地図アプリのように詳細な地図を表示してしまうと、作品を発見するという楽しみが半減してしまうのではないかと考えたためです。


一般的な地図アプリのような機能では、目的地となる作品までの経路を表示した際に、どこにどのような作品があるのかや、作品空間の広さ、形状、会場の全体像を、自分の体験としてではなく、先にアプリの画面を通して知ることができてしまいます。


これは地図アプリとしては正解だとしても、チームラボアプリでは正解とはいえません。


多くの人が使い慣れているような機能を用意しないことはアプリの使い勝手に大きな影響がありますが、目的はあくまでもチームラボの展覧会での体験の質を高めることです。


多少の不便さも体験へと昇華することができると考え、あえて機能を削ぎ落とすという判断をしました。


プロトタイプを重ね、本当に必要なものは何か見極める

上述のような方針で開発を進めることに決めましたが、開発当初から具体的な仕様やUIを想像できていたわけではありません。


技術検証からスタートし、ユーザーの現在地をどのように特定するのか、経路の算出方法、できること・できないことを整理しながらいくつかのプロトタイプを制作しました。


ここからは実際に検討していた案を例に、思考背景を紹介していきます。


案1


「空間の詳細が伝わらないように、デフォルメされた地図を表示する」というコンセプトをもとに、最初に作成したのがこの案です。


この段階では、経路と一緒にデフォルメされた全体地図を表示し、現在地と目的地の位置関係を俯瞰することができる構成としていました。


経路の全体像を把握できた方がユーザーが迷わないと考えましたが、デフォルメされてはいるものの、会場の全体像が見えてしまうので、議論を重ねるなかで「そもそも地図表示は本当に必要なのか?」という問いが生まれました。


そこで、「目的地にたどり着くための経路が分かること」に焦点を絞り、デザイン案をブラッシュアップしていくことにしました。

案2


「目的地にたどり着くための経路が分かる」という機能を考える上で検討した案の1つが、「経路をテキストで提示する」というものです。


「作品Aを通る」、「XXを右折」といったように、目的地までに辿る道順をテキストだけで示すことで、十分に案内できるのではないかと考えてデザインしました。


しかし実際には、展覧会内で細かな経路の指示をテキストで読みながら進むことは難しく、加えてアプリが5言語以上に対応しているため、運用面の課題もあることが想定されたのでこの案は採用を見送りました。

案3


次に「コンパスをモチーフとして、進むべき方向と距離が分かる」という案を作成しました。


現在地を画面中心に固定し、目的地まで経路の道順を①、②、③といったように分割し、方向と距離を頼りに順番に辿っていくことで、最短ルートを辿ることができるという案内方法です。


地図表示を一切せずに目的地までの経路を示すことはできましたが、ユーザーが画面を見て直感的に何をすればよいかがわかりにくいという問題があったため採用に至りませんでした。


しかしこの案は、極端ではありましたが、どの要素が本当に必要なのか、あるいは不要なのかを判断するのに重要な役割を果たしました。

案4


コンパスをモチーフにした案をベースに、経路のわかりやすさを高めた案がこちらです。地図は表示せず、経路の全体像を見ながら探索することが可能です。


必要最低限の情報で目的地にたどり着くことができましたが、線のみで進むべき方向を正確に示すことが難しかったため、より直感的に経路を伝える方法を検討しました。

最終案


最終的には、経路案内で通路を曲がる時に地図が表示されていないと、本当にここで曲がってよいかどうかが直感的にわからない(人は地図と実空間を見比べて合っているか合っていないかを判断する)ため、必要最低限の地図を表示させることにしました。

地図上では作品空間の形状や広さをあえて示さず、実際に空間に訪れた際に初めて知ることができるようになっています。

画面のスクロールや縮尺変更といった機能で、経路の全体像を確認するのではなく、ゲームのマップ表現に見られるような、「暗い洞窟に入り込んだ時に照明で自分の周りだけがぼんやりと見える状態」を、現在位置の周囲以外の情報をグラデーションでマスクすることによって表現し、必要最低限の情報で現在地から目的地への案内を行うことにしました。

「teamLab Phenomena Abu Dhabi」から本格運用を開始

経路案内機能は、2025年4月18日にアブダビにオープンした「teamLab Phenomena Abu Dhabi」から本格運用を開始しており、来場者の過半数に利用していただいています。

Video Thumbnail

「本当に必要な情報だけを、最低限の形で伝える」ということを徹底したことで、探索する楽しさを損なうことなく、目的地への誘導をスムーズにする事ができたのではないかと考えます。


現在は本格運用を開始したばかりの段階であり、改善すべき点もいくつか見えてきています。今後も、展覧会での体験をより素晴らしいものにできるよう、継続的に改善を重ねていく予定です。

「何を優先すべきか」を常に明確にし続ける

今回の開発プロセスで重要だったのはチーム内で「何を優先すべきか」ということを最初から明確に共有できていたことです。


「このアプリはチームラボの展覧会における体験の質を最大化するために存在している」という認識をチームのメンバー全員と常に共有できていたため、プロトタイプをもとに議論を行う中でも、「これは必須」「これは不要」といった判断を潔く下せる状態だったと思います。


今回は、「あえて機能を削ぎ落とす」という方向性で制作を行いましたが、もちろん常にそのようなアプローチが正解というわけではありません。


大切なのは「そのアプリや機能を通して、ユーザーにどんな体験を提供したいのか」という視点で考えることだと思います。


アプリの一機能を例に紹介させてもらいましたが、「迷わない」という目的の手段として、ただ「地図(経路)を用意する」のではなく、一歩踏み込んでそれによってもたらされる結果が、意図した体験になりうるのかをチーム全体で判断してくことは、機能やデザインに限った話ではなく、サービスやプロジェクト全体を考える際も重要だと考えています。


「何を優先すべきか」を明確にしておくというのは言葉にすると当然のことですが、サービスの一機能やデザインなど細かい粒度でもチーム内で常に同じ意識を持ち判断していくことは簡単ではありません。しかし今後も、ブレずに高いクオリティのものづくりを目指していきたいと思います。


カタリストメンバー募集中

私の所属するカタリストチームでは、現在チームメンバーを募集しています。

今回ご紹介したチームラボの展覧会で利用できる「チームラボアプリ」は少し特殊な例に感じられたかもしれませんが、カタリストチームではさまざまな業界・クライアントの課題を解決するプロダクト開発を手掛けています。

チームラボのカタリストとして様々な課題解決に挑戦してみたいと感じた方は、ぜひこちらからご応募ください!

関連するプロジェクトの紹介

ソリューションプロダクトマネジメント

リアル店舗とECサイト『&mall』の連携をどのように実現したのか?「三井ショッピングパークアプリ」のリニューアルを担当しました。

プロジェクトの紹介

2026.6.04

ソリューションプロダクトマネジメント

「おうちが、あなたのカフェになる。」ブランドコンセプトを体現するアプリ開発の仕掛け

プロジェクトの紹介

2026.6.01

ソリューションプロジェクトマネジメント

27サイト・約3.2万ページの統合。慶應義塾 公式ウェブサイト全面刷新のプロセス

プロジェクトの紹介

2026.5.29

ソリューションスマートフォンアプリ開発

スマホでの応援が、もっと熱く、もっと快適に!チームラボが阪神タイガース公式アプリを全面リニューアル。

プロジェクトの紹介

2026.5.29

ソリューションWebサービス開発

大同生命 「どうだい?」公式アプリの新規構築において、企画、UI/UX設計、デザイン、開発を一貫して担当しました。

プロジェクトの紹介

2026.5.13

ソリューションWebサービス開発

チームラボが千葉銀行公式サイトのリニューアルを手掛けました。

プロジェクトの紹介

2026.4.28

ソリューションWebサービス開発

チームラボが慶應義塾公式ウェブサイトのリニューアルを手掛けました!

プロジェクトの紹介

2026.4.24

ソリューションWebサービス開発

すべての人の快適な空港体験 ── 成田国際空港公式Webサイト リニューアルの設計指針

プロジェクトの紹介

2026.4.23

ソリューションUI/UXデザインプロダクトマネジメント

“学校というインターフェース”のデザイン — 安平町早来学園 ICT空間設計

プロジェクトの紹介

2026.2.26

ソリューションアートUI/UXデザインWeb/アプリディレクション

リスナーの“居場所”となる体験を追求する―。BUMP OF CHICKEN 公式アプリ『be there』開発の裏側

プロジェクトの紹介

2025.5.15

ソリューションWebサービス開発Web/アプリディレクション

BUMP OF CHICKEN リスナー向け公式アプリ、オフィシャルサイト、グッズECサイトを制作しました

プロジェクトの紹介

2023.12.21

ソリューションUI/UXデザインプロジェクトマネジメント

【Featured Projects 2023で講演】チームラボがICT空間設計を行った義務教育学校「安平町立 早来学園」について

プロジェクトの紹介

2023.4.24

ソリューションWebサービス開発UI/UXデザイン

3つの交通手段を単体で決済できるアプリRingo Passを制作しました

プロジェクトの紹介

2022.7.27

ソリューションWebサービス開発スマートフォンアプリ開発

ネットでも通販でも使いやすく東急ハンズアプリを制作しました

プロジェクトの紹介

2021.10.07

ソリューションWebサービス開発

十分な機能で無駄を無くすavex入館申請支援と会議室予約管理システムを制作しました

プロジェクトの紹介

2021.9.30

ソリューションスマートフォンアプリ開発プロダクトマネジメント

最適なタイミングでニーズにあった服を提案するアプリ「メチャカリ」を制作しました

プロジェクトの紹介

2021.9.24

ソリューションWebサービス開発プロダクトマネジメント

相性の良い物件と出会える東急リバブル不動産検索サイトを制作しました

プロジェクトの紹介

2021.9.17

ソリューションWebサービス開発

的確に情報を提示する日本ペイントコーポレートサイトを制作しました

プロジェクトの紹介

2021.9.16

ソリューションWebサービス開発

好きな球団の情報をいち早くキャッチできるアプリ「パ・リーグ.com」を制作しました

プロジェクトの紹介

2021.9.10

ソリューションWebサービス開発

全ての媒体で魅力的に表示する大阪芸術大学サイトを製作しました

プロジェクトの紹介

2021.9.09

ソリューションWebサービス開発スマートフォンアプリ開発

使いやすく洗礼されたデザインを目指したヒルズアプリの製作裏話

プロジェクトの紹介

2021.8.06

ソリューションWebサービス開発Web/アプリディレクション

イノベーション自販機連動アプリacure pass

プロジェクトの紹介

2021.8.05

ソリューションWebサービス開発プロダクトマネジメント

より使いやすくZIPAIR公式Webサイト

プロジェクトの紹介

2021.7.30

ソリューションスマートフォンアプリ開発

ゴジラ公式アプリ「ゴジラ+」製作裏話

プロジェクトの紹介

2021.7.17

ソリューションWebサービス開発

(後編) チームラボがサイトリニューアルを担当したZIPAIR公式Webサイトの開発裏側をインタビューして頂きました!

プロジェクトの紹介

2021.4.21

ソリューションWebサービス開発

(前編)チームラボがサイトリニューアルを担当したZIPAIR公式Webサイトの開発裏側をインタビューして頂きました!

プロジェクトの紹介

2021.4.14

ソリューションスマートフォンアプリ開発

“銀行”らしくないUI/UXを実現した「りそなグループアプリ」はどのようにして誕生したのか

プロジェクトの紹介

2021.2.26

すべてのインタビューを見る