コンテンツ
- 「本物の」コンテンツとは
- では、コンテンツファーストのデザインとは何ですか？
- コンテンツは「エッジケース」、つまり現実の世界を強調しています
- 実際のコンテンツから始めることで、最初からユーザーの立場に立つことができます
- 実際のコンテンツを操作するのに役立つ3つのツール
- Webflow CMS
- Sketch用のCraftDataプラグイン
- ランダムユーザージェネレーターAPI
ユーザーエクスペリエンスのメリットについて詳しく説明する前に、用語を少し明確にしましょう。
まず、人々がこの概念を「本物で設計する」と議論するのをよく耳にしますが データ、」私は使用することを好みます コンテンツ、デザイナーが作業するものをより適切にキャプチャするため。結局のところ、通常、画像を「データ」と呼ぶことはありませんね。それが役立つ場合は、コンテンツを「コンテキスト内のデータ」と考えることができます。
「本物の」コンテンツとは
デザインの進化のどこかで、誰かがあなたが実際にはそうではないという考えを思いついた 必要 デザインを作成するための実際のテキスト。 「本物の」ものが準備できるまで、任意のラテン語を投入することができます。したがって、 lorem ipsum そして、その多くの、多かれ少なかれヒップスターの分派。
しかし最近、人々はそれがどれほど完全に怒っているかを理解し始めています。承知しました、 いくつか コンテンツの形式は、古いデザインにドロップして「良い」と呼ぶことができます。
しかし、通常はそうではありません。 「標準的な」ブログでさえ、多くの場合、リスト、インタビュー、ケーススタディ、ウォークスルーなど、さまざまな種類のコンテンツを取り上げています。 もちろん コンテンツタイプの固有の特性を強調するように設計された独自のプレゼンテーションの恩恵を受けます。
実際のコンテンツでデザインを入力してください。 これはコンテンツファーストデザインの派生物であり、デザイナーにコンテンツから始めるだけでなく、 リアル 乱雑で現実の世界の実在の人々が実際に作成して共有するコンテンツ。
「実際の」コンテンツは次のもので構成されていることに注意してください。
- 普通の人からの実際の写真とステータスの更新
- フリーランスサイト向けのクライアント制作コンテンツ
- プロのコピーライターが制作した洗練されたコピー
では、コンテンツファーストのデザインとは何ですか？
コンテンツファーストデザインは、ウェブサイトのコンテンツの作成、または既存のコンテンツのレビューと分析を優先します。 前 デザインが始まります。
これは、設計プロセスが開始されると、コンテンツをアジャイルな方法で繰り返して洗練することができないという意味ではありません。 （実際、コピーとデザインが同じ声で話していることを確認することは絶対に必要です。）それは、作業を開始する前に、作業内容を知っていることを意味します。
条件が整ったら、実際のコンテンツを使用して設計することのメリットを見てみましょう。
コンテンツは「エッジケース」、つまり現実の世界を強調しています
デザイナーは理想的なコンテンツが大好きです。そして、あなたは彼らを非難することはできません。コンテンツを美化することは、彼らがしていることのほんの一部です。しかし、現実の世界では、かなりのコンテンツを作成する人はほとんどいません。
代わりに、彼らは最新の新しいWebサイトに参加し、プロフィールフィールドの半分に入力し、2枚の写真をアップロードして、それを1日と呼びます。または、「本当に長い見出し」を書いて、低解像度の写真をブログにアップロードします。
それが現実です。
あなたがそれを理解するとき、あなたはしません 停止 次の機能を備えた「理想的な」ユーザープロファイルの設計時。
- 短い、アングロサクソンの名前と姓
- 定期的に提供される何百もの美しい写真
- テキストコンテンツの短い一節
- すべてのコンテンツタイプをカバーする活気に満ちたさまざまな「アップデート」
あなたは確かにそれらの1つをします。
しかし、他のモックは現実の世界を際立たせます。に満ちた世界：
- 長い名前
- 複数の言語でリストする必要がある名前
- 左から右ではなく、右から左に実行される名前
- まばらで、照明が不十分で、不自然にトリミングされた写真
- ヘッドショットの代わりに愚かなアバター
- 空のプレビューを生成する、コメントのない、実際には単なるリンクである「共有」
これらは「エッジケース」ではありません。それらは、現実の、乱雑で、無秩序な世界からのスナップショットです。それをよく理解すればするほど、ユーザーとそのための設計方法をよく理解できます。
上記の例で誤解を招かないように、実際のコンテンツを使用してデザインすることのメリットは、ソーシャルネットワークだけにとどまりません。それらは、あなたではない人々によって生成されたコンテンツを使用するすべてのWebサイトに適用されます。つまり、それらすべて。
結局のところ、すべての見出しが正確に3語の長さのブログをモックアップすることを想像してみてください。あなたも トーク ブログ編集者に、仲間？
実際のコンテンツから始めることで、最初からユーザーの立場に立つことができます
ほとんどのウェブサイトの訪問者は、ゴージャスなデザイン、「楽しい」インタラクション、または素早いコピーを求めて来ません。
彼らは物事を成し遂げるために必要な情報を求めてやって来ます。
デザインにコンテンツファーストのアプローチを取り、さらに一歩進んで使用する リアル コンテンツ、あなたは両方を理解する試みを優先します：
- あなたが一緒に働かなければならないもの
- エンドユーザーが探しているもの
これにより、最終的なデザインの適切な場所で適切な情報が強調表示されるようになります。
ある意味で、コンテンツの制作や分析を優先するとき 前 デザインでは、ユーザーが行うのと同じ道をたどります。つまり、必要なものを探して情報の海を歩き回ります。そのプロセスを順を追って説明することで、何が利用可能か、顧客が何を望んでいるか、コンテンツを整理してあなた（またはクライアント）が提供するものをよりよく理解できるようにする方法をよりよく理解できます。
実際のコンテンツを操作するのに役立つ3つのツール
もちろん、実際のコンテンツを任意のデザインツールに取り込んで、Webや製品のデザインをより忠実に再現することができます。ただし、実際のコンテンツを操作するときに非常に優れたツールがいくつかあります。
Webflow CMS
2015年後半にリリースされたWebflowのビジュアルCMSは、コンテンツファーストのワークフローで美しく機能します。 13の基本的な構成要素（画像から他のコレクションへの参照へのリンクまで）からコレクションを作成して完全にカスタム構造を作成し、コンテンツを入力してから、そのコンテンツで作業を開始して完璧なデザインを構築するだけです。サンプルの「ダミー」データをプルして、設計プロセスを開始することもできます。
Sketch用のCraftDataプラグイン
InVision LABSのこの無料のSketchおよびPhotoshopプラグインを使用すると、独自のファイル、既存のWebサイト、またはJSONファイルから実際のコンテンツを取得して、デザインに直接プラグインできます。
ランダムユーザージェネレーターAPI
コードスリンガーまたはPhotoshopperの場合、Random User Generatorを使用すると、JSON、SQL、CSV、またはYAMLオブジェクトを生成して、デザインに直接配置できます。
