ワイヤーフレーム形式で示唆的な検索（オートコンプリート）を示す標準的な方法はありますか？

Question

私はインターフェイスを設計しています。現在、開発する前にガイドするワイヤーフレームを作成しています。特定のフォームが提案を行うことは知っていますが、たとえば、別の開発者を参加させる場合は、それらが確実にわかるようにする必要があります。

質問：

「これは[something]を示唆するはずです」というフレーム内のどこかに入力するだけで、何もする必要がないことはわかっていますが、最新のインターフェース設計パラダイムを使用しています心に留めておきたいのですが、フロントエンドの開発者向けに、ワイヤーフレーム内でこのようなことを示す標準的な方法があるかどうか疑問に思います。

ある？

Answer 1

ドロップダウン要素を非表示にして背後に何があるかを確認できるワイヤーフレーム形式を使用していると仮定すると、オートコンプリートフォームにいくつかの文字を入力し、その下にいくつかの行を表示するのが一般的です。

パターンライブラリの例をいくつか示します。

_{yahoo Design Pattern Libraryから}

_{collectionSpace.orgから}

_{インタラクションデザインにおけるWelie.comのパターンから}

ワイヤーフレームに複数のレイヤーがない場合は、テキストボックスに「このオートコンプリート」と書くだけで問題ありません。

Answer 2

私は通常、ワイヤーフレームに注釈を付けるだけです。

                         ------------------------
                        |                        |
 Search:               /    Search field uses    |
 [ enter search term ] \      autocomplete       |
                        |                        |
                         ------------------------

しかし、これはより大きな疑問を生みます：静的ワイヤーフレームでインタラクティブな要素に注釈を付ける方法は？オートコンプリートフィールドは自明ですが、スクロール、アニメーション、並べ替え、ドラッグアンドドロップ、ホバー、アクティブ状態などを追加し始めると、状況はすぐに複雑になります。

1つの解決策は、パターンライブラリを使用または参照することです。このライブラリには、ビジュアル、実際の例、さらには開発者が作業の基礎となるサンプルプレゼンテーションレイヤーコードさえ含まれます。

次に、ワイヤーフレームで、必要に応じてパターンライブラリを参照できます。