Crafting a successfu l (inline) Information Experience: Understanding how users read online Crafting a successfu l (inline) Information Experience: Understanding how users read online Linda Newman Lior © These slides may not be used or reproduced without the written consent of Linda Lior
About me… Studied Instructional Design and Computers in Education Experience: ◦ User interface text, online help, usability, user experience research ◦ Hardware and handheld devices (Cellebrite), SaaS (Answers.com), enterprise products (Microsoft), educational software, etc., Publication: Crafting the Information Experience for Software and Web Apps
The session will cover the following: Introduction Understanding user reading patterns ◦ How is the data gathered and what does it tell us? ◦ Relationship between user reading patterns and effective interactive text Rules and tips for creating a successful IX Questions and Answers
Why this topic? Most of what users read is online…
Online content is... Non-linear Part of a workflow Designed for interaction ◦ Turn on a feature ◦ Define preferences ◦ Create objects Proactive or reactive
How do users read online?
The research methods Eye tracking ◦ Heat maps ◦ Gaze plots Mouse and Keystroke Tracking ◦ Movement heat maps ◦ Click frequency maps ◦ Link click frequency analytics
What Eye Tracking Data Shows Examples will be shown in this section
What Mouse and Touch Analytics Show Hover patterns Interaction areas Click frequency Scrolling patterns Link activity Examples will be shown in this section
Examples…
What does the research tell us?
How users scan Users start reading at the top left corner of the page Users move horizontally, through the page in an "F" formation Users rarely focus on the bottom right corner of the page
How users read Users look for key words or phrases that will help them complete the task at hand After reading the first or second line of text, users begin scanning Users skip over the content if they are not caught by the first few words in the paragraph Users are more likely to read small chunks of text (or bullets) than blocks of text. Users stop reading when they are ready to make a selection
How do we apply the research for creating an effective information experience?
Examples…
What we should do… Create a visual hierarchy (from the top left) Design content using an “F” formation Guide users through workflows Keep important information above the fold Craft information that’s easy to read, scan and understand…
How we do it… ◦ Integrate content into the UX ◦ Maintain visual proximity ◦ Chunk information into small bites ◦ Use alignment and spacing ◦ Use key words and terms ◦ Use examples ◦ Provide a clear starting point ◦ Write concisely and accurately (half the word count (or less) than conventional writing
Examples…
What to avoid… Extraneous information Over-explaining Large or long blocks of text Breaking up content that belongs together Using dev-jargon Lack of structure Distracting elements
Examples…
A successful information experience Guides the user through workflows Provides the right amount of information Makes the user feel confident Is consistent throughout the application Combines design, writing, and usability principles Is a collaborative adventure
Questions & Answers