架空コーポレートサイト制作/Corporate Site Production

【制作したサイト】

URL: https://lifedesign-tetote.com/

デザインカンプ

【要件】

◾️クライアント名：Life Design TETOTE

◾️業種：建設設計事務所

◾️目的：ブランディングとしてのコーポレートサイト、企業のイメージアップ

◾️ターゲット：神奈川県在住、30代、男女比率5:5、2人の子供がいる4人家族、こだわった住宅を作りたい

◾️ロゴ：指定なし

◾️画像：フリー素材を使用

◾️原稿：お任せ

◾️デザインキーワード：落ち着いた、おしゃれ、スタイリッシュ、洗練された

◾️色やフォント：指定なし

◾️ページ構成：トップページ、お知らせ一覧、お知らせ記事、施工事例一覧、施工事例記事、事業内容、会社概要、お問合せ

【制作概要】

◾️使用ツール： Adobe Photoshop、VS Code、WordPress

◾️使用言語： HTML、CSS、JS

◾️制作期間: 計6ヶ月程

【頑張った・工夫したポイント】

◾️配色

[ 落ち着いた、おしゃれ、スタイリッシュ、洗練された ]というデザインキーワードに合うような配色としました。メインカラーのネイビーには上品で知的な印象を与えるため、企業のイメージアップに繋がると思いました。相性の良い白をベースカラーとしてシンプルかつコントラストのある組み合わせとしました。アクセントカラーに暖色系のマスタードイエローを使用し、温かみと落ち着きをプラスしました。

◾️余白

今回の制作したサイトは余裕のある落ち着いたデザインに仕上げたかったため、全体的に余白を多めに取ることを意識しました。字間や行間、要素と要素の間の余白も数ピクセル単位での調節を何度も重ねて仕上げました。

◾️フォント

今回のデザインは比較的シンプルな構成としているため、フォント選びにはこだわりました。初稿制作時には全体的にシンプルで良く使われているフォントを使用していましたが、メリハリやがありませんでした。サイトの雰囲気も考慮し、トップページのメインビジュアルや見出し部分など特にこだわりを表したい部分にはWebフォントを導入してオリジナリティをプラスしました。

◾️素材

今回使用した画像は全て自身で探し、候補となる数多くの画像の中から厳選しました。素材選びで大切にしていたことは[ 高級感、統一感、高画質]です。画像一枚で全く異なる雰囲気のサイトに仕上がったり、企業そのもののイメージと強く結びついてしまうため、可能な限りたくさんの素材に目を通し、その中から今回の目的に相応しいものを選ぶよう心がけました。実際に使用した画像は、物によっては色味を調節するなどしてより落ち着いた雰囲気を出したり他の画像との統一感が出るよう仕上げました。企業ロゴは家をモチーフにしたものを作成しました。