The Product Guy’s Great in ’08

Christmas-Bell The Product Guy had a great 2008, sharing and exploring products, their experiences, and many innovative startups and the founders behind them, while getting to meet and speak with many of The Product Guy’s steadily growing readership.

And, as 2008 comes to a close, let’s take a brief look at the top 5 posts of 2008 (by popularity) on The Product Guy, starting with…

modular innovation#5 Modular Innovation 101

Modular Innovations lead to users’ information that is Portable, Shareable, Interoperable, Customizable, Redundant, Accessible and, basically, their own. Here The Product Guy explored the various flavors and concepts behind Modular Innovation.

Trends and other primordial indicators of the emergence of Modular Innovation can be found in many products that are out there, or in development, today on the Internet. This year demonstrated a clear evolution of existing online products, and an emergence of many others, implementing and embracing, to a ever increasing degree, Modular Innovation.

 

01_amazon#4 Overgrown Amazon

As part of the series exploring the quantification of product User Experience via Quick-UX, the Aesthetics of Amazon.com were explored.

Every single feature does NOT have to be crammed into the interface. A smart minimalist design will provide just enough of the core functionality up front, and allow for the gradual introduction of deeper features and extras as the user interacts with the product. Amazon.com is a great example of poor Aesthetics.

 

Configuration#3 Quick-UX. Quick Heuristics for User eXperience.

In 2008, I introduced the world to a process I use when quickly evaluating products. In subsequent posts in 2008 (and more to come in 2009) The Product Guy continued to provide examples and elaborate upon the underlying concepts and variables that make up Quick-UX.

The Product Guy’s introduction to performing quick, quantitative assessments of product/user experience.

 

pbwiki#2 Best Free Online Wiki Announced!

With so many wiki choices available, how do you choose? The Product Guy explored and ranked the free, hosted wikis available to both the individual and company.

And, just as PBwiki was about to achieve their own personal user base milestone, they too were recognized as the best, free online wiki.

 

00_yahoo_homepage#1 Yahoo News. #1 Online News Site.

Yahoo News represented the first news web product whose experience was studied in a 4 part series on the pros, cons, and suggested improvements (some of which have been implemented) of the top websites’ User Experiences.

Based on popularity, Yahoo News, at the end of 2007, was #1. And in 2008, this article delving into Yahoo’s News experience was the #1 most popular article at The Product Guy.

 

Happy New Year!

Jeremy Horn
The Product Guy

Add to Social Bookmarks: Stumbleupon Del.ico.us Furl Reddit Magnolia Google Add to Mixx!
About these ads

Overgrown Amazon

desirabilityQuick-UX provides for the rapid, simple and quantifiable assessment of a product’s User Experience (UX). In answering the question of Desirability, “Do I want to use it?” the sub-category of Aesthetics is one of frequent discussion, especially in the latest wave of online products and how they handle content presentation and interaction.

Today, in the same spirit of Quick-UX, let’s take a quick look at an Internet product with an Aesthetic value of 0.

Example: Overload (value = 0)

01_amazon

Amazon implemented a good deal of my advice regarding their User Experience, but still suffers from information overload, and an Aesthetic variable value of 0. The tangled experience has too many gaudy interactions, from spinning to intrusive drop-downs, as well as other elements that (sometimes) popup, seemingly out of nowhere. Amazon needs to focus on the minimal, clean implementation of the site content with experience augmenting mouse-user interactions enhancing Desirability. Transitions and other content presentation and interactions should be enjoyable additions, not the troublesome hindrances that most are today.

Dropdowns can be experienced sometimes unexpectedly popping open when traversing from one region of the page, increasing the noise / interruption and detracting from any strands of simplicity that may exist.

02_amazon_popup

Instead of being able to simply interact with and browse content, somewhat randomly, a spinning element will be presented to the user containing a grouping of products. This results in a more complex, non-minimalistic presentation of the content, the products – providing an excessively animated, gaudy user interface device.

03_amazon_spinning

Over the course of this series I am providing real-world examples of Aesthetics values…

Clean, Sharp, Pleasing, and Enjoyable (value 2)

Incomplete (value 1)

Overload (value 0)

Subscribe now (click here) to make sure you don’t miss any part of this series exploring the Desirability and Aesthetics 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: Stumbleupon Del.ico.us Furl Reddit Magnolia Google Add to Mixx!

Ripening FreshDirect

desirabilityQuick-UX provides for the rapid, simple and quantifiable assessment of a product’s User Experience (UX). In answering the question of Desirability, “Do I want to use it?” the sub-category of Aesthetics is one of frequent discussion, especially in that latest wave of online products and how they handle content presentation and interaction.

Today, in the same spirit of Quick-UX, let’s take a quick look at an Internet product with an Aesthetic value of 1.

Example: Incomplete (value = 1)

01_freshdirect

FreshDirect, enjoying an Aesthetic variable value of 1, is faced with a difficult challenge of presenting a great deal of information in a simple and enjoyable way. The product does very well in providing for a clean, minimalistic, and enjoyable experience, but would benefit from greater interaction with the mouse (and user), as well as transitions to improve the overall Desirability of the product.

There are many sections of the website that would benefit from more-obvious, more-visual mouse-overs – the menu bar and initial navigation section being two of them.

02_freshdirect_menubar

03_freshdirect_initialnav

Over the course of this series I am providing real-world examples of Aesthetics values…

Clean, Sharp, Pleasing, and Enjoyable (value 2)

Incomplete (value 1)

Overload (value 0)

Subscribe now (click here) to make sure you don’t miss any part of this series exploring the Desirability and Aesthetics 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: Stumbleupon Del.ico.us Furl Reddit Magnolia Google Add to Mixx!

Shining Chrome

desirabilityQuick-UX provides for the rapid, simple and quantifiable assessment of a product’s User Experience (UX). In answering the question of Desirability, “Do I want to use it?” the sub-category of Aesthetics is one of frequent discussion, especially in the latest wave of online products and how they handle content presentation and interaction.

Today, in the same spirit of Quick-UX, let’s take a quick look at an Internet product with an Aesthetic value of 2.

Example: Clean, Sharp, Pleasing and Enjoyable (value = 2)

01_chrome

A good example of the Aesthetic variable value of 2 can be seen in the newly released Chrome browser, from Google. Chrome provides a very minimalistic experience, incrementally revealing more information, on-demand and non-intrusively, right when the user needs it. Chrome also makes sound use of transitions to draw the user’s attention to new events and actions further increasing the pleasingly simplified experience of the product.

As the user types into the single textbox, the browser infers what information and actions the user will most likely want to take – presenting the decisions and options at an appropriate time.

02_chrome_incremental

Opening a new tab, the user is confronted with a simple transition, bringing subtle, non-disruptive, attention to the unique tab region as well as the location of the newly created tab.

03_chrome_animation

Even the “status bar” only appears when there is something to display (e.g. mousing-over a link).

04_chrome_status

Over the course of this series I am providing real-world examples of Aesthetics values…

Clean, Sharp, Pleasing, and Enjoyable (value 2)

Incomplete (value 1)

Overload (value 0)

Subscribe now (click here) to make sure you don’t miss any part of this series exploring the Desirability and Aesthetics 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: Stumbleupon Del.ico.us Furl Reddit Magnolia Google Add to Mixx!

On the Aesthetics of Quick-UX

desirabilityEvery single feature does NOT have to be crammed into the interface. A smart minimalist design will provide just enough of the core functionality up front, and allow for the gradual introduction of deeper features and extras as the user interacts with the product.

Quick-UX provides for the rapid, simple and quantifiable assessment of a product’s User Experience (UX). In answering the question of Desirability, “Do I want to use it?” the sub-category of Aesthetics is one of frequent discussion, especially in the latest wave of online products and how they handle content presentation and interaction.

The ways by which the product responds to the user’s mouse and chosen actions can positively add to the aesthetic, or, if unnecessary or excessively implemented, they can then contribute to the unwelcomed sense of gaudiness. For example, if, to view a larger version of a displayed picture, the user clicks a button, a brief transition is utilized to provide for a clear communication of button-click result, the animation will be appreciated. On the other hand, contrary to the minimalist goals, would be upon clicking the button, the page (the user interface) goes into a series of strange and drawn out animations, with clearly unnecessary special effects and flourishes, or other prompts requesting exactly how much bigger the user wanted the picture before it is ever displayed.

The Aesthetic variable’s rubric is:

The value assigned to the Aesthetics variable in determining Desirability within Quick-UX is…

  • 2 if the product presents a clean, sharp, pleasing and enjoyable product environment where interaction is a pleasure. In addition, the product consistently makes good use of mouse-overs and animated transitions.
  • 1 if the product presents generally “OK” Aesthetics. The product may have some mouse-over states and other beneficial transitions, but these states and transitions are found to be incomplete and would benefit from a more comprehensive and consistent implementation.
  • 0 if the product suffers from information and graphical (transitions, interactions, etc.) overload. In this case, the content and graphical aspects of the site continually get in the way of getting the desired task completed quickly, efficiently, and enjoyably.

Over the next few weeks I will be providing real-world examples of Aesthetics values…

Clean, Sharp, Pleasing, and Enjoyable (value 2)

Incomplete (value 1)

Overload (value 0)

Subscribe now (click here) to make sure you don’t miss any part of this series exploring the Desirability and Aesthetics 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: Stumbleupon Del.ico.us Furl Reddit Magnolia Google Add to Mixx!

Do I want to use it? Evaluating Desirability through Quick-UX.

desirability Desirability is a very real component of a product’s User eXperience. The feelings that a product invokes in an individual are often difficult for that individual to elaborate upon, beyond such feelings like those of a sense of pleasantness, happiness, awkwardness, or one of frustration.

While quantifying Desirability can, in many cases, prove to be quite challenging, those emotions that relate to the Desirability of a product can be quantified via Quick-UX as one of its three core categories (the other two core categories being Usability and Usefulness).

The minimal representative subset of variables for Desirability that adhere to the primary goals of Quick-UX (quick assessment for summary, direction guidance, and quantitative comparison) are…

  • Aesthetics (and minimal design),
  • Layout (including the visual hierarchy, flow and grouping of elements of the product)
  • Color Scheme (and Contrast), and
  • Typography.

Aesthetics

Information overload negatively impacts, hence the word ‘overload,’ the actual Desirability of a product. Any more, or supplemental, information and functionality than is needed contributes to the erosion of a pleasing and enjoyable experience.

Content, mouse-interactions, and transitional animations should be kept short and to the point. Do not explain a feature with a paragraph of information where a brief 3 word phrase would do, nor use a 3 word phrase when a clearly identifiable button can, itself, clearly convey the underlying message or functionality.

I have found that the product’s Aesthetics contribute most significantly to its overall Desirability. For this reason, unlike the other variables that make up Quick-UX, the Aesthetics variable can be assigned a value from 0 through 2 (as opposed to the typical maximum value of 1).

The value assigned to the Aesthetics variable in determining Desirability within Quick-UX is…

  • 2 if the product presents a clean, sharp, pleasing and enjoyable product environment where interaction is a pleasure. In addition, the product consistently makes good use of mouse-overs and animated transitions.
  • 1 if the product presents generally “OK” Aesthetics. The product may have some mouse-over states and other beneficial transitions, but these states and transitions are found to be incomplete and would benefit from a more comprehensive and consistent implementation.
  • 0 if the product suffers from information and graphical (transitions, interactions, etc.) overload. In this case, the content and graphical aspects of the site continually get in the way of getting the desired task completed quickly, efficiently, and enjoyably.

Layout

The Layout of a page is about more than just Usability. The Layout of a page, the visual hierarchy, its flow, as well as grouping and alignment of its elements, is the environment within which the user works and interacts with the product — it sets the tone and, in turn, shapes the product’s Desirability.

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, don’t add anything.

…regarding the interface’s visual flow…

The visual flow can be described as the interface/page forces that guide the users’ eyes about the page. If a page has a negative visual flow, then it contributes to guiding the eyes away from the critical sections that need to be looked at and used to take primary actions and make decisions.

If the overall visual flow provides a non-negative impact on the page hierarchy,

then add 0.3,
otherwise do not add anything.

Furthermore, if the interfaces of the product require / recommend a specific sequence of steps be taken to accomplish a task, and the visual flow has a negative impact, guiding the user in the non-desired order, then subtract 0.15 from the Layout variable.

…regarding the grouping and alignment of the page / product elements…

A good product has clearly defined ‘regions’ within its interface. For example, a search engine may have one region for entering the search parameters, and another region for viewing the search results.

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.

Color Scheme / Contrast

The Color Scheme of a product sets the mood and appeal. Color schemes can be simple, with only one or two colors, to very complex, with many complementary and varying levels of contrasting colors.

For example, red’s, yellow’s and orange’s are warm colors and, as a Color Scheme, could, very appropriately, be paired with products that wish to intuitively convey concepts or themes of warming or heating, like FeedBurner (as a theme derived from the name) or portable space heaters (products that keep you warm in the cold of winter).

The Color Scheme variable is assigned the value of…

  • 1 if approximately one to three primary hues are present within the product and those selected hues accurately reflect the message and theme of the product (some examples: warm colors = energy, cool colors = respectable, etc.).
  • 0.5 if the color palette is cluttered, there are some extraneous color selections or a mismatch of color temperature, Contrast, or saturation with respect to the messaging and tone. For example, an air conditioning website would probably want to stay away from the warm colors (red, yellow, orange), even if aesthetically pleasing.
  • 0 if the Contrast and color selections that comprise the product’s Color Scheme make some or all of the product’s information and/or functionality difficult or impossible to read or understand.

Typography

Some people do not fully appreciate the degree of impact that Typography can have on a product’s overall User eXperience, and especially its Desirability. Different fonts, different font sizes, and how they are arranged and laid out to interact with one another and other product elements, do more than present readable, or unreadable, content, but frame many of the emotional aspects of the product.

Typography decisions control the ranges of voice from loud and shouting to gentle and whispering, from serious to comical. When products are presented with too many fonts, they increase the likelihood of conveying the information with too many, and inconsistent, voices; as opposed to a pleasing, guiding conversation about the product.

  • If the Typography from page to page, interface to interface, functionality type to functionality type, is clean, readable, and consistent in usage then the Typography variable is assigned a value of 1.
  • Otherwise, if minor to major inconsistencies are apparent, or an overloading of Typography ‘voices’ are present, but all remain readable, the Typography variable becomes 0.5.
  • However, if the inconsistencies are tremendous, and make understanding the content difficult or bewildering, or even if only some of the content is unreadable, the Typography variable equals 0.

So… Do I want to use it?

While this question within the Quick-UX framework provides for the rapid assessment of Desirability, it represents only one of the three ‘questions’ that, when combined with…

Can I use it? (Usability)

Should I use it? (Usefulness)

…provide for an easy, consistent, and expeditious means by which to determine a product’s overall User eXperience.

Enjoy!

Jeremy Horn
The Product Guy

Quick-UX. Quick Heuristics for User eXperience.

heuristic Introducing… Quick-UX

There are many procedures, rubrics, methods, analyses and theories with respect to assessing the overall User eXperience of a product. Most User eXperience assessment approaches require a heavy investment of time, analysis and effort.

Often, a quick assessment of User eXperience is more aptly called for. A quick assessment allows for rapid compilation of simple heuristics that can be very handy in providing…

  • a summarized view of a product’s overall User eXperience,
  • directional guidance for a product’s future development, and/or
  • metrics for comparison with other products.

More detailed and extensive heuristics (many with hundreds of variables to evaluate) exist that delve into the finer details that lead to more directly actionable steps, but they are neither cheap in time nor money.

Quick-UX is a method that I have developed and refined over time and frequently utilize when quick assessments are best suited to the task. The method that I describe below is a great way to build a summary description with quantifiable and comparable metrics, representing the understanding of the overall User eXperience of a product.

The Quick-UX evaluates the degree to which a product successfully addresses the following 3 questions:

The elements evaluated in response to each question constitute a minimal representative subset that accurately addresses the question posed while adhering to the goals of Quick-UX.

Evaluating Usability

Whether or not something can actually be used is critical to a product. Quickly evaluating the ease with which the typical consumer can use a product consists of looking at the following variables:

  • Accessibility,
  • Consistency,
  • Recognition (also including Intuitiveness),
  • Navigation (also including site-flow, transitions, and interactions), and
  • Page Load Time.

Each variable here, as well as those making up the other 2 evaluation categories (‘questions’), possess specific rubrics to generate repeatable and quantifiable values (each normalized to be of the range from 0 through 1 or 2) that can consistency be understood and compared to like evaluations. For the Quick-UX, each category can, through the summing-up of each of its values, achieve a maximum category score of 5 (minimum being 0).

Evaluating Usefulness

What good is a product if it isn’t useful? Does the product solve a new problem, or an existing problem? Does it do so in an innovative and creative way? The quick evaluation of Usefulness is constituted by an assessment of these variables:

  • Functional Expectations (expectations are created via marketing, content, branding, etc.; put another way, ‘were the functional expectations of the product, from the perspective of the consumer, achieved?’),
  • Errors (including handling, recovery, and prevention),
  • Product Differentiation (including memorability),
  • Findability (i.e. search engine friendliness), and
  • Credibility.

Evaluating Desirability

The Desirability of the product, its appearance and the feelings it can stir in the user through the methods of presentation, can often be a good proxy for the organic word-of-mouth campaigns and buzz that spring up around it. Desirability taps into the emotions of the product’s users through:

  • Aesthetics (and Minimal Design),
  • Page Layout,
  • Color Scheme (including Contrast), and
  • Typography.

Desirability consists of only 4 variables. Aesthetics, unlike all of the other variables in the Quick-UX, is normalized to a range from 0 through 2, due to its greater impact on the overall desirability of a given product.

Try it. Use it. Tune it.

All of the values, when summed up (max. value of 15), form the UX (User eXperience) Rating for the evaluated product. The higher the rating, the better the product’s overall User eXperience. My favorite use for this evaluation is to quickly compare the User eXperience of multiple products with one another.

As the Internet and online products evolve I update and adapt my approach to quick evaluations. Let me know how the Quick-UX works for you. Tweak it, adjust it to suit your particular goals. Please share your findings.

What sort of quick User eXperience evaluation methods do you use?

More Information

You can read more about alternate User eXperience evaluation heuristics and theories at these websites…

  • Ten Usability Heuristics (link)
  • Stanford Guidelines for Web Credibility (link)
  • The User Experience Wheel (link)
  • Metrics for Heuristics: Quantifying User Experience (part 1 part 2)
  • User Experience Design (link)
  • User Experience Strategy (link)
  • How To Quantify the User Experience (link)
  • Designing Interfaces (link)

Enjoy & Post experiences with Quick-UX and other methodologies.

Jeremy Horn
The Product Guy