←BACK TO WORKS一覧へ戻る
実案件FeaturedCORPORATE
陽だまりデンタルクリニック
医療・歯科 / コーポレートサイト
「日々の暮らしに、やさしい歯科体験を。」を掲げる歯科医院サイト。無彩色のプレミアムなトーンと、スクロールに連動する大胆なタイポグラフィ表現で、上質で静かな世界観を全5ページに構築した。
このプレビューは実サイトを埋め込み表示しています。レイアウトは実際の閲覧環境と異なる場合があります。
CONCEPT
巨大な英字見出し×繊細な和文、ゆとりある余白、グレージュの無彩色パレットで構成したミニマル＆エディトリアルな歯科医院サイト。Lenisによる慣性スクロールを土台に、見出しの語句リビール、画像のマスク出現、固定パネルの画像がスクロールで切り替わる『特徴』セクション、症状から診療を探す導線（Find by Symptom）まで、スクロール連動の演出を全編に展開した。中核機能として、32歯をアーチ状に並べた歯式マップで治療部位を選び、概算を日本語PDFで出力できる料金シミュレーターを実装している。
背景・課題
高級感のあるタイポグラフィ主導の構成と、スクロールに連動して特徴を1つずつ固定表示する演出・速度差のパララックスといったモーションを、iOSを含む各環境で崩れない手法に翻訳して実装した。料金シミュレーターでは、jsPDFにWebフォントをサブセット埋め込みして日本語PDFの文字化けを解消し、ブラウザだけで見積書を生成できるようにしている。
DESIGN PERSPECTIVE
TECHNOLOGIES & FEATURES
主な機能
スクロール演出パララックス料金シミュレーターPDF出力フォームギャラリーSNS連携
使用技術
HTMLCSSJavaScriptjsPDF
CMSなし
フォームあり
アニメーションあり