【UXケーススタディ｜Webサイト編】デザインスタジオ・エルに聞く、企業の「個性」と「空気感」をWebサイトでどう表現するか？

「BLUEDGE」は、サプライチェーン・物流領域に特化したITコンサルティング、システム開発企業。同社サイトのリニューアルを通じて、どのようにUX最適化が導かれたのでしょうか？（『Web Designing 2025年10月号』より抜粋）

取り上げるWebサイト

BLUEDGE（ブルーエッジ）

「BLUEDGE」は、長野市に拠点を置く有限会社デザインスタジオ・エルがリニューアルを手がけたコーポレートサイト。WordPressベースで社内更新しやすく実装するなど、運用面も含めて全面刷新した。

プロフィール

有限会社デザインスタジオ・エル
1976年創業。今年は創業50周年イヤー。企業やサービスが「らしさ」によって選ばれ、愛される存在になることを目指し、言葉・デザイン・体験を通じたブランディング支援をしている。

サイトだから伝わる体験や感触を表現する

私たちが念頭に置いたのが、「このコーポレートサイトだからこそ体験できる」を、きちんと表現することです。

リニューアルの依頼段階では、従来のサイトは同社のサービスや技術力を伝える内容は押さえられているものの、どの分野に強く、どのような価値を提供する会社かについて、また他社でなくBLUEDGEが選ばれる理由がよくわからない構成だったため、BLUEDGEという企業の輪郭がきちんと伝わるコーポレートサイトの必要性を感じていました。

そこで私たちは、「BLUEDGEらしさとは？」を追求したブランディング、およびWebサイト内のUXを全面的に見直す形で、制作を手がけることにしました。

まずは、本案件全体で私たちが進めたアウトラインを整理していくと、「聴く」「見つける」「つくる」「育てる」という4つのフェーズを設けて、さらに各フェーズでそれぞれ「深く」「細かく」対象と向き合いながら、UXの観点からマーケティングと、機能面、情緒面からサイトを見直し、検討や分析を進めていきました。

私たちは元々グラフィックのデザイン会社で、つくることに特化していた制作会社でした。一方で、時代や事業環境の変化にあわせて会社のあり方も対応しなければなりません。いわゆる「つくる」ことの前後に位置するマーケティングや調査、ブランド構築や運用支援といった業務を身につけ、クライアントの根本的なところから対応するために、既存のワークフローを全面的に見直してきました。

制作に専念していたときと違い、クライアントの細部の変化に気づけるようになり、本案件でもブランディング支援が可能な体制を組んで、臨んでいます。

相手を熟知するための材料を集める

各フェーズについてもう少し詳しく解説すると、まず「聴く」のフェーズで、クライアントの現状を把握します。本案件では問い合わせフォームから最初のコンタクトがあったので、フォームで記された内容に基づき、依頼内容を把握します。この段階で、予算（見積もり）やスケジュールをクライアントと共有しながら、短期・中期・長期の目標をすりあわせ、双方がおおよそ同じ方向を向いて取り組むための地ならしをします。

次の「見つける」のフェーズで、本格的にクライアントを深掘りしていきます。まず自社で作成したブランディングシートの必要な項目に記入してもらいます。本案件では約2週間の期間を設けて、じっくりと書いてもらいました。

シートの項目は、「コーポレートサイトでどういうことを表現したいか」「どのような機能が欲しいか」などの機能・実装についての項目とともに、「創業の背景や経営理念」「具体的な業務内容」などの基本情報や、マーケティングに関する項目、例えば「競合他社の捉え方」「競合他社との違い」「自社の強み」「自社ブランドの考え」「ターゲット層」「ペルソナ」などについて、それぞれ踏み込んだ内容をうかがっていきました。

また、最初の「聴く」のフェーズを通じて、今後の希望も含めてクライアントの想いを私たちが言語化します。この時点で出てきた疑問点や確認したいことは、クライアントの「こうありたい」という希望や方向性を確認する項目に追加しておきます。

これらの回答からは、Webサイトに求めたい雰囲気や情感について読み取れることが多いので、案件ごとでブランディングシートの項目を必ずカスタマイズしながら各項目を確認していきます。

「らしさ」を具体化する

本案件のようなコーポレートサイトをはじめ、クライアントのブランディングにかかわる際には、それぞれのクライアントやそのサービスが持つ「らしさ」、本案件なら「BLUEDGE“らしさ”」の追求を私たちはとても重視します。具体的な成果物をつくり出す前に、こうした概念的、抽象的なものを掘り起こし、整理し、分析していく工程を、しっかりと時間を設けて取り組みます。つくり始める前の時間を十分に確保し、そこから根拠を見出してから、初めて制作へと着手するのです。

BLUEDGEの場合、問い合わせ段階やブランディングシートの記入内容からクレバーな印象を感じていました。同時に、ヒアリングで直接クライアントと対面し、言葉を交わした際には、自社業務への強く熱い思いが伝わってきました。

このように、対面したからこそ感じ取れる相手からの温度感は、ブランドコンセプトやデザインの方針にも反映しておきたいエッセンスになることも多いので、ヒアリングの現場には、複数の制作メンバーが集まり、積極的に参加します。

私たちは言葉とビジュアルで方針を定めるように「らしさ」をカタチに落とし込みます。本案件ではブランドコンセプトとして「物流の新たな可能性を拓く」という言葉を定義し、構成要素として「聡明」「親身」「冒険心」という3つのワードを導きました。この段階で「らしさ」を言語化しておくことは、制作のフェーズににおける指針や基準を設けることになるのです。言葉がデザインを後押しし、デザインが言葉に立ち返らせる。この過程を経て、「らしさ」の解像度が高まっていきます。

情報設計とデザインとの融合によるUX

「聴く」と「見つける」のフェーズを通して、最適化した構造やコンテンツ、デザインなどの方向性が見えてきたら、公開を意識した具体的な制作（「つくる」フェーズ）へと移ります。

このフェーズでは、情報設計とデザインが分断しないように配慮します。想定する導線が担保されながら、ブランド体現ワードに共鳴する構造およびデザインの実現を判断軸にして、UXの提供を目指しました。

進行過程では、ユーザーが迷わず目的のコンテンツに到達するという導線設計のもと、複数のパターンのデザインを用意し、「導線も踏まえた検討」を行います。

メイン画面（ファーストビュー）で何がどう伝わるか（伝えたいか）という点も重視しています。BLUEDGEサイトでは、本格的な相談に入る前の、ちょっとわからないことを聞きたいユーザーへの訴求に応えるコンテンツも増強したかったので、パッと見たユーザーに「メッセージが適切に伝わる状態か？」という観点のもと、掲載情報やWebサイトから漂う雰囲気、メニュー構成などを細かく検討します。チーム内で同意した後には、クライアントと共有して、改めて検討を深めていきます。

最終的にメイン画面では、視線が向きやすい上部にメニュー「事業内容」を置いて、BLUEDGEを知りたいと思って来訪したユーザーの動きを捉えやすい構造にしました。

クリックすると、「事業一覧」だけでなく「こんなお悩みを解決します」という、ライトユーザー層を意識したメニューを用意してあります。さらに「こんなお悩みを解決します」に紐づく2コンテンツは、Q&A形式で読みやすく噛み砕いた内容で「どのような相談ができそうか」がわかりやすく伝わるようにしました。

コンセプトを裏づけるクリエイティブづくり

本サイトのUXを支えるのが、サイト内のイラストの展開です。コンサルティングと聞いて、「専門的でハードルが高い」と敬遠しかねないユーザーにこそ、気軽に問い合わせることができるサイトになることが変更希望の1要素でした。そこで、メニューに「こんなお悩みを解決します」を用意。親しみやすさや寄り添いの印象を演出し、写真を用いた現実的な表現ではなく、イラストを用いた象徴的な雰囲気を捉えた表現を模索していきました。

今回は企業ロゴもリニューアルしています。社名（BLUEDGE）と、社名に含まれるブルーを結びつけた「BLUEDGEらしいブルー」を模索し、ロゴと色を調整。辿りついた「BLUEDGEブルー」を基調に、イラストでは海や空をモチーフにクライアントの業務領域の広さや、未来に向けて制限しない姿勢が伝わる方向性で、最終調整を図りました。

数々の模索のなか、クライアントの判断もブレずに進めていけたのは、最初に「軸」を決めていたからでした。「らしさ」を体現する過程が、皆さんにも参考になると嬉しいです。

COLUMN｜Web制作会社の強み。”つくれる”を活かそう！

　AIの台頭で、直接Webサイトを確認しなくてもAIで調べたらわかる、という人が増えています。だからこそデザインスタジオ・エルは、Webサイトで伝える意味を強く意識して取り組んでいる、と話します。

「ユーザーは、Webサイトならではの体験ができて初めて、サイトを訪問した価値を感じるものです。私たちは、AIで調べてもピンとこないことが確認できるサイトをつくりたい。私たちWeb制作会社の強みは、“つくること”。つくっては検証する、この繰り返しができる強みを今後も活かしたいです」（同社代表取締役・ハラヒロシさん）

取材・文：遠藤義浩