「デザイン x 文章術」

Translate your Business

あなたのビジネスと
未来のファンをつなぎます

彩葉D&W

Webサイトブラッシュアップ事例:AiDeal Tech 様

Webサイトブラッシュアップ事例 Webサイトブラッシュアップ
この記事は約5分で読めます。

新発想の「会話空間」の空気除菌装置「Air Guardian®︎」を製造・販売されているAiDeal Tech様よりご依頼いただきました。

AiDeal Tech様 会社ロゴ

これまでは会社のロゴに良いものがなく使っていなかったということで、今回Webサイトをブラッシュアップする際に一緒にお作りいたしました。

AiDT様ロゴマーク

制作期間:1週間

ご希望内容

  • カラー:ご指定
  • イメージ:「安全・安心」「技術」「先進性」「上質・知的」

作成のポイント

  • 丸でも四角でもない、既存の型にはまらないロゴ全体のフォルムで「今までにないアイデア」を表現しました
  • 「先進性」を光のフォルムで、「安心・安全」「上質・知的」をフォントで表現しました
AiDT様ロゴイメージ
AiDT様ロゴイメージ

Webサイトブラッシュアップ

伝えたい想いが強ければ強いほど文字の量が増えてしまい、逆に読み手にとっては読みにくくなってしまう。

彩葉D&Wでは、会社様の想いを端的に表現しつつ文字の量を減らしてスッキリさせ、サイトを訪問してくださる方が読みやすいようにまとめ直す「Webサイトのブラッシュアップ」を行なっています。

今回は、自作された会社ホームページをブラッシュアップさせていただきました。

前提としては、ゼロからのリニューアルではなく、すでに作られている素材や文章を極力活かした上でのブラッシュアップです。

ページ数:7枚
期間:2週間

フロントページ

AiDeal Techさまの場合、最初の状態がコチラでした。

ぱっと見のイメージから、てっきりターゲットがBtoBなのかと思ったのですが、BtoC、BtoBどちらも展開していきたいとのこと。

まとまっているのですが、特に後半部分の「伝えたいこと」の文字数が多く、内容も専門的なので、一般消費者向けのホームページではない印象でした。

Aidtさまオリジナルのフロントページ
Before

そこで、私がブラッシュアップしたフロントページはこんな感じになりました。

(お写真・イラストはご提供のもので、差し替え予定なのですがまだ届いていないので、とりあえずのPhase1といった段階です。)

AIDTさまWebサイト
フロントページ(お写真&イラスト素材はご提供のものを使用)

今回の具体的な修正点は、主に下記になります。

  1. Webサイト構成の見直し
  2. スライドショーの修正
    • 文字を目立たせる画像加工
    • スマホサイズの画像加工
    • 画像の順番入れ替え
    • キャッチコピー修正
  3. キャッチ画像の設置
  4. 「伝えたいこと」を伝わりやすく文章修正

また、イメージカラーに合わせた全体的なカラーデザインやレイアウトの修正も行いました。

修正点1. Webサイト構成の見直し

最初に拝見した際、真っ先に修正をご提案したのがヘッダーナビゲーションでした。

ヘッダーメニュー
Before

この状態だと、訪問者がどこを見ればよいのか迷いやすい印象だったため、メニューをヘッダーとフッターに分散させることによってすっきりさせました。

  • 一般のお客様(BtoC)が訪問する頻度が高いと想定されるページはヘッダーメニューに配置
  • 専門的な内容までお知りになりたい企業向け(BtoB)のページはフッターメニューに移動
修正後のヘッダーメニュー
修正後のヘッダーメニュー(一般消費者向け)
修正後のフッターメニュー(企業向け)

修正点2. スライドショーの修正

サイトを開いた際に一番最初に目に飛び込んでくるのがスライドショーです。

このトップ画像が技術的な印象で一般向けではなかったため、家族団欒のお写真(写真はご提供のものを修正)と差し替えました。

Before
AIDTさまホーム画面
After

また、スライドショー上に表示しているキャッチフレーズが長すぎたので、全体的に短くしています。

修正点3. キャッチ画像の設置

見え難かったキャッチ画像を差し替えました。

Before

After

修正点4. 「伝えたいこと」を伝わりやすく文章修正

主な実施内容は下記になります。

  • 全体
    • 本当は一番伝えたいのに公開できていなかった専門的な内容のページをブラッシュアップし、フロントページから移動させた一部の内容と合体させました
      =>専門的な内容も知りたい方や取引先企業向けに「会話空間の空気除菌」というページを新設
    • 拝見した際に私自身が知りたいと思った内容を、「よくある質問」を新設して盛り込みました
    • 他の類似製品との違いを伺い、「製品の安全性」「製品にかける想い」という項目を新設して盛り込みました
  • 商品
    • 商品区分が商品コードのみでなされていたため、商品の特徴をお付けして、違いがわかるようネーミングしました
      (仮:エアガーディアンミニ・置き型・縦型)

商品ページの修正

商品の詳細を載せているページにも、下記の修正を行いました。

  • 商品同士の違いが比較できるよう商品を一覧にし、個々の特徴をまとめました
  • エアガーディアンと類似商品の違いをまとめました
旧:AIDT様商品一覧
Before
ブラッシュアップ事例
After(バナーはお作りしました)

まとめ|「魅力を伝える」お手伝いポイント!

今回は、ゼロからのリニューアルではなく、すでに作られている素材や文章を極力活かしてのブラッシュアップをしています。

(※ご希望に応じ、ゼロからのリニューアルも承っています)

その際、製品の魅力を伝えるために意識したポイントは下記になります。

  • イメージの変更
    • 専門的&技術的な印象だったホームページを、一般向けの柔らかい印象のデザインに変更し、気軽に訪問してもらえるホームページにしたこと
  • サイト全体の構成
    • 一般消費者が読みたい情報と、得意先企業が読みたい情報の動線を分けたこと
  • デザイン修正&リライト
    • 空間や区切りを設け、レイアウトを変更し、文章量を減らし、読みやすくしたこと
  • 製品同士の区別
    • 製品の違いがわかりずらかったため、製品番号だけでなく区別するためのお名前を仮りで付け、それぞれの違いがわかる特徴をまとめたこと
  • 類似製品との差別化
    • 売りポイントを箇条書きにして、他の類似製品との違いを一目でわかるようにしたこと
    • 他の類似製品との違いで専門的な内容は、項目を新設してまとめたこと

コロナのみならず、いつ何時、どのようなウイルスが発生するかもわからないこれからの時代に、効果の実証された日本製の空気清浄装置「Air Guardin®︎」があれば安心ですよね。

気になる方は是非、AiDeal TechさんのWebサイトをのぞいて見てくださいね。

『デザイン x 文章術』
Translate Your Business

彩葉D&Wでは、目の前にいない誰かのためにプライドを持って誠実に「ものづくり」できる日本の良さを応援しています。

コメント

タイトルとURLをコピーしました