sensiq.co

睡眠ステージ（浅い睡眠・REM・深い睡眠）、心拍とHRV、リカバリー、フィットネスを計測するスマートリング Sensiq の製品サイト。サブスクリプション不要をうたい、Overview / Fitness / Sleep / Heart Health の4セクションで機能を説明していきます。デザインは Luke Jackiewicz、制作は visux.net。 Awwwards のタグには 3D / Filters and Effects / GSAP / Motion / Framer が並びますが、実際に取得できた HTML は Astro v6.1.9 が生成した静的ページで、canvas も WebGL も3Dモデルも見当たりません。ヒーローは hero-hand-base-1024.webp と hero-hand-tech-1024.webp という2枚の webp を重ねる構成で、リングの立体感はレイヤー合成とモーションで作られています。ページ遷移は Astro の View Transitions を使っています。 【参考になるポイント】 ・Awwwards の 3D タグは必ずしもリアルタイム3Dを意味しない、という分かりやすい実例。タグを鵜呑みにせず HTML を見る価値がある ・ベース画像とテック（内部構造）画像の2枚重ねだけで、製品の中身が透けて見える演出を成立させている ・Astro の View Transitions によるページ遷移。重いJSフレームワークを積まずに体験の連続性を作る選択 ・画像は全て webp で 1024 幅の明示指定つき。製品サイトとしての軽さを優先している ・※GSAP と Framer は Awwwards のタグにあるが、取得した HTML からは script src を確認できなかった。バンドル未解析