Tableau Data Apps（Beta）で「サンプル・ドーパミンストア」を作ってみた

マエスです！
TABLEAU DATA APPS（BETA） 地図で商品を選び、カートへ入れる。数字が動き、目標を超えると「777」。Tableauのデータを使って、少し遊びのあるアプリを作ってみました！

これがTableauって聞くと最高に面白くないですか…？ まずは見てください！

一応、ストーリーとしては、

サンプルスーパーストアの店長が「いまはオムニ化が大事だ。そして、スーパーで買うことをエンターテイメントにしなければ購買額は増えない。つまりドーパミンが出るようなショッピングが大事である。」と言って作った、という設定です。

店長、だいぶ攻めています。ということで、サンプル・ドーパミンストア、開店です！

元になったのは、新機能のTableau Data Apps（Beta）。実は最初、「アプリを作れるって、結局ダッシュボードと何が違うんだろう？」と思っていました。そんな中でTableau JapanのKPIツリーデモを見て、もっと思い切り遊んでみたくなったんです。

州を選んで、買い物かごへ。KPIツリーもついてくる

まずは米国地図からWyomingを選びます。商品カタログが椅子1件に絞られるので、そのままカートへ。1点入れると、仮売上は400.78ドル、参考利益は25.05ドル。買い物に合わせてKPIツリーの数字も動きます。

もう一度同じ州を選ぶと、全米の1,849商品へ戻ります。でも、カートの椅子は残ったまま。Wyomingで選んだときの参考単価も保っています。地域を行き来しながら、気になった商品を買い物かごにためていけるわけです。

地図、商品、買い物かご、KPIツリー。このあたりが一緒に動くだけでも、つい次の商品を入れたくなります。では、もっと入れてみましょう。

777！ 大当たり！ ……参考利益は？

Fellowes PB500とCisco TelePresence System EX90を1点ずつ追加すると、仮売上は5,059.46ドル。設定した5,000ドルの目標を超えました。そこで「777」「大当たり！」「FEVER」。金色です。派手です。売上達成を全力で祝ってくれます。

……と、気分よく数字を眺めていたら、参考利益はマイナス26.70ドル。

売上達成、おめでとう！ でも、利益は？ というツッコミまでセットになってしまいました。次は、ちゃんと利益が出たときに祝ってくれる店にするのもよさそうです。

ちなみに、ここでのカートはサンプルスーパーストアの過去データを使った仮想の買い物です。金額はUSD。参考単価は地域・商品ごとの過去売上÷数量で、実際の定価ではありません。注文や決済、元データへの書き戻しはしません。

Tableauのデータで、こんな画面まで作れるんだ

地図で絞り込むことも、KPIを見せることも、いつものダッシュボードでできます。今回「おお、面白いなぁ」と思ったのは、数字に対して画面がどう振る舞うかまで、自分で組み立てられたところです。

HTML・JavaScript・CSSで画面や動きを作るので、「こんな操作をさせたい」「この数字になったら、こんな反応を返したい」を形にできます。今回はそれが買い物かごと777になりました。何を作るかを考え始めると、急にわくわくしてきます。

しかも、このアプリをTableauがホストしてくれる

これ、技術的にもかなり大きいと思います。自分で作ったHTML・JavaScript・CSSのアプリを、Tableauがホストしてくれるんです。アプリの画面を配信するためのWebサーバーを、別に立てなくていい。

Tableauのデータを使って、自分の作りたい画面を作って、Tableauに載せられる。データの表現って、こんなところまで自由になってきたのか、と。今回いちばん「すごいなぁ」と感じたのは、この部分かもしれません。

このホスト構成とHTML・JS・CSSへの対応は、Tableau Japanの公式補足と制作方法の補足でも案内されています。従来にもTableauがホストする拡張はありますが、自作アプリを載せる選択肢として、この形はうれしいですね。なお、ここでいうホスティングは画面の配信の話で、サーバー側の処理や秘密キーの保管は別に考える必要があります。

作る側も、ちょっとわくわくする

「どんなグラフを置こうか」に加えて、「商品を入れたらどう反応しようか」「目標が近づいたらどうしようか」と考えられる。作っていると、数字の周りにいろいろ足したくなります。店長の無茶ぶりにも、だんだん乗り気になってきました。

試してみたい方へ：今回の設定と作り方（今はできないかも）

今回はDeveloper SandboxでPackagesを有効にし、Tableau MCPの公式テンプレート構成を参考に実装しました。パッケージとワークブックをまとめ、Cloudの非公開プロジェクトへ発行しています。

2026年10月22日の検証サイトでは、「設定」→「パッケージ」の「Allow Packages on this Site」をONにして保存しました。サイトでBetaとPackagesを利用できること、データソースと発行先への権限は、それぞれ確認してください。PackagesをONにできることだけで、Betaの利用資格や契約条件を判断するものではありません。このストア用に外部通信先やREST APIの全許可は追加していません。

今回のサイトでPackagesを有効化した画面を見る

1. 対象データと集計単位を決める。
2. HTML・JavaScript・CSSで画面と操作を作り、Tableau SDK（Beta）でデータにつなぐ。
3. 集計、参考単価、カートの計算、目標をまたぐ処理を別の計算と照合する。
4. パッケージとワークブックを.twbxへまとめ、Cloudへ発行する。

今回の演出は売上目標の80%以上100%未満をREACH、目標への到達をFEVERにする実装です。録画で確認できたのはFEVERで、REACHの実表示は未確認です。

公式のscaffold-data-appはひな型を生成するツールです。今回はそのツール自体は呼ばず、公開されているテンプレート構成を参考に実装し、Tableau MCP経由で発行しました。ひな型生成とアプリの作り込みは別の工程です。

データと計算について、もう少し

検証サイトの「Superstore Datasource」の米国分を使っています。9,994明細・5,009注文を、カテゴリ・サブカテゴリ・商品名でまとめると全米で1,849商品になります。地図の過去実績と、今カートで作っている組み合わせは別の数字です。

商品を追加した時点の参考単価と参考利益をカートに持ち、地域を切り替えても変更しない構成です。試算用費用はSales−Profitを使った参考値で、実原価を表すものではありません。数量・参考単価・費用・利益の関係をKPIツリーで見せています。

Cloudが生成した初期サーバー画像と、保存した明細からの独立計算も確認しました。初期表示の全米売上2,297,200.86ドル、利益286,397.02ドルなどを照合しています。サーバー画像の確認と、ブラウザでの連続操作の確認は分けて記録しました。

Cloudで生成した初期画像を見る

この先、何を作ろうか

買い物かごを、見積もりの商品選びにしてもいい。KPIツリーを動かしながら、予算や数量の組み合わせを考えてもいい。別に作った「値引き提案デスク」では、注文を選んで希望値引き率を変え、代案を選んで相談メモを作るところまで試しています。買い物かごの楽しさから、仕事で使う画面のアイデアも浮かんできます。

もう少し仕事に寄せた「値引き提案デスク」の録画を見る

こちらはストアとは別のデモです。注文US-2026-168116の希望する総値引き率を10%から50.5%へ変更し、代案12.9%を採用して、相談メモを作る操作を撮影しています。代案採用時の試算利益率は15.06%。実際の承認や送信は行いません。メモは計算結果と前提を定型文にしたもので、AIの生成文ではありません。

選んだ商品やKPIを外部の生成AIへ渡して、説明や提案文を返してもらう構成も考えられます。以前書いたAPI連携の話からも、いろいろつながりそうです。このストアには外部AI連携は載せていませんが、次に遊んでみたい方向の一つです。外部APIを使うときは、通信先の許可、認証、CORS、秘密キーの扱いを別途設計します。

Betaなので、起動まわりはもう少し様子見

楽しくなってきた一方、検証中のChromeではアプリの領域が空白になる場面もありました。録画では買い物からFEVERまで動いていますが、Cloudで安定して起動できるところまで確認できたとは言い切れません。

ここはBetaの今後に期待しつつ、もう少し見ていきたいところです。

空白表示と、出力で気になった点

先行する別のアプリでも空白表示を記録しました。また、先行検証の2ビューではPDFに「Tableau can’t export Viz Extensions.」と表示され、CSVは改行だけでした。すべてのData Appsで同じになるとは限らないので、仕事で使う際は必要な表示・出力経路を確認したいと思います。

データで、ここまで遊べる世界になってきた

最初は「アプリと言われても、何ができるんだろう？」でした。それが、地図から商品を選んで、買い物かごにためて、KPIツリーを動かして、最後は777。作って触ってみると、Data Appsの面白さがぐっと分かってきました。

そして、その自作アプリをTableauがホストしてくれる。
データを使って「こう見せたい」「こう動いてほしい」を自由に作れる世界。
随分すごいところまで来たなぁ。

今回の店長は売上が達成されたらフィーバーするお店を作りましたが、皆さんなら何を作りますか？ 私はひとまず、利益が赤字でも大当たりしてしまうこのお店が、だいぶ気に入っています。

検証は2026年10月22日時点。操作GIFは提供録画を使用しています。録画の実行環境、Cloudでの操作受入、REACHの実表示は未確認。Cloud初期サーバー画像と独立計算は別に確認しています。Tableau Next・Serverは今回検証していません。

マエス（吉田 裕宣）

法人番号株式会社 代表取締役

X

法人番号株式会社 代表取締役／一般社団法人学生データ分析AWARD 代表理事。りょうさんより、マエスさんのTableau発信しちゃいましょうよ。 という機会を頂き思わず投稿。せっかくならばまだ日本では紹介事例が少ないもののみ取り上げていきます。