出典：letslevitate.com ↗ 確認日 2026.10.23
Editor's note
編集部の視点
義足を使う人の日常の写真で製品を見せながら、販売先は医療の専門家と事業者に限ると明記し、注文の手順を7つのステップで示すデンマークのメーカー。
デンマークのヘアレウにある Levitate Technology のサイト。義足の足部パーツや足部カバーを作っている。トップは画面いっぱいの写真と動画を縦に重ねる構成で、カフェで座る人、街を歩く人、トンネルに立つ人など、義足を使う人の日常の姿に製品名と1つのボタンを重ねる。最後は「Are you a Professional?」で、チーム紹介と専門家向けページへの2つのボタン。ヘッダーでは「Professionals」を白い丸ボタンで目立たせ、「Contact us」を常に表示する。注文方法のページでは、販売先を医療の専門家と事業者に限ると書き、製品の選び方から担当者への連絡までを7つのステップで説明している。
- 01 製品を単体で見せる前に、使う人が暮らしている姿の写真で見せる
- 02 誰に売っているか（医療の専門家と事業者だけ）をはっきり書き、個人からの問い合わせの行き違いを防ぐ
- 03 注文の手順を番号つきのステップにし、型番（SKU）を控えて担当者に連絡する流れまで書く
Conversion
集客の工夫
- 販売先の明示 （あり） 医療の専門家と事業者だけに販売、と注文方法のページに明記
- 注文の手順 （あり） 製品・アダプター・体重・サイズを選び、型番を控えて連絡する7ステップ
- 専門家向けの入口 （あり） ヘッダーの「Professionals」を白い丸ボタンで強調
- 問い合わせボタンの常設 （あり） ヘッダー右に「Contact us」（塗りのボタン）
- 地域の販売代理店 （あり） 地域の代理店を案内する「Distributors」
- 会社所在地 （あり） フッターに社名と住所
- メール登録 （あり） フッターとポップアップでニュースレター
- 電話番号の掲載 （なし） トップにはなし（問い合わせフォームと地域の担当者へ）
製品より先に、使う人の暮らしを見せる
トップは画面いっぱいの写真と動画が縦に続く構成です。カフェで座る人、街を歩く足元、トンネルに立つ人。それぞれに製品名と1つのボタンを重ねるだけで、説明文はほとんどありません。部品そのものより、それを使って過ごす日常を先に見せています。
誰に売っているかを、はっきり書く
注文方法のページには、販売先は医療の専門家と事業者だけで、個人には直接販売していないと書かれています。地域の販売代理店の案内もあります。ヘッダーでは「Professionals」を白い丸ボタンにして目立たせ、トップの最後も「Are you a Professional?」で専門家向けの入口に導きます。販売先を明記することで、行き違いの問い合わせを減らせます。
注文の流れを、番号つきの手順にする
注文方法は7つのステップで、製品を選ぶ、アダプターの種類・体重・サイズを選ぶ、表示された型番（SKU）を控える、地域の担当者に連絡する、という順に書かれています。問い合わせフォームには、義肢装具士の名前と施設名を書く欄（任意）もあります。見積もりや注文の前に何を用意すればよいかが、読むだけでわかります。
チェック項目は 2026.10.23 に実ブラウザで描画したトップページ（PC 1440px・SP 375px）を確認したものです。
Colour
配色
- #000000 写真まわりの背景・フッター
- #FFFFFF 写真の上の文字・白い丸ボタン
- #414C51 「Contact us」のボタン
- #EFEFEF 製品写真の背景（明るいグレー）
- #B9BCC7 メール登録の送信ボタン
背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。
Typography
フォント
| 用途 | 使用フォント | 無料で近いもの |
|---|---|---|
| 見出し・本文・ボタン | Figtree | Figtree（無料） |
| 一部の小さな文字 | Lato | Lato（無料） |
| 要素 | PC サイズ / 太さ | PC 行間 | SP サイズ / 太さ |
|---|---|---|---|
| h1 | 28px / 700 | 1.65 | 24px / 700 |
| 本文（p） | 45px / 700 | 1.30 | 31px / 700 |
| ボタン | 14px / 400 | 1.65 | 12px / 400 |
実測値（PC 1440px・SP 375px、2026.10.23 計測）。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。
Structure
ページ構成（上から順に）
- 01 ヘッダー 製品・EVERSA™・カタログ・コミュニティ・会社紹介・注文方法と、白い丸ボタンの「Professionals」、言語、「Contact us」。上部に固定。 ヘッダー／ロゴ＋横並びナビ型
- 02 ファーストビュー 義足でカフェに座る人の写真に「New arrival」と製品名、「See the product」のボタン。 ファーストビュー／全面写真＋コピー型
- 03 新製品2 足部カバーの製品写真に「New arrival」と製品名。 ファーストビュー／全面写真＋コピー型
- 04 製品の動画 街を歩く足元の動画に製品名とボタン。同じ型で2本続く。 ファーストビュー／全面動画＋コピー型
- 05 シリーズの紹介 「Active.Life.Forever」と、シリーズへのボタン。 ファーストビュー／全面写真＋コピー型
- 06 走ることの紹介 トンネルに立つ人の写真に「Running is for everyone」と、ブレードのシリーズ（The Levitate Blade Series）へのボタン。 ファーストビュー／全面写真＋コピー型
- 07 専門家向けの入口 義足を調整する場面の写真に「Are you a Professional?」と2つのボタン。 行動喚起／ボタン帯型
- 08 フッター ニュースレター、会社の住所、サポート（カスタマーサービス・ウクライナでの入手方法など）、SNS。 フッター／ナビ＋会社情報型
Download
ワイヤーフレームをダウンロード
この構成を、Figmaで編集できるワイヤーに
上のページ構成を、DevNJ のワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。
Figmaでの使い方
- SVGをダウンロードする
- Figmaのキャンバスにファイルをドラッグ＆ドロップする
- セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める
文字はテキストレイヤーとして入ります（フォントは Noto Sans JP）。
Reproduce
このサイトを参考にするときのポイント
- 01 部品や機器を売る会社でも、使う人の日常の写真で製品を見せる
- 02 販売先が限られるなら、誰に売っているかを注文方法のページにはっきり書く
- 03 注文や見積もりの流れは、番号つきのステップで書く
- 04 専門家（取引先）向けの入口は、ヘッダーでボタンの形にして目立たせる
FAQ
よくある質問
Levitate のサイトで使われているフォントは？
見出しからボタンまで Figtree を使い、一部の小さな文字に Lato を使っています。どちらも Google Fonts で無料で使える書体です。
取引先にしか売らない会社のサイトでも、製品を詳しく見せる意味はありますか？
Levitate は販売先を医療の専門家と事業者に限ったうえで、使う人の写真や動画で製品を見せています。使う人が製品を知って専門家に相談するきっかけにもなり、専門家には注文の手順を示す、という2つの役割を1つのサイトで分けています。
どんな業種の参考になりますか？
医療機器・福祉用具のメーカー、代理店経由で売る部品メーカー、専門家を通して届ける製品を作る会社に向きます。
スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利はLevitateおよび各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成を DevNJ の部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。 掲載ギャラリー: Httpster
