web-dev-qa-db-ja.com

同じワイヤーフレームがさまざまなビジュアルデザインに使用できることをどのように示すことができますか?

1つのワイヤーフレームまたはテンプレートを複数のブランドエクスペリエンスで使用できることを誰かに示すつもりです(UXは似ているが、ブランドエクスペリエンスは異なる必要があります)。過去のある時点で、「1つのワイヤーフレーム、2つまたは3つのデザイン」の複数の例を示す記事またはブログ投稿を見つけましたが、それ以上は見つかりません。誰でもリソースを知っていますか-これを実証する実際のウェブサイトまたは記事/ブログ投稿/ポートフォリオのいずれか?

6
Deanna

i-patterns.com または patternry のようなパターンリポジトリを探してみてください

別の解決策は、 wireframeshowcase などに基づいて、完成した製品がワイヤフレームでどのように異なるかを示すことです。

個人的には、UIをパターンで定義すること、つまり、ユーザーが直面している問題とそれに対応するソリューションを定義し、単一のモックアップを提供するのではなく、それに多くの例を提供して、開発者はそれらをニーズに合わせて調整できます。私のそのようなUXドキュメントの1つは、オープンソースのメールアーカイバ(GMailのようなものですが、セキュリティ監査を実行できるようにメールを削除できないことが確認されています)ですが、ハンガリー語ではありますが こちら ご希望の場合。しかし、開発者はクリーンで完成した、処理されたアイデアを必要とする場合があります。つまり、基本的には「入力」するだけの本格的なデザインが必要です。

UXはパターンに関するものであり、パターンは問題と解決策に関するものです。必要がある(たとえば、すべてが正常になった場合にどのボタンを押すかをユーザーに理解してほしい)と、それに対応する解決策があります(単一の「プライマリアクション」ボタンを強調表示します)。 、 以上です。

これらのパターンは、ワイヤーフレームが単なる実例であるアプリケーションになるために一緒に組み立てられる必要があります。おそらく、「実際の」設計が始まる前に、この組み合わせが一緒に機能するかどうかのテストです。どのフォントの選択と色の選択はそれほど重要ではなく、対話/ナビゲーションのみに集中したいと考えています。

ウィジェットやフルページのワイヤーフレームではなくパターンに集中すると、システムのファミリー全体で同様のエクスペリエンスを維持しながら、さまざまな方法で組み立てることができます。

反対に、業界では実際の設計代替チェックは見られませんが、おそらくごく一部しか見たことがないでしょう。私がウェブデザインをしているとき、最低限4つの選択肢を顧客に示しましたが、デザイナーが1つのモックアップを思いついて、それを少し投げてから、1つのビジュアルを思いつくことを何度も見ましたモックアップに基づいてデザインし、それを投げて、時には根本的に異なるものにして、それだけです。

1つの例外はAppleで、プロトタイプを使って互いに競争する設計チームがあることが知られています。

4
Aadaam

UXは似ているが、ブランドエクスペリエンスは異なる」というのは不可能です。 UXやブランドエクスペリエンスという用語に慣れていないようです。ユーザーエクスペリエンスデザインは、ユーザーに伝達されるすべての知的感覚の設計と管理で構成され、ビジュアルデザインはこの全体の一部にすぎません。 UXは、ブランドエクスペリエンスと同じです。

しかし、いくつかの仮想要素を Aadaam で言及されているように再利用することについては、私が思うに、デザインパターンを使用する必要があります。

0

異なるブランド間でまったく同じ方法で使用されるワイヤーフレームを探しているなら、それ以上探す必要はありません。ベータ段階のStackExchangeサイトのいずれかを使用してください。 GraphicDesign または、SEサイトのワイヤーフレームを自分で作成し、CSSのみを変更して、まったく異なるブランド間で同じHTMLを使用する数十の段階的なサイトを表示します。このページのフッターには、約40あります。本当に良い例は思いつきません。リストページと質問ページの両方に最適です。

0