架空の造園会社「木山造園株式会社」のコーポレートサイトを制作。 家庭のエクステリアから公共施設の土木伐採まで幅広く取り扱い企業です。長年造園業を営んできた実績をサイト上で見せることで新規顧客の獲得を狙う。自然との調和を意識し、グラデーションを用いて親しみやすさを表現。
総作業時間
74時間
担当
コンセプト立案(5時間)、ペルソナ設定(3時間)、サイトマップ制作(0.5時間)、ワイヤーフレーム制作(20時間)、写真素材の選定(2時間)、デザイン(10時間)ライティング(3時間)、コーディング(30時間)、ロゴ(0.5時間)
使用ソフト
Figma、Photoshop、Illustrator、Visual Sutudio Code
URL
https://adjustacademy.com/d231200/d231203-120702/one/
サイトの目的
無料相談や見積もり依頼、コンタクトフォームの改善、新規顧客の獲得、実績のアピール
ターゲット
個人住宅所有者、商業施設オーナー、公共機関や自治体
デザインについて
木山造園株式会社が自然との調和を重視していることを表現するように心がけました。グリーンのグラデーションや自然の風景の写真を使用することで、訪問者に自然の中でリラックスした雰囲気を感じさせる効果があります。 グラデーションには明るい色彩を用いることで、親しみやすく、明るい雰囲気を演出。情報はアクセシビリティを重視し、わかりやすいシンプルなデザインにしています。 サイト内での造園プロジェクトの写真や実績を多く掲載しており、木山造園株式会社の長年の経験と実績をアピールしています。写真を多用し、具体的な施工例やプロジェクトの様子を伝えることができるので、サイト訪問者に信頼感を高めます。 お問い合わせや相談のためのコンタクトフォームを設置し、訪問者が簡単に連絡を取れるようにしています。 コンタクトフォームの設置は訪問者が興味を持った時に直接連絡を取れるよう促し、新規顧客の獲得を狙っています。
コーディングについて
1作目の制作だったため、正しくコーディングを行えるように意識しました。写真を多く使用した為、写真の間隔を特に意識しました。 視覚的なバランスを考慮し写真同士が詰め込み過ぎないように、適度な空白を空けています。 写真を並べる際には、まとまり毎に各写真の間隔をなるべく均等に保つようにGAPやFlex要素を駆使しました。 SEO対策の点では学習したタグや属性を正確に使用することに細心の注意を配りました。 画像のALT属性は適切な説明文を記述しています。またページのタイトルや見出し、写真の説明文などには関連するキーワードを使うように意識しました。