Is there a standard way to indicate a suggestive search (autocomplete) in a wireframe form?

Question

I'm designing an interface, and I'm currently creating a wireframe to guide me before developing it. I know that a particular form will make suggestions, but if I were to, say, get another developer on board, I'd have to make sure that they know.

So the question:

I know I don't need to do anything but type somewhere within the frame, "this should suggest [something]," but with modern interface design paradigms in mind, I can't help but wonder if there is a standard way to indicate something like this within a wireframe for front-end developers.

Is there?

Answer 1

Assuming you're using a wireframing format where you can hide dropdown elements to see what's behind them, it's fairly common to show the autocomplete form with a few letters typed and a few rows appearing below it.

Some examples from pattern libraries are:

_{from the Yahoo Design Pattern Library}

_{from CollectionSpace.org}

_{from Welie.com's Patterns in Interaction Design}

If you don't have multiple layers in your wireframe, just writing "This autocompletes" in a textbox should be fine.

Answer 2

I usually just annotate the wireframe with a note:

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

But this does raise a bigger question: How to annotate interactive elements in static wireframes? An autocomplete field is fairly self explanatory, but things can quickly become complex when we start adding scrolling, animations, sorting, drag and drop, hovers, active states, etc.

One solution is to have or reference a pattern library, where said library would have visuals, working examples, and maybe even sample presentation layer code for your developers to base their work off of.

Then, in the wireframes, you can reference the pattern library as needed.