Word: Heuristic Evaluation
Definition: A method used to inspect and evaluate the usability of software in order to understand product effectiveness, identify interface design problems, and explore interactions and patterns.
Thoughts: Heuristics is typically conducted during the research phase of the user experience process. During this evaluation, a UX designer will examine all aspects of the product’s UI while taking considerable note of important user flows. These do not always have to be formal and can provide a great overview of current product best practices and flaws.
Now, like many UX methodologies, the way in which these evaluations are conducted can differ from one practitioner to the next. Some researchers (myself included) prefer to keep heuristics focused on single products at a time with very detailed analysis. Others like an overview approach where they evaluate many products and focuses on a few specific areas to investigate in depth that can be compared and contrasted.
Any way you slice it, this is a great tool to not only understand the product you are working to improve but to also provide helpful insights into competing products as well.
Question: What is your preferred heuristic practice? Why?
Word: Graphical User Interface (GUI)
Definition: GUIs refer to the interface between the user and the computer system that allows users to interact with an electronic device through graphical icons and visual indicators. Graphical user interfaces allow users to make choices through clicking buttons and graphics. It is sometimes referred to colloquially as a “gooey”.
Reference: GUIs are best known through their early implementation at Apple and Microsoft in which they replaced the arcane and difficult to use textual interfaces of early computing. The graphical user interface became the standard over time because it made computing much more intuitive, easier to learn, and extremely accessible.
Thoughts: The work of the UX designer ultimately effects the resulting product’s GUI. After computing made the shift to graphical user interfaces our field emerged from the trenches and it’s up to us to make this layer between the user and the computer seamless. UX design is the Emerald City; Pay no attention to the man behind the curtain.
Word: Gutenberg diagram
Definition: The path a human eye typically takes (in Western cultures) as it skims a page, beginning from the top left and finishing in the bottom right. This focal pattern tends to pay less attention to the other corners of the page, particularly the bottom left corner. This pattern is sometimes referred to as a “Z-pattern”.
Thoughts: By understanding the Gutenberg diagram you can design better user experiences through effective page layouts. The z-pattern path articulated here is best utilized for eye movement over heavy text, evenly distributed and homogeneous information, and pages with a large amount of white space.
It is important to understand how the human eye tracks information over various layouts in order to purposefully direct the user towards specified content.
Question: When would you consider the influences of the Gutenberg diagram “z-pattern” instead of thinking about an “f-pattern“?
Word: Inline validation
Definition: The inspection and validation of entered data, typically within a form field, before the user hits the call-to-action button.
Thoughts: When forms are validated in real-time, it allows users to complete them more quickly, with less effort, and with fewer errors. The combination of these three things results in greater overall user satisfaction.
We’ve all been there! That time when you fill out a long form only to his “submit” and realize you committed an error. But now you are back at the top of the page and must become Indiana Jones to find out where the egregious error is lurking. By the time you eventually find it and resubmit you have most likely committed another error. This time perhaps, the form removed your credit card information after the initial submit and you did not realize this when you went for the second go-around. An aggravated email to the help desk ensues.
Now you think to yourself, if only this form had inline validation and I knew exactly when and where I committed that error in the first place!
Note: I may be overly hostile about this at the current moment because of some personal trouble on the Delta Airlines website as of late… just saying.
Question: Why would a designer choose not to use inline validation within a form web?