Annotated Wireframe

[00:00:00]
>> This is an example of an annotated wireframe. I don't know if you guys have used these per se, but this is where you're specifically calling out purpose of each content component. And the hierarchy is laid out on the wireframe itself. Okay, so these are examples. This is a lot of work.

[00:00:21]
I do not recommend doing this for every single page of your site. I do strongly recommend doing this for key pages. So the homepage, all the landing pages, any other high traffic page, page that is going to lead people directly to conversion, or to get them as a lead.

[00:00:42]
All right, those are all key pages that we do wanna create either page tables or these annotated wireframes for. I really would like to encourage the designers in the room to get away from lorem ipsum, as much as possible. It's really easy to design for character counts and font sizes.

[00:01:01]
It's much more difficult to design for content substance. But that's where you're going to get quality design, that where the form follows the function. Okay, this is not to suggest that you're never going to need copy to support design requirements, because sometimes that just happens like, but what the typical thing that I see a lot of times is that every page will require a subhead, and then a sub, subhead.

[00:01:29]
And you end up just being redundant, and it's a design element that ends up just getting in people's way, for example. So where if you had designed with real content to begin with, you would have saying no, they're being redundant.