web-dev-qa-db-ja.com

ワイヤーフレームがUX / UI設計とフロントエンド開発でどのように機能するか

このワイヤーフレーム/スケッチを作成して、UIデザイナーに命を吹き込みましたが、ワイヤーフレームとグリッドシステムについていくつか質問があります。

リンク: http://postimg.org/image/npt5zlvu7

1)上記のワイヤーフレーム/スケッチでUIデザイナーにアプローチできますか?

2)UI設計(フィールアンドルック)の間、流体グリッドシステムに注意を払う必要がありますか、それとも開発中にのみ関連がありますか?

3)私のUIデザイナーがフロントエンド開発者でもあるか、必ずしもそうでない場合、より一貫性がありますか?

4)ワイヤーフレーム-> UI設計->フロントエンド開発の間に私が持つべき懸念は何ですか?

4
Paul Martin
  1. リンクされたワイヤーフレームでUIデザイナーにアプローチできなかった理由は何もありません。しかし、私はあなたのアイデアを提示するときに製品コンセプトが何であるかについてのいくつかのアイデアを含めます。断片的なインタラクション(pinterestのようなヘッダー、リビジョン3のようなレイアウトなど)がたくさんあるようですが、製品の目標を達成するために、そのピースがユーザーに役立っていることを確認する必要があります。

  2. レスポンシブサイトを設計している場合は、ブラウザウィンドウを拡大すると、サイトとインタラクションがどのように変化するかに注意を払う必要があります。サポートしようとしているプラ​​ットフォームを把握します。あなたがデザインしたこのインターフェースは、見栄えがよく、iPhoneで使用できるようになりますか?タブレットはどうですか?ターゲットプラットフォームを念頭に置いて設計すると、レイアウトがどのように変化し、これらの変化がどのブレークポイントで発生するかがわかります。

  3. どちらにしてもいいと思います。フロントエンドの開発にも非常に優れているUIデザイナーを見つけることができれば、それで問題はありません。ただし、設計と開発の両方に1つのリソースを使用しているため、さらに時間がかかります。デザイナと開発者のペアリングはもう少し一般的ですが、デザインとその実装方法の間の問題をやり取りして対処することは、優れた製品を開発するための必須です。設計、開発、テスト、繰り返し。

  4. それらは、製品の作成プロセスにおける多数の懸念事項であり、ここにリストするには多すぎます。いくつかの注意点:

ワイヤーフレームから地獄をスケッチします。可能であれば、ユーザーをテストして、ユーザーがインターフェースを理解しているかどうか、レイアウト、メニュー、さまざまなセクションが明確で、UIデザインに進む前にユーザーが操作できるかどうかを確認します。ワイヤフレームに磨きをかけることに多くの時間を費やすと、最初から間違っていたのであれば、時間を無駄にしているだけです。最初からうまく設計されていない場合、見栄えがよくても問題が発生する可能性があります。

設計者は、設計プロセス全体を通して開発者と協力して、設計が技術的に実現可能であることを確認する必要があります。

開発者がその仕事に適したテクノロジーを使用していることを確認してください。

インターフェースをプロトタイプ化して、それらを配線する前に、希望どおりに機能することを確認します。インターフェイスとインタラクションをすばやくプロトタイプ化してテストすることで、完全な製品を開発して、デザインとインタラクションに問題があり、最初からやり直す必要があることを確認するよりも時間がかかりません。

その一部がお役に立てば幸いです。

6
Sullivan