2023 年 12 月に竣工した複合施設「渋谷サクラステージ」のデジタルサイネージシステム。館内 4 箇所に分かれた変形レイアウトの LED ヴィジョン群を一つのデジタルスクエアとして束ね、約 70 種類のシーンを時間軸でスケジューリングしながら配信する常設システムを設計・開発した。S&D AWARDS 2024 グランプリ 受賞。
デジタルスクエア — 街のメディアファサードを表現者に解放する
街のサイネージは大半が広告のための窓だが、この場所のヴィジョン群は「表現者の社交場」として開かれている。スクエア型ユニットによる複数面のヴィジョンが一体となり、商業広告・アーティスト作品・ワークショップから生まれた来場者の表現・施設のインフォメーションが時間に沿って入れ替わる、ひとつのレイヤード・キャンバス。渋谷の文化発信の一翼として「使う側」を制度的に拡張するための、ハードと運用と表現の混合体である。
4 つの異形ディスプレイを束ねる
館内には性格の異なる 4 系統の LED が設置されている。広場に面した大画面の StreetVision、屋外デッキ横長帯の DeckVision、新南口改札から見える鉄道高架沿い超横長ロングの RailVision、縦型の通路 CorridorVision — 解像度・縦横比・体感距離が全てちがう 4 面を、共通のシーン記述から同期再生させる必要があった。
採った構成は Master / Slave 型の Web スタック。Master 機が Nitro SSR でシーン群とスケジュールを配信し、各 LED に紐づく Slave 機は Master からの URL を表示する WebApp として振る舞う。シーンの差し替えやスケジュールの更新は Master 側の Git pull → OSC で全 Slave に一斉リロード、というシンプルな往復で完結する。同期は WebSocket、状態管理はサーバー側の JSON、リモート操作は本体プロセスを汚さないような仕組みを導入。長期常設で起こりうる「触りに行けないトラブル」を、構成で予防する設計を取っている。
商業広告には別系統 CMS(Windows STB 群)が配信担当しており、こちらは 5〜25 分間隔の FTP ポーリングで Mac 側に取り込み、独自に組んだタイムスロット制御で正確な秒単位の切替えと事前読み込みを行っている。広告と作品とインフォメーションが、ひとつのスケジュール上で違和感なく切り替わる前提を、この層で支えている。
長期常設に耐えるための判断
設計当初(2021 年)は openFrameworks(C++)+ Max/MSP で構築していたが、複数台の常設機を年単位で運用していく上での更新対応・端末ごとのビルド管理・コンテンツ追加の摩擦を直視し、Web 技術スタックへ全面的に組み直した。C++ ユーティリティの一部は TypeScript に書き換え、ジェネラティブ表現はブラウザ上の WebGL として再構成。表現側と運用 UI(シーン編集・スケジュール編集・メディアアップロード・第三者の公開チェック)を同じ言語の上に乗せられるようにすることで、「触りたい人」と「触れる範囲」を長期的に広げる作りにしている。
パッケージング技術は Tauri でも検証したが、表現の自由度よりも、数年単位で更新・調整され続けることに耐える形を優先した、判断と引き返しを含めた技術選定にしている。
提供範囲
- LED ヴィジョンの形・配置に最適化したコンテンツ設計とジェネラティブ表現
- 商業広告・アート・施設インフォメーションが共存する番組編成と同期配信
- 来場者作品の取り込み・公開前チェック・配信フロー
- 配信元・表示機・遠隔操作経路を含めた、現地に行かずに運用し続けられる構成
- 数年単位の常設運用を前提とした、後から触りやすいコード設計と運用 UI
設置: 渋谷区桜丘 / 約 70 種類のシーンコンテンツを内包し、毎日 7:00〜24:00 稼働。
---
A digital signage system for SHIBUYA SAKURA STAGE, the mixed-use complex completed in December 2023. Four LED arrays of irregular layout, scattered across the facility, are bound together as a single "digital square" — a permanent system that schedules and serves around 70 distinct scenes across all four. **Grand Prix, S&D AWARDS 2024.**
A Digital Square — A Media Facade Opened to Expression
Most urban signage is a window for advertising. The vision arrays at this site are kept as a meeting ground for makers. Square-shaped LED units form a single, layered canvas across multiple faces of the building — commercial ads, artist works, audience-made pieces from workshops, and facility information rotate along a shared timeline. The system is part hardware, part operations, part expressive vocabulary, built so that the *users* of urban media surfaces can be structurally widened.
Binding Four Misshapen Displays
The facility carries four LED arrays of distinct character: StreetVision, the large screen facing the plaza; DeckVision, the horizontal strip on the outdoor deck; RailVision, the extremely elongated band along the elevated rail line, visible from the new South Gate; and CorridorVision, the vertical column inside the passageway. All four — different resolutions, aspect ratios, and viewing distances — had to play synchronized scenes from a single scene description.
The structure is a Master / Slave web stack. The Master serves scenes and schedules through Nitro SSR; each Slave, tied to its LED array, runs as a WebApp that simply displays the Master's URL. Updating a scene or shifting a schedule comes down to a Git pull on the Master, followed by an OSC broadcast that reloads every Slave at once — a simple round trip. Sync runs over WebSocket; state lives in server-side JSON; remote operations enter through a path designed to keep the main process clean. Architectural choices were biased toward problems we wouldn't be able to walk over to fix.
Commercial advertising is served by a separate CMS on Windows STBs. Its output is pulled to the Mac side via FTP polling at 5–25 minute intervals, then replayed on top of a custom timeslot controller for second-precise switching and preloading. Advertising, art, and facility information rotate together on a single timeline, made coherent at this layer.
Choosing for the Long Run
Originally designed in 2021 with openFrameworks (C++) and Max/MSP, the system was eventually re-architected in full around a web-based stack. The realities of running multiple permanent machines for years — update churn, per-machine build management, friction every time a new piece of content needed to land — made the case clear. Some C++ utilities were ported to TypeScript; generative pieces were rebuilt as browser-side WebGL. Placing the expressive layer and the operations UI (scene editor, scheduler, media uploader, third-party approval checks) on the same language base widens the circle of "people who can touch what" over time.
The packaging stack was also tested in Tauri. Across these decisions, the priority was not maximum expressive freedom but a system that holds up under years of revisions and tweaks — choices made with the discipline of reversing course when an option doesn't fit.
Scope of Work
- Content design and generative expression tuned to the geometry of each LED array
- Programming and synchronized delivery across commercial advertising, artistic works, and facility information
- Capture, pre-publish review, and delivery of audience-side submissions
- Source machine, display machines, and remote operation paths designed for hands-off long-term running
- Code structure and operations UI built for years of revisions, with future hands in mind
Site: Sakuragaoka, Shibuya, Tokyo. Around 70 distinct scenes. Daily operation 7:00–24:00.





