Ster Books（ブックカフェサイト）
- 制作区分
- 自主制作
- 担当範囲
- コーディング
- 制作期間
- 約1週間
- 使用ツール
- VS Code / HTML / SCSS / JavaScript
- サイトタイプ
- 店舗サイト
- ターゲット
- 静かな時間を楽しみたい20〜50代の読書好き
架空案件概要
クライアント
Ster Books
事業内容
ブックカフェ運営
ご依頼背景
デザイナーが制作したデザインカンプをもとに、Webサイトとして実装してほしいというご依頼を想定。
店舗の世界観を損なわず、PC・スマートフォン両方で快適に閲覧できるレスポンシブサイトとして構築することが求められていました。
サイトの目的
メイン
デザインカンプを忠実に再現したコーディング
サブ
・レスポンシブ対応
・保守しやすいコーディング
・快適な閲覧体験の提供
ターゲット
メインターゲット
静かな時間を楽しみたい20〜50代の読書好き
ペルソナ
読書やカフェ巡りを趣味とする方。
店舗の雰囲気や居心地を重視して来店先を選ぶ。
制作意図
デザインの魅力を最大限活かしながら、レスポンシブ対応を含めた実装を行いました。
見た目の再現性だけでなく、保守性や拡張性も考慮し、BEM設計を意識したコーディングを行っています。
デザインのポイント
デザインカンプの忠実な再現
レスポンシブ対応による閲覧性向上
FAQの実装によるユーザビリティ向上
情報設計を崩さないコーディング
保守しやすいSCSS設計
デザインコンセプト
「一冊の本と、一杯の珈琲を。」
※デザインは支給デザインをもとに実装
制作担当
HTMLコーディング
SCSS設計
JavaScript実装
表示調整・検証