受賞歴のあるウェブサイトをデザインする方法
この記事は以下の記事の翻訳記事です。
https://medium.com/@lassekristensen_95506/how-to-design-award-winning-websites-6f4d2a71495
FWA (Favourite Website Awards) の審査員として、私は業界で最も優れたデジタルの才能を持つ何人かの素晴らしい、魅力的なウェブ体験を目にする機会に恵まれています。
ウェブサイト賞を受賞するための秘訣はありませんが、心に留めておくべき経験則がいくつかあると思います。それは、あなたのサイトを記憶に残り、人々が「このサイトを見てみよう」と思わせるような、素晴らしいユーザー体験と魅力的なコンテンツを備えた、明確で価値のあるサイトを生み出すことでしょう。
この記事では、私が個人的に考える素晴らしいデジタル体験とは何か、そして私がFWA賞を受賞するサイトに賛成票を投じる動機とは何かについて、いくつかの考えをまとめてみました。
デザイン賞以上のものがあることは知っていますが、FWA、D&AD、Webby、Awwwardsのような組織が、デジタル製品を、そして最終的には私たちの技術を少し先に押し上げるために、その背後にいるチームがさらに一歩進んだプロジェクトを表彰することは素晴らしいことだと思います。ある意味では、私たちの仕事をゲーム化し、友好的な競争に変えてくれています。楽しいですね。
ここでは、素晴らしい魅力的なデジタル体験を構築する際に何をすべきで、何をすべきではないかについて、私の個人的な考えを列挙してみました。
これはすべて主観的なものです。いくつかのポイントが重なるかもしれませんし、同意できないこともあるかもしれませんし、少し矛盾していることもあるかもしれません。
これは、デザインとは、何が正しくて何が正しくないのかという点で、非常に流動的な境界線を持つ主観的なメディアであることを示しています。この記事は、私がサイトをレビューするときに何を見ているかについての私の見解を述べたものです。以下のガイドラインは、今後も継続的に更新していきたいと思います。それでは、早速始めてみましょう。
1. 明確な価値提案
言うまでもないことかもしれませんが、あなたのサイトは明確な価値観を持っていることが非常に重要です。
なぜ存在するのか？目的は何か？これは、明示的にも暗黙的にも明確に伝えるべきです。
すべてのデザインの決定は、この目的を中心にして行われるべきです。
簡潔であること、確立したビジョンから逸脱する可能性のあるものは何でも切り捨てましょう。
ユーザーがあなたのサイトを訪れたとき、あなたのサイトが何をしているのか、何を提供しようとしているのかがすぐにわかるようにしましょう。これは、以下の例のように、その目的を明確に説明することもできます。あなたの価値提案が何であれ、それは明確であり、エンドユーザーにとって意味のあるものでなければなりません。
Creative Cruiseは、アムステルダムを拠点としたイベントのプロモーションという明確な目的を持っています。ほとんどチラシのようなレイアウトでありながら、スクロールベースのインタラクションがとても楽しく、アムステルダムの運河を飛び回る代理店のコンセプトと結びついています。
2. 簡単なナビゲーション
明確なナビゲーションの重要性を強調することはできません。
明確なナビゲーション階層は、あなたのサイトの重要な骨格を提供します。他の領域では自由にクレイジーになっても構いませんが、古典的なナビゲーションパターンを使用することで、ナビゲーションはやや保守的なものにしておきましょう。
優れたナビゲーションは、目立たないように感じられ、あなたのコンテンツを本当に目立たせることができます。
メニューをどこに隠したかを探すのに時間を取られたくないのではなく、WebGLの素晴らしいインタラクションで遊んでもらいたいのです。もちろん、メニューや他のUIパターンを再発明することが理にかなっている例外はたくさんあります。ただ、数秒以内にわかりやすく把握できるようにしておかないと、訪問者の一部を失う危険性があります。
Google Ideas では、Hello Monday はシンプルでわかりやすく、親しみやすいナビゲーションを採用しました。
これにより、ユーザーは Google Ideas のさまざまなセクションを素早く見つけることができ、クールな WebGL 地球儀で遊ぶ時間を増やすことができます。
3. ホバー効果だけではない
私は素晴らしいホバーエフェクトが大好きです。
しかし、あなたのサイトが魅力的で記憶に残り、賞を受賞するには、クールなエフェクトだけでは不十分です。
エフェクトやトランジションは、単に見栄えが良いからというだけではなく、ウェブサイトの体験をサポートするように適用してください。スタイルが優れたUXの邪魔になってはいけません。
4. 少なくとも1つの分野でイノベーションを起こす
あなたのウェブサイトを際立たせるものは何かを考えてみましょう。
他のサイトと違っていることを、大なり小なり、少なくとも一つは思いつくようにしましょう。
いわばあなたのサイトのXファクターは何ですか？人々はあなたのサイトからどのような小さなことを覚えていますか？本当にクールなトランジション、ホバー効果、または手の込んだインタラクション。
それは、本当によく書かれたコンテンツやユニークな声のトーンであってもよいでしょう。
ポップソングのように、頭に残るフックがあるように、あなたのサイトを記憶に残るものにするためには、何か一つは持っていた方がいいでしょう。
ハッピー・フォーキャストは、コンソールゲームのような楽しいユーザーインターフェースを持っていて、それ自体がほとんど小さな宇宙のようです。楽しくて記憶に残る!
5. 読み込み時間に注意してください
スマートフォンや通知が常にポップアップする時代に、私たちは皆、金魚のような注意力を身につけました。読み込み時間は大迷惑であり、最小限に抑えるべきです。ロード時間を回避する方法がない場合は、サイトの一部をどうやってロードするかを考えて、体験がすでに始まっているかのように感じるようにしましょう。
6. レスポンシブ
携帯電話やタブレットを使っている訪問者の半分が、（全くないとしても）あなたのサイトを適切に体験できないとしたら、プロジェクトに数え切れないほどの時間を費やしても、あまり楽しくありません。
モバイルとタブレットを念頭に置き、デバイスをまたいだ体験をデザインしましょう。もちろん例外もありますが、理想的には、できるだけ多くのデバイスで同じように動作するようにしたいものです。
B&O Play by Spring/Summerは、モバイルでもデスクトップでも同じように動作します。
7. 凝った遷移を避ける
トランジションは素晴らしいもので、楽しくてエキサイティングなものですが、ホバー効果と同様に、目的を果たす必要があります。また、ブラウジングを続けるためにトランジションが終了するのを待たなければならないのは、これ以上に悪いことはありません。短く、繊細に保ち、関連性のある場所にのみ適用してください。
8. ターゲット層を意識したデザイン
優れたデジタル体験は、そのターゲットオーディエンスに合わせて調整されます。デザイン要素、色、タイポグラフィ、ビジュアルなどを選ぶ際には、ターゲット層を念頭に置いてください。若いお母さんのためにデザインされたウェブサイトは、必然的にビジネスエグゼクティブのためにデザインされたウェブサイトとは異なって見えます。
9. 即座に関与する
あなたのサイトは、YouTube、Facebook、メール、電話、Mediumの記事などと競合しています。基本的にはインターネット全体です。あなたのサイトに入った瞬間から、ユーザーの興味を引きつけましょう。
これは、下記のオールドスパイスマッスルサプライズの場合のようにインタラクティブなボディビルダーで行うことができますが、それはまた、単に目を引くビジュアル、興味深い文や美しいタイポグラフィである可能性があります。
10. 新しい技術を活用する
新しい技術を効果的に活用しているサイトほど刺激的なものはありません。一体どうやってそんなことをしているのだろう？
自分のプロジェクトに当てはまるのであれば、新しい技術を試してみるか、現在の技術をハックして新しいことができないかを考えてみましょう。
CRAZY SKILLSでは、パナソニックがFIFAのような素晴らしい体験をすべてブラウザ上で実現した。どうやって実現したのでしょうか？(おそらくWebGL)
11. ユーモアを忘れずに
笑いが嫌いな人はいませんか？
ブランドや作成している体験に当てはまる場合は、訪問者を楽しませ、気持ちよくさせるためにユーモアを使うことを検討してみましょう。人々を笑顔にすることは、最終的には必ず報われます。
Legworkは、彼らの代理店とあなたの気分の遊び心を強調するために、楽しくて風変わりなイラストを使用しています。
12. あえて安全とは思えない新しい道を行く
新しいアイデアを試してみましょう。新しいことをすることを恐れてはいけません。挑戦してみましょう。失敗することもあれば、失敗しないこともあります。新しい領域をチャーターする際には、どんなことがあっても、多くのことを学ぶことができます。自分の居心地のいい場所から飛び出せ 下の「Way of the Desperados」は、風変わりで奇妙な体験を提供していますが、それがうまく機能しています。
外に出て、素晴らしい仕事をしてください。
それは、新しいことに挑戦する勇気と自分の直感を信じることです。目指せ高みの見物 今までに見たことのないものを見せてくれ。あなたのコンフォートゾーンから抜け出してみましょう。
人の金で肉が食いたい