web-dev-qa-db-ja.com

ワイヤーフレームを論理的に設計する方法は?

ページのワイヤーフレームを作成する際にどのような理由があるのか​​知りたいのですが。

ページのさまざまなコンポーネントを特定した後、私は通常、プライマリ/セカンダリコンテンツと主要なタスク(ユーザーストーリー、競合他社のレビューに基づいて...)を特定します。次に、メインと見なされるコンテンツを強調表示するか、ページの上部に配置します。

あなたの観点から、ワイヤーフレーミングの背後にある論理は何ですか?

6
Leo
  1. 低コストのワイヤーフレームにより、UXデザイナーはモックアップを高速に作成し、悪いアイデアを破棄できます
  2. ページの要素がどのように相互作用するかを表示する
  3. 機能、階層、コンテンツ、その他のグラフィック以外の要素を伝達します。
  4. グラフィック作業を開始する前に、ウェブサイト/アプリの構造について人々に同意してもらう
  5. 色、タイプ、コピーに気を取られることなく、ユーザーテストとクライアントプレゼンテーション
  6. ユーザーインタラクションを示す
  7. ナビゲーション要素
3
Igor-G
  • ドメインの発見
  • 既存製品の評価
  • あなたのニッチを見つける
  • ワイヤーフレーム
  • ...

ワイヤーフレーム段階は、製品ドメインと製品のセールスポイント/一意性を確定した後に行われます。次に、デザインをツールとして使用して、独自性が既存のものよりも優れていることを伝える作業を行います。ワイヤーフレームは、大まかな設計をすばやくスケッチして、組織/ナビゲーションがどのように見え、どのように感じられるかを視覚的に確認するために使用されます。

ワイヤーフレームはプロトタイピングの迅速かつ簡単な手段です。ワイヤーフレームを作成する際の主な目標は次のとおりです。

  • 感触:それはどのように見えるでしょうか?
  • 実装:どのように機能しますか?
  • 役割:体験はどのようなものでしょうか?

ワイヤーフレームでの配置について。ターゲットユーザーが誰なのか、製品の目的は何なのかよくわかっているので、engagement hooksを見つけるのに適した位置にいる必要があります。フックは、ユーザーの注意を引く上部近くのアクションボタンの呼び出し、または同じことを行うビデオ/画像です。フックの要点は、ユーザーが適切に説明されていればそれを使用するのに十分な製品があることを期待して、ユーザーを製品に少し掘り下げることです。

他の事柄については、同様のアプローチに従い、正式/非公式のユーザーテスト/クライアントテストを行って、どのプレースメントが好きかを確認する必要があります。それらに与えるレイアウトのさまざまなオプション、3つの異なるアイデアは常に良いです。複数のデザインを採用する利点は、ほとんどの場合、3つのすべての優れた点を組み合わせたハイブリッドになることです。

0
rk.