コーディング・CMS構築 | shimoji tomoya のポートフォリオ

お問い合わせ お問い合わせ

Wood Gang Works

サイトを見る
Wood Gang Works
種別
企業サイト
サイト名
Wood Gang Works
作業内容
デザイン〜CMS実装
CMS
WordPress
使用技術
HTML, CSS, JavaScript, GSAP, WordPress

詳細

概要

ウッドデッキを専門施工する「WoodGangWorks」のサイト。本業は植木職人だが、植木屋のイメージは控えてウッドデッキを中心にブランディングをしたいとの要望。ライフスタイルに合わせて自由に楽しむウッドデッキをテーマにデザイン。

解決したい課題

  • 既存サイトは植木屋のイメージが強く建築系人員の募集に至らない。
  • 同業他社ではSNSから採用に至ることがあり、サイトとSNSをうまく連携させて採用に至るようにしたい。
  • 施主のニーズに合わせ自由にウッドデッキを提案できることを強みとして伝えたい。
  • 代表・従業員を身近に感じてもらえるようなフレンドリーなサイトにしたい。

ターゲット

  • ウッドデッキを検討している人
  • ある程度予算をかけても欲しい空間を実現したい人
  • 自分のスタイルを明確に持っている人

デザイン

  • メインビジュアルでウッドデッキのスタイルを複数提示することで、使用イメージを限定しない自由なウッドデッキを提案できるようにした。
  • 選ばれる理由と施工実績で信頼をえて、注文の流れやFAQで不安感を払拭、コラムとプロフィールで親近感を感じてもらえるようにした。
  • 配色はユニフォームカラーのベージュにオレンジをアクセントとしてメリハリをつけた。
  • 操作できる部位が直感的にわかる方に、ボタン・アイコンのデザイン・ホバーアクションを統一。

構成

  • GSAPを使用してメインビジュアルに大きなアニメーションを設置。ページ内の要素はスクロールに連動してフェードインする。
  • 施工事例・コラムは記事投稿画面から自動でSNS(Instagram/Pinterest)に投稿。手間をかけずにSNSとホームページを連携させる。
  • ホームページコンテンツはWordPressのカスタムフィールドを使用して、コンテンツの追加・削除を容易に行えるようにした。

制作期間

デザイン:1週間 / コーディング:1週間 / CMS実装:1週間

  • Wood Gang Works
  • Wood Gang Works
上に戻る