web-dev-qa-db-ja.com

インフォグラフィックまたはインタラクティブで人々をガイドする良い例は何ですか?

現在、さまざまな企業クライアントが既存の印刷リソースをオンラインで利用できるように支援しています。これらのクライアントの多くは非常に保守的またはデジタル初心者であるため、多くの場合、PDFからhtmlに大量の情報をダンプします。ただし、一部のhtmlを作成するためにお金を費やす人もいます。ほとんどのクライアントは、深刻なウィズバンの予算がありません—非常にフラットなコンテンツを向上させ、たまたまオンラインになっているドキュメントのようにはなりません。

よりインタラクティブにしようとしている情報密度の高いサイトの中で私が気付いた傾向は、ユーザーにアイコンまたは画像のホットスポットをクリックして操作してもらい、それによって情報のナゲットを明らかにすることです。この例には、クリック可能なマップ、クリックして展開するアコーディオンメニュー、またはホットゾーンが展開された図/ビジュアルがあります。これらの処理は、フラットなテキストや画像よりも表面的に興味深いですが、ユーザーはいくつかのアイコンをクリックして何が起こるかを確認し、それがどのように機能するかを学び、退屈して他の場所に行くと、すぐに飽きてしまうようです。明らかにする情報ナゲットが数個あれば数回のクリックで問題ありませんが、私たちが構築しているインタラクティブの種類はかなり情報密度が高く、目的はユーザーにすべての側面について学ぶことです。ランダムにクリックされる1ビットまたは2ビット。 選択肢が多すぎると、何も選択するのが難しい (PDF)であることを知っているため、構築するものにはおそらく何らかの構造または説明が必要です。ただし、インタラクティブなエクスペリエンスがRailsのように感じられすぎると、基本的には インタラクティブなページターンドキュメント の美化されたバージョンになり、その投稿のトップアンサーに示されているすべての理由で悪い。構造が既に存在している場合でも、構造を課すことには問題はありませんが、クライアントのコンテンツに固有のナラティブがあまりない場合があり、それを作成するためのリソースが実際にはありません。

質問:コンテンツ自体が非常に「フラット」で不変で、ユーザーがすべての情報を読み取れるようにすること、およびユーザーが一種の放浪と放牧を行うことができるサイトの良い例を誰かが見た(または構築した)か彼らが軌道に乗っているようにあまり感じずにインタラクティブコンテンツで?ありがとう。

2013年2月22日10:00 UCT現在の回答を考慮して編集:

皆さんありがとう。明確にするために:これらの種類のプロジェクトでは、(i)印刷ドキュメントの構造に合わせてサイトを設計する必要があり、( ii)特定の情報を利用可能にするための法的要件があり、たとえそれがWebページとして最後に必要な情報であってもです。クライアントは、ドキュメントが(a)印刷版と同じくらい洗練されているが、Web向けであり、(b)サイトのコンテンツがほぼ事前に決められているという制約の範囲内で、可能な限りオンラインでやり取りするのを手伝ってほしいと願っています。

(ii)それが本当のキラーです—その必須のコンテンツの一部は、非常に長くて冗長です。ありがたいことに、通常はページ構造/コンテンツ、特にランディングページの優先順位付けに優れたUCDとIAの原則を使用する余裕があります。できる限り、クライアントからのユーザーインサイトデータを使用してこれを支援します。しかし、私が最初に行ったことはないと思いますが、クライアントだけでなくビジネスにとっても、「印刷物をオンラインにする」ことはどれほど重要なのかを強調しておきます。私たちは、以前のデジタルの関与について提唱するためにできることを行っていますが、これには時間がかかります。

5
finiteattention

2つのオプションは Prezi (グレープ、ズームナビゲーション)および Metablob (テキスト、グラフィック付き、ナビゲーションの展開/折りたたみ)です。 Metablobは現在アルファ版であり、プライベートベータ版も間もなく登場する予定です。

2つのうち、私はMetablobが完全な探求を奨励することと、まるで「Rails」であるかのように感じないこととのバランスをとっていると思います。 Preziは、具体的に定義されたパスを使用してストーリーを作成し、自由に探索できます。 Metablobには明確に定義されたパスはありませんが、その中核はストーリーです。ストーリーは、読者がどこまで掘り下げることができるかを明確に示しているので、読者にとっては、いくつかの完了の動機が働いています。

例:

6
Mike Rice

その外観からは、問題を説明する2つの主要なステップがありません。最初に行う必要があるのは、Site ObjectiveおよびUser Needs。あなたの(冗長な)説明から、現時点ではそれは存在しません。

私のアドバイスは、少し前に戻って戦略を考え直し、解決しようとしている問題とその問題について、関係者と話し合うことです。私たちは先月、古いシステムから新しいシステムに移行するお客様と非常に話し合いました。その過程で、現在のコンテンツはサイトの対象となるユーザーグループのいずれにも対応していないことがわかりました。科学者や開業医にとっては軽量すぎ、初心者にとっては重すぎ、カジュアルユーザーにとっては退屈すぎるなどです。私たちがいくつかの価値を見つけた唯一のものは、よく隠された必須の「キャリア」セクションでした。 ブーム!

このプロジェクトは予想外の変化を遂げたと言いますが、最終的に顧客とユーザーの両方にとって重要なことをすることができて嬉しいです。あなたの場合も同じようにする必要があると思います。

まず、サイトの目的とユーザーのニーズを把握します。

enter image description here

Jesse James Garretによる画像

4
Benny Skogberg

リアクティブドキュメントは比較的簡単に作成でき、数字やグラフ指向のドキュメントにインタラクティブ機能を追加できます。 WorryDream には、この良い例があります。そのページ内のコンテンツのチャンクの多くはインタラクティブです。

1
Brian