Shopify リアルタイムダッシュボード

 (bfcm.shopify.com)
2 ポイント 投稿者 GN⁺ 2023-11-25 | 1件のコメント | WhatsAppで共有
  • Shopifyは、Black Friday Cyber Monday 期間中の世界のショッピング動向をリアルタイム統計で示すライブダッシュボード体験を提供
  • Shopify x Black Friday 2025 は、2025年のBlack Fridayの購買活動を地球儀形式のビジュアライゼーションで見せる構成に焦点を当てている
  • 提供情報の中核は、Shopifyストアで発生するグローバルショッピング統計をリアルタイムで確認できる点にある
  • この体験にはWebGL対応ブラウザが必要で、一部のブラウザや制限された環境ではすぐに閲覧できない可能性がある
  • WebGLを利用できない環境ではライブビジュアライゼーションにアクセスできないため、まずブラウザ互換性の確認が必要

Black Friday Cyber Monday ライブショッピング可視化

  • Shopifyのbfcm.shopページは、Black Friday Cyber Monday 期間中のグローバルショッピング統計をリアルタイムで表示する体験を提供
  • ページタイトルは Shopify x Black Friday 2025: Watch The World Shop Live
  • 紹介文では、今回のBlack Friday Cyber Mondayのリアルタイムなグローバルショッピング統計にShopifyでアクセスできると案内している

WebGLが必要な実行環境

  • ページ本文では、この体験を見るにはWebGL対応ブラウザを使用するよう案内している
  • WebGLをサポートしないブラウザではライブ体験を閲覧できないという条件が明記されている

関連記事

1件のコメント

 
GN⁺ 2023-11-25
Hacker Newsのコメント

  • この10年間、BFCMダッシュボードを作ってきて、今ではShopifyで最も楽しいプロジェクトであり伝統になっている
    インターネットソフトウェア企業を運営するというのはかなり抽象的だが、こうした可視化を見ると、ここで働く人たちにとってもずっと実感が湧く
    今年は楽しいディテールをたくさん入れた（https://twitter.com/Shopify/status/1728040379163771020）。あるストアが初売上を達成すると花火が見えることがあり、GPT-4で一部生成した都市の統計も多い。デスクトップではnerdメニューを開いて設定を変え、作った結果をリンクで共有することもできる

    • BFCMがよく知られた略語なのか気になる。Black Friday関連だというのは分かるが、CMが何なのか分からず、どこにも展開した表現が見当たらない
    • 見事な仕事だ。開発プロセスをブログ記事にしてくれるとうれしい
    • なぜ Jerusalem, Israel の検索がブロックされているのか気になる

  • でも、でも……Railsはスケールしないんじゃなかったの!!!!!

    • 冗談はさておき、Shopifyのインフラについてもっと知りたい
      これほど巨大な負荷の流入をどう処理しているのか、かなりすごい
    • 実際に大変な仕事は Java/Go/Rust のようなものがやっているのかもしれない
    • このページではその疑問には答えられない。これを処理するのにサーバーが何台使われているのか出ていないからだ
    • ダッシュボード上では今、毎分2.5万件の注文程度、つまり約400件/秒だ
      最新のサーバーなら、この程度を処理するのに使用率1%にも満たないはずのレベルだ

  • 世界の富がどれほど集中しているのかに驚く

    • タイムゾーンも要因かもしれない。そしてBlack Fridayはもともと米国発の現象で、それが輸出されたものだ
      ラテンアメリカでどれほど受け入れられているのかには驚いた。たとえばMercado Libreの一覧[0]からどの国を選んでもBlack Fridayをやっている。「Viernes Negro」ではなく、実際に「Black Friday」という言葉を使っている

      [0] https://mercadolibre.com/

    • 何よりShopifyがどの国に最も普及しているかを示しているように見える

    • Black Fridayは概して米国文化で、米国企業がそれを欧州へ輸出しようとしたものだ

    • 私が見た時点（グリニッジ標準時18:00ごろ）では、英国のトラフィックが欧州の他地域よりずっと多くて興味深かった
      画像参照: https://i.imgur.com/2Les0QX.png

      Brexitが理由だと考えてもよさそうだろうか？

    • 逆に見ると、世界の他地域がどれほど腐敗していて反資本主義的かも言える
      独裁者たちは、支配される人々が潜在能力を発揮することを望まない。そうなると現状維持と自分たちの地位が脅かされるからだ

  • 「Carbon Removed」統計の基準が何なのか気になる

    • 笑える話ではある。Shopifyが簡単にした不要な消費によって追加された炭素と言うべきな気がする

    • https://www.shopify.com/climate/bfcm は、ダッシュボードでその統計をクリックすると出てくるリンクだ

      Black Friday Cyber Mondayのショッピング週末に当社プラットフォームを通じて行われたすべての注文は、カーボンニュートラルで配送されます。

      仕組みはこうです。Shopifyのデータサイエンティストが構築した厳密な式により、Black Friday Cyber Mondayの各配送に伴う推定炭素排出量を算出します。その後、Shopify Sustainability Fundのパートナーと連携し、BFCMの配送フットプリントに相当するCO2排出量を除去します。

      結果は？ BFCMのすべての注文でカーボンニュートラル配送を確保できます。

    • 基本的には、他の誰かにお金を払って「炭素除去」をさせ、その魔法のような数字をここに入れているということだ

    • このスレッドや他の場所でCarbon Removed統計への批判が多いが、ただこの規模の会社が何かをしているという理由で批判するだけでなく、どうすればより良くできるかを提案する建設的な批判をもっと見たい
      個人的には、実際に配送分の炭素除去量を2倍にして相殺しているのでない限り、carbon removedとは呼ばないでほしい。そしてShopifyが直接空気回収のパートナーからすべて購入しているのでないなら、offsetと呼ぶほうが正しい

    • 会社のWebサイトに載せるには格好いい要素だ

  • ShopifyはRuby on RailsのモノリスといくつかのGo/Rustサービスで、この規模までスケールしてきた
    印象的だ

  • 本当に素晴らしく、Stripeのものと違ってブラウザが落ちたり端末でカクついたりしない
    都市情報は良い追加要素だが、推薦リストには出てくるのに、私が検索したほとんどの都市はデータが十分でなくていら立つ。それでもカスタマイズオプションはいじっていて楽しいし、特にairplane modeは良いディテールだ

  • 実際の成果物も印象的だが、これが2016年のiPhone SEで滑らかに動くという点はさらに驚きだ

  • フロントエンドの地球儀レンダリングにはどのライブラリを使ったのか気になる
    Chromeブラウザではかなり速く、カクつかない

    • three.js上に作られたReactライブラリであるReact Three Fiberでゼロから作った。非常に強力なフレームワークだ
      数週間以内に全体の技術分析を投稿する予定だ
    • three.jsだと思う
      おそらくこういうものに近いはず: https://github.com/vasturiano/three-globe

  • 地球儀そのものを除くと、このアニメーションで動きの大半は「sales per minute」「unique shoppers」「orders per minute」「carbon removed」の数字が変わることで生じる、数字がせわしなく跳ねる効果だ
    実際にはこれらの数字は10秒に1回しか更新されないのに、忙しく見せるため以外には何の意味もなく、10秒中8秒は数字がごちゃ混ぜになる

    そうするべきではない

    情報を歪めず、読みにくくせず、重要でないものにユーザーの視覚的注意を浪費させるべきではない。意味のあるものに使うべきだ

  • わあ、このカスタマイズはすごい
    airplane modeで飛び回ると戦場のように見える