Design Gallery
【TOPページ】
【会社概要】
【事業内容】
【お問い合わせ】
Design Approach
01 | Project Overview プロジェクト概要
制作物 ITコンサルティング Webサイト（4ページ）
業種 IT・DXコンサルティング
担当範囲 ワイヤーフレーム／ビジュアルデザイン
使用ツール Figma／Photoshop
02 | Background 制作背景
企業のDX推進やIT導入を支援するコンサルティング会社のWebサイトを制作。
支給された要件・コンテンツ構成をもとに、専門性の高いサービス内容を分かりやすく見せながら、ITパートナーとしての信頼感と先進性が伝わるWebサイトを目指しました。
TOPページを含む全4ページのワイヤーフレームとビジュアルデザインを担当しています。
03 | Target ターゲット
DX推進やシステム導入、業務改善などに課題を抱える中小企業の経営者・担当者。
ITに関する専門知識が十分でなくても、サービス内容や支援範囲を理解でき、安心して相談できるパートナーを探しているユーザーを想定しました。
04 | Design Concept デザインコンセプト
「ビジネスとITをつなぐ、信頼できるパートナー。」
パープルとブルーを中心とした配色で、IT企業らしい先進性と専門性を表現。
余白を広く取り、写真・アイコン・カードを整理して配置することで、情報量のあるBtoBサイトでも堅くなりすぎず、知的・クリーン・信頼感のある世界観に仕上げました。
05 | Design Process 設計・制作プロセス
支給されたページ構成とコンテンツを確認し、各ページで情報を見やすく配置するためのワイヤーフレームを制作。
TOPページでは課題・強み・サービス・ニュース・問い合わせを、下層ページでは会社情報、サービス詳細、FAQ・問い合わせフォームなど、それぞれのコンテンツ量に合わせて視認性と読みやすさを考慮したレイアウトを設計しました。
ワイヤーフレーム確定後、4ページを共通したデザインルールでビジュアルへ展開しています。
06 | Design Point デザインポイント
Layout Design
文章量やコンテンツの種類に応じて、カード・写真・アイコン・表などを使い分け、各ページで情報を追いやすいレイアウトを設計しました。
Visual Design
パープルとブルーを軸に、IT・DX領域に求められる先進性と専門性を表現。余白を活かしたクリーンなレイアウトと写真・アイコンのトーンを統一し、信頼感のあるビジュアルに仕上げました。
Usability
サービス内容、電話・問い合わせフォーム、FAQなど、ユーザーが確認したい情報を視覚的に見つけやすくデザイン。ボタンやリンクの状態にも一貫性を持たせ、操作しやすいUIを意識しました。