web-dev-qa-db-ja.com

モバイルアプリのワイヤーフレームvs.モックアップvsルック&フィール?

私はいくつかのモバイルアプリの開発を開始しており、wireframeまたはlook&feelを提案するか、またはモックアップ。どちらが違うのか気にならないという印象を与えたのですが….

モバイル開発環境でのこれらの各単語とその違いの説明に感謝します

2
AppsDev

Wireframeは、コンテンツ、インタラクション、UIフローなどの確立に役立つはずの、インターフェースの忠実度の低いスケッチです。インタラクションデザイナーまたはUXデザイナーは、通常、これらの設計を変更しています。これらは、アプリ開発の重要な部分であり、初期段階のテストでデザインとコンテンツのアイデアについて話し合います。

ルックアンドフィール私の意見ではより忠実度が高いです。通常は、アプリや機能の全体的な感覚を紹介することになっているインタラクティブなプロトタイプ。それらには、意図されたアニメーション、最終的なビジュアルデザイン、および待機画面などを含める必要があります。

モックアップは少し曖昧で、おそらくいくつかの方法で説明できます。たとえば、自転車用の新しいハンドルバーや、新しい電話用の電話モックアップなど、物理的なモックアップを作成できます。それらは最終結果に非常に近く、議論に移す前に製品の最終変更を見つける可能性を与えます。

これらの用語の定義はおそらくさらに議論される可能性があり、他の誰かがまったく異なる定義を持っている可能性があります。

0
AndroidHustle

ワイヤーフレームは機能性に関するものです。これは、デザインでどのようなことができるかを示す非常に単純なスケッチになる場合があります。たとえば、ウェブサイトのワイヤーフレームには、ナビゲーション、メインボタン、列、さまざまな要素の配置が表示されます。あなたはそれをウェブサイトの青写真と考えることができます。

モックアップは、製品の外観(この場合はWebサイト)の現実的な表現です。最終的な結果は、モックアップとまったく同じように見えるか、バージョンの改訂後のバリエーションになります。グラフィックソフトウェアを使用してモックアップを描画することを好む人もいれば、HTML/CSSで直接描画する人もいます。

これらはあなたがその答えを見つけることができるいくつかのリンクです:

https://graphicdesign.stackexchange.com/questions/30860/what-is-the-difference-between-wireframes-and-mockups

https://brainhub.eu/blog/2016/04/20/difference-between-wireframe-mockup-prototype/

https://graphiccloud.net

あなたがあなたの答えを見つけたことを願っています

1
user96158

彼らはあなたが共に働いている人々が彼らが意味すると思うものは何でも意味します。

明確にするために、それらは明確に定義されておらず、非常に異なるものを説明するためにしばしば使用されます。

wireframeは、少なくとも、製品の機能を理解するのに役立ちます。しかし、ワイヤーフレームがどのように実行されるかは非常に異なります。範囲は次のとおりです。

  • いくつかのボックスが描かれたナプキン

に...

  • 完全にインタラクティブでクリック可能な視覚的に詳細なプロトタイプ。

これはprototypeという用語につながります。これは、多くの場合、ビルドする対象のある種の「デモ」バージョンを指します。しかし、前の用語のように、それはまた、幅広い用途を持っています。一部の人々は、ワイヤーフレームと同じ意味でこの用語を使用しています。他の人は、実際にコード化されたソフトウェアを参照するためにそれを使用するかもしれません。

Look&Feelは範囲が少し狭くなっています。これは通常、アプリが視覚的にどのように見えるか、および対話が実際にユーザーに視覚的(および/または音声)フィードバックを提供する方法を示すことを指します。

ワイヤーフレームには多くの場合、ルックアンドフィールが適用されていません。しかし、彼らもしばしばそうします。プロトタイプについても同様です。また、ルックアンドフィールを示す場合と示さない場合があります。

結論として、重要なのは、あなたと成果物を作成している人がこれらの用語の意味について合意することです。

0
DA01