Why It's Important to Annotate Your Wireframes | UX Movement
Have you ever delivered your wireframes to a client only to have them quickly tell you what things they dislike and want you to change? The problem here is that biases occur when people judge something before they understand it. One cannot objectively judge a design unless they thoroughly understand it. It is likely your client is not well versed in the principles and practices of user experience design. This is why it is your responsibility to communicate your rationale for your design decisions on your wireframes.
Annotating your wireframe elements with clear and concise explanations is important and necessary, so that clients can understand your design before they judge it. If you leave them off, your clients have the power to assert their biased judgement on your design, which can create a breeding ground for subjectivity. To prevent this from happening, it’s important to annotate your wireframes and offer reasons and benefits about why your design is effective. This will give them insight to your thinking process and allow them to think about the things that you think about when you design. Below is an example and four best practices on how to annotate your wireframes.
1. Keep them short and to the point
This is where your writing skills come in handy. Giant blocks of text aren’t attractive to read. Keep your explanations short and to the point. You may have a lot of annotations, which is why keeping them short will make for a faster and easier read. Any further elaboration could be followed up with a meeting if needed. However, clients are usually scarce on time, so I wouldn’t count on it. Get everything you want to say on your wireframe, but keep it concise.
2. Focus on user benefits
Every design decision you make should benefit the user. Thus, your annotations should focus on explaining how each design element helps the client’s users. Focus on the benefits because that’s what clients care about.
3. Use numerical markers and order them
Enumerate your annotations and order them from left-to-right going down the page. This makes it easier to read and will prevent clients from having to jump around the page to read each annotation.
4. Keep them in a column on the right
Keep your annotations on the right next to the wireframe, so that clients won’t have to look too far to read them. It follows the natural left-to-right progression people use when they’re reading.
Annotating your wireframes is an extra step in the process, but it is well worth it. If you truly believe in your design you will go through great lengths to help your clients understand it. It’s hard for clients to look at a wireframe and notice every grain of detail you have put into it. Annotations allow your clients to look at your design without passing judgement. As a designer, your job is to think objectively. Sometimes in order for a project to succeed you will have to help the people you work with think objectively as well.
Don't use notes just for feedback use them for guidance! Anthony explains in this article why it's important to put notes next to your wireframes.