When you look at a web page, the various elements of the page can often be seen coalescing into distinguishable regions and groups. Intentionally structured, or otherwise, these groups that constitute the page Layout play an important role in the web product’s Desirability.
Quick-UX provides for the rapid, simple and quantifiable assessment of a product’s User Experience (UX). In answering the question of Desirability, "Should I use it?" the sub-category of Layout is one of frequent discussion, especially in the latest wave of online products and how they handle content presentation and interaction.
The relationships of and between various page elements, how they play off of one another, constructively guiding a process, or organizationally segmenting a concept, can influence how accepted, by the user, the product is, and how Desirable, how much they (the users) will actually want to use it, will be (or is).
Through a well planned Layout, beyond basic Usability, a web product can portray itself as a welcoming and pleasing — Desirable — place to be.
Picture your typical website search page. Perhaps there is a region that is used for filtering search results. This region will most likely be aligned to be visually related to the search results, the content upon which they will directly influence. Yet another region may be established to save frequently performed searches. Depending on the type of web product, the importance of saving a search, and the sought after tone for the page, various groupings and alignments between the region for saving and the region for initiating searches will exist. How the various elements relate to one another, and how they guide users’ behaviors around the page (and product) can quickly degenerate into a ‘painful’ experience, if not carefully considered. Depending on the target audience, type of purpose for the web product overall, the Layout may either constructively, or destructively, impact the overall Desirability of the web product.
The construction of a web page immediately conveys concepts of hierarchy, flow, and grouping. These concepts combine, revealing the relationships and intents of the web product, either positively or negatively contributing to the Layout, creating an inviting or off-putting environment, one of four components that constitute a product’s Desirability (the others being: Aesthetics, Color Scheme, and Typography).
The Layout variable’s rubric is:
The value of the Layout variable is the sum of the decisions…
…regarding the product’s visual hierarchy…
If the most important content of the page
Stands out clearly (the user’s eyes are instantly drawn to these elements), add 0.4, or
Takes at least a few seconds to become apparent, add 0.2, or
Takes more than a few seconds to become apparent, add zero.
…regarding the interface’s visual flow…
If the overall visual flow provides a non-negative impact on the page hierarchy,
then add 0.3,
otherwise do not add anything.
If the visual flow has a negative impact on required / recommended sequential steps,
then subtract 0.15.
…regarding the grouping and alignment of the page / product elements…
If the interfaces of the product present UI elements that appear to be scattered, placed without association or relevance to neighboring or distant elements that possess similar or different functionality, then no additional value is added to the Layout variable.
Otherwise, if most page elements appear to form logical, related groups or clusters, where perhaps not all of the clusters are neighboring or some of the clusters have redundant logic and functionality, then add 0.15 to the Layout variable.
However, if the relationships between like and dissimilar elements and groups are clearly presented, with no apparent inconsistencies, then the Layout variable is, instead, incremented by 0.3.
Over the next several weeks I will be providing real-world examples of Layout values…
Clear Visual Hierarchy (value +0.4)
Fair Visual Hierarchy (value +0.2)
Poor Visual Hierarchy (value +0)
Non-negative Visual Flow (value +0.3)
Negative Visual Flow (value +0)
Poor Sequential Flow (value -0.15)
Inconsistent Grouping (value +0.15)
Subscribe now (click here) to make sure you don’t miss any part of this series exploring the Desirability and Layout of Quick-UX, the quick and easy method of generating quantifiable and comparable metrics representing the understanding of the overall User Experience of a product, as well as other insightful posts from The Product Guy.
Enjoy!
Jeremy Horn
The Product Guy
| Add to Social Bookmarks: |  |
 |
 |
 |
 |
 |
 |
The Product Guy 