Depth — 3D Studio for Figma

Figma の中で3Dレンダリングを行うプラグイン DEPTH のプロモーションサイト。作者は Aleksei Kipin。プラグインの機能を箇条書きで説明するのではなく、Intro / Matter / Form / Materials / Light という章立てのスクロール体験そのものに変換しているのが構成上の要点です。 各章がプラグインの1機能に対応します。Matter では島状のオブジェクトをポインタで回して形を探り、Form でジオメトリのシルエットを詰め、Materials ではコンクリート・メタル・大理石・オニキスといった素材を roughness / metalness / clearcoat のパラメータ付きで切り替え、Light では HDRI 環境の選択と強度・方位角（azimuth）の調整を見せます。矢印キーとHomeキーでの操作にも対応。終盤の Created by You と Form Editions では、Ripple / Monolith / Gem / Fold という実際のレンダリング作品を180〜240ドルのエディションとして並べます。 【参考になるポイント】 ・プラグインのパラメータ名（roughness, metalness, clearcoat, HDRI の azimuth）をそのままサイトの操作対象にしている。デモとドキュメントが同一物になる作り ・/media/audio/experience.mp3 という音声を持ち、冒頭で音声オンを促す。3Dと音を同じ体験の一部として扱っている ・キーボード（矢印キー、Home）でも3Dシーンを操作できる。ポインタ前提の3Dサイトでは省略されがちな部分 ・※Three.js / WebGL は Awwwards のタグによるもので、レンダラの種類やモデル・環境マップのファイル形式（.glb / .hdr）は未確認 ・※Awwwards は2026年8月6日時点で Nominee、平均7.66/10