03
LP / 自主制作
2026
RESET BITE
サプリメントLP
架空のサプリメント商品を題材に、Figmaで設計してからコーディングしたスマートフォン向けランディングページです。
制作の意図
LPは「きれいに見せる」より「読み進めてもらう」ことが役目だと考えて、共感 → 納得 → 行動 の順に並べました。最初に7項目のチェックリストで自分ごとにしてもらい、そのあとで成分の説明に入ります。成分を先に置くと、興味を持つ前に読むのをやめられてしまうためです。
担当した範囲
商品コンセプトの設定、構成案、Figmaでのデザイン、HTML/CSSでのコーディングまで。JavaScriptは使わず、CSSだけで組んでいます。
ことわり
掲載しているのは架空の商品です。実在する商品・効能ではありません。実案件では、こうした表現に薬機法上の確認が必要になることを理解したうえで制作しています。
| 制作年 | 2026年 |
|---|---|
| 種別 | ランディングページ(自主制作) |
| 担当 | 企画・構成・デザイン・コーディング |
| 使用ツール | Figma / Visual Studio Code |
| 技術 | HTML / CSS(JavaScript不使用) |
| 想定端末 | スマートフォン(幅393px基準) |