User Experience atau UX Topik 9 Wireframes

Wireframes :

• Diagram yang memrepresent framework of a website or apllication.
• Merupakan langkah antara information architecture and finished product.
• Digunakan utk identify the elements that will be displayed on the page/screen, such as : navigation, content section, imagery/media, form element and calls to action  (CTAs)
• Typically : created in black and white or shades of gray.

Wireframes can show the audience that the audience that the project is still a work in progress and not the final, production-ready site.

Wireframe design tools :

• Asure Rp Pro
• Microsoft Visio
• HTML and CSS
• Keynote Kung-fu

Annotations are explanations and notes about an element/an interaction on a wireframe. Typically contain such information as : 

• error content / messaging
• display rules
• content identification / labeling
• content source (s)
• interaction rules.

Annotations to wireframes.

Here are some annotations to consider for your wireframes :

• User goals for the screen
• Business goals for the screen
• copy direction
• image direction
• other media direction, such as : video, sound clips or panoramas.

Basic elements :  Note

Every X-O page identified is most likely a top-level, / primary, page. You can use this as a jumping off point for defining a portion of the business requirements and for a wireframe.