hibikiya.labでは、WordPressやHTML/CSSを用いたWeb制作を中心に
、やわらかく、感情に響くデザインを心がけています。
以下は、これまでに制作した自主制作例の一部です。今後も随時追加してまいります。
※こちらは架空案件の参考制作です。実際のご相談を想定し、目的や課題に合わせて構成・デザインを整えました
コワーキングカフェ紹介サイト
目的：小規模事業者が信頼感を伝えられる第一印象を設計
工夫：ファーストビューに余白を持たせ、導線をシンプルに整理
使用技術：HTML・CSS
オンラインショップ
目的：食品ECで商品の魅力を視覚的に伝え、購入導線を明確に
工夫：写真の見せ方と「買いやすさ」を意識した構成
使用ツール：HTML・CSS
コーポレートサイト
目的：事業内容と問い合わせ導線をわかりやすく提示
工夫：フォームへの誘導を自然に行えるレイアウト設計
使用ツール：WordPress・情報設計
バナー
目的：キャンペーンや告知を、ターゲットに合わせて的確に届ける
工夫：ペルソナ設計から導線設計までを行い、視線の流れと行動喚起を意識したデザインに仕上げました
使用ツール：Canva・Googleスライド
未経験者向けキャリア支援LP
目的：未経験の若年層が安心してキャリア相談に踏み出せるよう、共感と信頼感を重視したLPを設計。
工夫：ペルソナ設計をもとに、ファーストビューで「自分ごと化」しやすいコピーとビジュアルを配置。悩み → 安心 → 行動の流れで、無料相談への導線を自然に設計。視線の流れ・情報の優先順位・CTA配置を細かく調整し、行動ハードルを下げる構成に。
使用ツール：Figma（構成設計・デザイン制作）