ウェブサイトの再設計を行うのに最も適切な時期はいつですか？

時代遅れで見捨てられたように見えるウェブサイトに出くわしたことがない人はいますか？壊れたトラックの甲羅が砂漠に置き去りにされたように、何年もの間明らかに手つかずのままでした。

ウェブサイトはさまざまな理由でリニューアルされています。残念ながら、多くの企業は ウェブサイトの再設計が必要 、そしてライバルが彼らを改善することによって競争力を獲得し、結果として彼らのコンバージョンを後押しするとき、取り残されます。

企業がよく犯す間違いは、ウェブサイトのニーズがより複雑になった場合に何が起こるかを早期に考慮しておらず、その結果、ウェブサイトを拡張する必要があるときに、困難でコストがかかる可能性のある状況に陥っています。さらに、検索エンジン最適化（SEO）、SSL（ランキングとセキュリティに影響を与える）、モバイルの使いやすさ（ランキングとコンバージョンに影響を与える）などの重要な要素は、しばしば無視されてしまう可能性があります。

新しいウェブサイトのデザインは、新しいブランディングの方向性が確立され、新しいブランドマーケティングの人々が参加するトップのリーダーシップの変化のためにしばしば起こります。会社のウェブサイトを評価すると、UXがひどいことを知り、かなりの量の望ましいコンテンツが欠落していることに気づき、彼らはぞっとします。結論として、それは単に「ブランドの声」や会社が求めているコンバージョンを提供しない「パンフレットのウェブサイト」をひどくまとめたものであり、コンセンサスはそれが変化の機が熟しているということです。ウェブサイトを刷新する時が来ました。

自動車会社のウェブサイトの刷新

この自動車のウェブサイトの再設計のケーススタディは、公式の委託された再設計ではないことに注意してください。会社、デジタル戦略、または自動車業界全体に関する内部情報はありません。私は単に自動車業界をウェブサイトの再設計のケーススタディのテストケースとして使用しています。

このケーススタディでは、クロアチアの自動車ブランドのWebサイトの再設計プロセスについて説明します。 リマックカー 。リマックは、シンプルな車のコンセプトから始まり、その後、大手部品製造会社にまで拡大したブランドです。多くの新興企業と同様に、同社はアイデアから始まり、最終的には別の何かに進化しました。この拡張はWebサイトの構造に影響を与え、ユーザーの焦点全体が変化しました。市場の需要により会社は別の方向に進んだため、Webサイトの焦点もシフトする必要がありました。

素晴らしいものを達成するために考慮すべき多くの異なる側面と角度があります ウェブサイトデザインソリューション 。前の事実にもかかわらず ウェブデザイナー リソースがないか、十分な時間がない可能性があります UXリサーチ 、 ワイヤーフレーミング 、プロトタイピング、および ユーザーテスト 、デザインの全体的な品質に関しては、初期のデザインの最小の決定でさえ重大な悪影響を与える可能性があり、最適とは言えないWebサイトの品質は、最終的に2、3年でWebサイトの再設計につながります。これの結果は、長期的には、クライアントが彼らが思っているよりも多くのウェブサイトにお金を払っているということです。新しいウェブサイトのデザインに関しては、明確に定義されたコンテンツ戦略と情報アーキテクチャが非常に重要です。

大企業のウェブサイト、ニュースポータル、その他のコンテンツを多用するサイトを設計するとき、私は大ファンです。 アトミックデザイン 、プロジェクトの開始時に複数の画面や予期しない状況で機能するすべてのUIコンポーネントを作成することを目的とした柔軟な設計システム。この特定のケーススタディは大規模なニュースポータル向けではありませんが、アトミックデザイン要素のデザインライブラリ（慎重に検討され、明確に定義されたデザインコンポーネントのセット）が機能するように設定されていると、プロセスがはるかに簡単になります。後で。

ウェブサイトに適切なコンテンツ戦略があり、 情報アーキテクチャ 焦点がユーザーエクスペリエンスに移る必要があります。適切なウェブサイトの構造がなければ、ユーザーエクスペリエンスデザインには効力がありません。一見、見た目も機能も良いのかもしれませんが、十分な柔軟性がない場合は、いつかウェブサイトのリニューアルを検討する必要があります。

この自動車会社のウェブサイトを再設計する理由

リマックアウトモビリは拡大しており、公式の投稿によると、と呼ばれる新しいコンセプトカー 「concept_One」 すでに生産中です。この委託されていないウェブサイトの再設計の時点で、彼らのウェブサイトは1台の車しか展示していませんでした。 「C_Two。」 視覚的な多様性はありませんでした。Webサイトは2つのテンプレートから作成されたため、各ページは非常によく似ていました。デザインは、車の大きくて魅力的な画像に焦点を当てており、 C_Two 車の品質-ウェブサイトの訪問者を車の購入決定に導くために必要な重要な情報。

ことわざにあるように、「第一印象を与える機会は二度とありません」。優れたデザインの影響を利用して、訪問者（この場合は主に高性能の自動車愛好家）に100万（USD）近くの自動車を購入するように効果的に説得することが重要です。そのようなハイエンドのウェブサイトは、信じられないほど高い基準を満たす必要があります。高級感とカリスマ性を発揮し、高いレベルのセールスマンシップと魅力的なスタイルを提供する必要があります。

優れたウェブサイトのデザインは、同様のウェブサイトの海で際立っている必要があります

自動車業界の大きな問題は、その分野のほとんどのWebサイトが同じように見える傾向があることです。異なる配色とヒーロー画像を除けば、ほとんど同じウェブサイトテンプレートを使用しているように見えます。

自動車会社のウェブサイトのデザイン決定の背後には多くの要因がありますが、100万ドルと25,000ドルの自動車を、それらが提示される方法で明確に区別する必要があります。

ハイエンドの自動車分野では、 フェラーリ 、 ランボルギーニ 、および アストンマーチン （私の意見では）実際には優れたユーザーエクスペリエンスを提供しない、非常に単純な、通常は企業のWebサイトがあります。

ミドルコンシューマーレンジ（ フォルクスワーゲン 、 トヨタ 、 プジョー など）は、上記のよりハイエンドな例と非常によく似たWebサイトコンテンツ構造を持っています。ハイエンドとミッドレンジの消費者向け自動車ブランドの最大の違いは価格です。したがって、ハイエンド車を搭載したRimacは、この違いを反映して高価なブランドを紹介するために、優れたWebサイトを持っていると予想されます。

これらの超高価な自動車ブランドのWebサイトにアクセスすると、顧客の期待が高まります。それは大きな財政的コミットメントであり、当然のことながら、彼らは自分たちのお金で買える最高の車を確実に手に入れたいと思っています。

リマックがトヨタより優れているのはなぜですか？彼らのウェブサイトを見ると、これら2つの非常に異なるブランドの間に大きな違いはありません。これは彼らのウェブサイトの品質から明らかであるべきではありませんか？

優れたウェブサイトデザインで高級車の購入者をターゲットにする

すべてのウェブサイトはそのユーザーを考慮する必要があります。この種の車のターゲットオーディエンスは誰ですか？彼らは何を探していますか？

リマックの車の価格は約85万ドルで、数台しか製造されないため、「限定版」のラベルが付けられます。これらの車の購入に関心のある顧客のタイプを正確に特定することはできませんが、ほとんどの顧客は裕福なエリートから来ていると推測できます。 Rimacのウェブサイトはこれらの顧客を効果的にターゲットにしていますか？

情報アーキテクチャの分析

サンプルWebサイトでは、最初のナビゲーション項目が 「concept_One」 （当時、それは会社の唯一の製品でした）。その後、実際のWebサイトが更新されました。 2番目のナビゲーション項目は会社の進化、自動車の製造方法であり、3番目の項目は会社の製品とサービスです。 4番目のナビゲーションアイテムは別の会社の製品です（ グレイプ電動自転車 ）。最後の2つの項目は、プレスリリースを含む「プレス」と「ブログ」です。どちらも、ニュースのほとんどがソーシャルネットワークで公開されているため、特に有用ではありません。

もう1つの問題は、キャリアリンクが二次的で重要性の低いナビゲーション項目として隠されており、会社の大幅な拡大を考えると、重要な問題を表していることでした。ユーザーを企業の懸念事項の焦点と見なすと、ほとんどの企業のWebサイト（通常の例外は企業/非常に大規模なWebサイト）で、目立つ「キャリア」リンクまたはCTAを持つことが非常に重要であることがわかります。

ウェブサイトの再設計プロセス

ホームページヒーロー画像前後

当初の目的は、より暗く、より強力なバージョンの車を作成することでした。私はいくつかの画像を見つけました Concept_One オンラインの車と「Photoshopの魔法」を使って、ホームページの最初のヒーロー画像を作成しました。次のアイデアは、アニメーションで車をゆっくりと表示することでした。最初に背景、次に車の輪郭、次に完全にレンダリングされた画像です。

ホームページのデザイン

ホームページのコンセプトは、トップナビゲーションとカーヒーローイメージの2つの主要な視覚領域を定義することでした。それでおしまい。ミニマリストでありながら印象的なものにするために、不要なものはすべて削除されました。一目ですべての重要なものが表示されます—他のすべてはサイト内のサブページに移動されました。

コンテンツ戦略とデザイン

このようなウェブサイトの刷新プロジェクトでは、サイトの構造や視覚的な美学だけでなく、コンテンツもデザインすることが重要です。これは委託されていないWebサイトの再設計であるため、実験の自由度が高くなり、独自の設計決定を行う機会が十分にある場合の美的柔軟性も提供されます。

プロセスは簡単です：

1. ウェブサイトに表示される本文を準備します。
2. アイコンやインタラクティブなアニメーションを使用して、加速、馬力、最高速度に関する人目を引く詳細など、いくつかのデザイン要素を伝えます。

これにより、UIに補助的な単語が不要になり、Webサイトの訪問者にとってより重要な領域に注意が向けられます。

ウェブサイトナビゲーションの再設計

ウェブサイトのナビゲーション構造は、重要な階層に基づいて再配置されました。我々は持っています 車両 ナビゲーションの最初のドロップダウンとして、将来的に車のモデルを追加できるため、設計の柔軟性が高まります。

セカンダリへの即時アクセスを提供するため 製品 ホームページのページでは、効率を上げるために、別の商品リストページを（別のウェブページに）作成するのではなく、 製品 そのサブカテゴリは、ドロップダウンエリアとしてホームページに組み込み、ナビゲーションの一部にすることができます。以下のデザインは、訪問者がクリックしたときにホームページにアイコンとしてレンダリングされるさまざまな製品を示しています 製品 ナビゲーションで。下の2番目のレベルを意味する3D製品レンダリングの場合 製品 、Three.js、WebGL、Canvas、Greensockはよく知られている標準化されたツールなので、お勧めします。

ウェブサイトの再設計内のセカンダリページ

とは対照的に ホームページ 、などのセカンダリページ 約 そして サービス ページは、異なる、よりZパターンのグリッドを使用します。さまざまなグリッドレイアウトの目的は、これらのページをスキャンしながら、訪問者により興味深くダイナミックな環境を提供することです。

中心的なアイデアは、テキストをできるだけ少なくした視覚的なミニマリズムです。人々は、多くのテキストを読むためにこれらのタイプの自動車のWebサイトにアクセスするのではなく、情報をすばやく視覚的に取得するためにアクセスします。これは、ページタイトルの大きく太字のフォントとさまざまなフォントスタイルの採用の背後にある考え方でした。

この種の「会社のパンフレット」ウェブサイトの再設計は、サービスの再設計とは異なることに注意することが重要です。 「会社のパンフレット」のウェブサイトは、製品のマーケティングに関するものです。サービス指向のWebサイトの再設計は、クリックをコンバージョンに変換し、最終的には利益を得る方向に傾いています。

Windowsはどの言語で書かれていますか

結論

他にもいくつかのデザインブログ記事があり、なぜそれが良いアイデアであるかを推奨しています。 デザイナー 側で委託されていない設計プロジェクトに従事する。本当にクールなプロジェクトを設計したい場合は、Webサイト、アプリ、エンタープライズSaaS製品などのアイデアを選び、その設計上の問題を解決します。

ドリブル 未承諾の概念的な再設計プロジェクトでいっぱいです。 デジタルデザイナー 彼らのデザインチョップを披露する機会があります。世界に創造的な解決策を提示するクールなデザインを提供することに加えて、「実際の」製品の問題に取り組むことは、潜在的な企業やクライアントにあなたの考え方、プロセス、専門知識を示します。

私の場合、この分野のWebサイトの設計が非常に高い基準を満たすことが特に重要であるため、ハイエンドの自動車Webサイトに取り組むことは素晴らしい演習でした。

ただし、注意が必要です。デザインに飛び込んでデザインを開始する前に、デザインの美学だけでなくコンテンツの観点からも、特定のWebサイトが3年後にどのように見えるかを前向きに検討することをお勧めします。機能、および構造。組み込みの柔軟性が設計上の重要な考慮事項であることが重要です。ウェブサイトやサブページが機能していてスケーラブルな場合は、将来の需要に合わせて微調整を行う方が簡単で効率的で、はるかに簡単です。

時々、潜在的なクライアントにウェブサイトの刷新をするように説得するのは本当に難しいです。多くの場合、クライアントは、リソース、資金、または時間の不足のためにコミットすることを躊躇します。それにもかかわらず、一方的なWebサイトの再設計は、Webサイトの再設計プロセスを世界に紹介するための優れた方法です。そして、誰が知っていますか？あなたのウェブサイトの再設計は、彼らが「本物の」プロジェクトのためにそれを青信号にするのに十分な気が進まないクライアントを感動させる可能性があります。

•••

ApeeScapeデザインブログの詳細：

• ウェブサイトの再設計の基礎–ケーススタディ
• UXの真のROI：B2B再設計のケーススタディ
• IKEAを箱から取り出し、16億人のユーザー向けに再設計
• Facebookを再設計しましょう：始めるための10のインスピレーション
• CrunchBaseの設計方法

基本を理解する

ウェブサイトの再設計とは何ですか？

ウェブサイトの再設計はそれぞれ異なりますが、基本的な目標は、UXの向上、オンラインプレゼンスの向上、コンバージョン率の向上です。典型的なウェブサイトの刷新は、グラフィックとインターフェースを更新するだけでなく、レイアウト、コンテンツ、およびSEOを更新します。

どのくらいの頻度でウェブサイトを再設計する必要がありますか？

最新かつ競争力を維持するには、2〜3年ごとにWebサイトを更新する必要があります。ウェブサイトの再設計プロセスは軽視されるべきものではありません。再設計を慎重に行うほど、持続力は長くなります。

ウェブサイトの更新が重要なのはなぜですか？

ビジネスが関連性と競争力を維持するためには、新しいWebサイトのデザインが重要です。ウェブサイトが現代的で最新のように見え、安全で効果的かつ最新の状態に保たれていることを確認することが重要です。そのコンテンツが新鮮であり、SEOが最大化され、分析が監視されていること。

なぜウェブサイトのデザインが重要なのですか？

調査によると、訪問者のほぼ75％がそのデザインによってビジネスを判断しています。優れたウェブサイトのデザインは、美学、UX、コンテンツ、メタデータを考慮しています。マーケティング戦略をサポートし、ブランド認知度を高め、訪問者を引き付け、ユーザーへの変換を支援します。