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!

Confusing Domain of GoDaddy

desirabilityQuick-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 between and among 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.

Today, we will look at an example of an Internet product with Poor Visual Hierarchy, representing a Layout value of +0.0.

Example: Poor Visual Hierarchy (value = +0.0)

GoDaddy is a website whose primary purpose is to enable people to purchase and setup domain names. Despite a major redesign that this web product has recently undergone, it remains an excellent example of a product Layout with Poor Visual Hierarchy. This assessment is easily accomplished through the evaluation of the homepage, whose Layout and design characteristics are echoed throughout the website.

00_godaddy_homepage

To start off, identifying the most important element of this page cannot be accomplished through any visual cues of Layout. As a matter of fact, the Layout and structure of the page presents to a great deal of redundant information…

01_godaddy_redundant_domain

…and…

02_godaddy_redundant_accoun

And numerous hot-points on the page, all competing for the initial attention of the visitor’s eyeballs upon arrival, most obviously indicated by the use of the strong oranges and reds on the page.

03_godaddy_hotpoints

Is the most important information on this page,

My Products,

04_godaddy_myproducts

or Logging in,

05_godaddy_logging_in

or Email offers,

06_godaddy_email_offers

or Buying $1.99 domains,

07_godaddy_199_domains

or Starting a domain name search,

08_godaddy_domain_search

09_godaddy_domain_search

or Buying web hosting,

10_godaddy_web_hosting

or Expressing myself through .me domains,

11_godaddy_me_domains

or Getting a .tv domain

12_godaddy_tv_domains

Furthermore, GoDaddy logo and tagline, ‘The Web is Your Domain,’ are dwarfed with respect to the other competing priorities of this page.

13_godaddy_logo

Even if one can conclude the various competing elements on this page are all equally important and can be concluded as the top of the page’s Visual Hierarchy, their redundancy of purpose and message, as well as no clear relationships between most neighboring elements of the page, and no clear secondary elements (unless one attempts to claim everything else would be secondary) further erodes any potential inherent Visual Hierarchy.

Adding to the destruction of the page’s Visual Hierarchy is the clutter of buttons, general content, and marketing on the page. The use of white space and relational placement appear to have no purpose in indicating the importance, or relative importance, of the plethora of options on the page, beyond the lower tier importance attributed to those elements placed in the footer.

The primary usage of whitespace is limited to offsetting the messaging / actions for…

Product Advisor

Express Yourself

Web Hosting

.TV Domains

14_godaddy_more_marketing_s

…all of these options offering a small subset of basic and secondary (or tertiary) services, especially in contrast to many of the other more basic options that can be found on this page for the searching and registering of domain names, in general.

GoDaddy’s homepage, as well as the rest of the web product, provide such a diffused Layout and structured experience as to make identifying either the important or even merely sought after actions an unnecessarily time consuming effort, all contributing to the distinction of being a solid, educational example of a web product with Poor Visual Hierarchy.

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)

 

Clean Grouping (value +0.3)

Inconsistent Grouping (value +0.15)

Poor Grouping (value +0)

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­­

The Product Guy’s Weekend Reading (December 26, 2008)

reading_w_TPG_thumb5_thumb2_thumb2_t[2] Every week I read tens of thousands of blog posts. Here, for your weekend enjoyment, are some highlights from my recent reading, for you.

On Starting Up…
http://www.davecheong.com/2008/12/22/bootstrapping-mobiusly/
Mobiusly, one bootstrapper’s journey.

On Design & Product Experience…
http://www.moma.org/exhibitions/2008/elasticmind/#
A fun-to-interact-with look at the evolution of design, including many very neat-o website projects.

On Modular Innovation…
http://storagemojo.com/2008/12/22/cloud-storage-is-a-component/
Understanding clouds as key components in Modular Innovation.

Have a great weekend!

Jeremy Horn
The Product Guy

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

JohnMees from High to Low

desirabilityQuick-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 between and among 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.

Today, we will look at an example of an Internet product with Clear Visual Hierarchy, representing a Layout value of +0.4.

Example: Clear Visual Hierarchy (value = +0.4)

JohnMees.com provides a very good, simple example of a Clear Visual Hierarchy.

00_john_mees_homepage

The most important section within the page hierarchy is the middle section of the page clearly indicated through its prominent centralized placement, large font headers, elegantly large and simple iconography, and high-contrast text on non-complex backgrounds. This section is valuable in its efforts of branding and immediately conveying the purpose of the site and the content to expect within.

01_john_mees_key_messaging

The obvious next level in the page hierarchy is the title region of the page, the individual’s name, John Mees. While having large, bold text, it is visually stressed to a lesser degree through the placement of a lower contrasting, patterned background behind the producer’s name.

02_john_mees_title

Finally, in the Visual Hierarchy of the page is the footer region, with decreased text and hierarchically organized from right, Contact John, to left, John’s details, from highest contrast section header to lowest contrasting.

03_john_mees_footer

The Clear Visual Hierarchy of JohnMees.com is immediately obvious to everyone who visits, organized into basic layers, presenting a very pleasing and Desirable experience, both in graphic design, and in the coincident advancement of the marketing from most important to least important.

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)

 

Clean Grouping (value +0.3)

Inconsistent Grouping (value +0.15)

Poor Grouping (value +0)

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: Stumbleupon Del.ico.us Furl Reddit Magnolia Google Add to Mixx!

The Product Guy’s Weekend Reading (December 19, 2008)

reading_w_TPG_thumb5_thumb2_thumb2_t[2] Every week I read tens of thousands of blog posts. Here, for your weekend enjoyment, are some highlights from my recent reading, for you.

On Starting Up…
http://www.paulgraham.com/divergence.html
One person’s look at the potential future of Venture Capital.

On Design & Product Experience…
http://www.thedesigncubicle.com/2008/12/why-exactly-designers-hate-comic-sans/
On the hatred of a font: Comic Sans.

On Modular Innovation…
http://www.bloggingstocks.com/2008/12/16/microsofts-newest-windows-live-services-its-best-yet/
Lessons of Modular Innovation from Microsoft.

Have a great weekend!

Jeremy Horn
The Product Guy

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

The Product Guy’s Weekend Reading (December 12, 2008)

reading_w_TPG_thumb5_thumb2_thumb2_t[2] Every week I read tens of thousands of blog posts. Here, for your weekend enjoyment, are some highlights from my recent reading, for you.

On Starting Up…
http://opengardensblog.futuretext.com/archives/2008/12/why_trutap_was.html
Lessons from the wreckage of Trutap.

On Design & Product Experience…
http://nettuts.com/articles/10-principles-of-the-user-interface-masters/
Great and simple tips from many well known and respected user interface gurus.

On Modular Innovation…
http://highscalability.com/scalability-perspectives-3-marc-andreessen-internet-platforms
Platforms of Modular Innovation and a look at some ‘flavors.’

Have a great weekend!

Jeremy Horn
The Product Guy

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

On the Layout of Quick-UX

desirabilityWhen 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)


Clean Grouping (value +0.3)

Inconsistent Grouping (value +0.15)

Poor Grouping (value +0)


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: Stumbleupon Del.ico.us Furl Reddit Magnolia Google Add to Mixx!

The Product Guy’s Weekend Reading (December 5, 2008)

reading_w_TPG_thumb5_thumb2_thumb2_t[2] Every week I read tens of thousands of blog posts. Here, for your weekend enjoyment, are some highlights from my recent reading, for you.

On Starting Up…
http://www.readwriteweb.com/archives/secrecy_or_transparency_one_st.php
A startup’s path, choosing between product secrecy or transparency.

On Design & Product Experience…
http://www.alistapart.com/articles/flexiblefueleducatingtheclientonia
On explaining (to the layman) the value of Information Architecture.

On Modular Innovation…
http://www.readwriteweb.com/archives/distributed_social_networking.php
A look at some of the challenges facing social networks as they move towards greater Modular Innovation.

Have a great weekend!

Jeremy Horn
The Product Guy

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

Southwestern Discomfort

user-useitQuick-UX provides for the rapid, simple and quantifiable assessment of a product’s User Experience (UX). In answering the question of Usability, "Can I use it?" the sub-category of Consistency often does not get the attention it deserves, in turn leading to more confusing, more frustrating, less Usable products.

Evaluation of Consistency covers the assessment of recurrent expectations as they are impacted and shaped by the product’s content (or wording), interfaces, and layout. Expectations that result from the type of web product and its market (inter-product, rather than intra-product) have greater impact on the Recognition variable.

Today, we will look at an example of an Internet product with Significant Inconsistencies, representing a Consistency value of 0.

Example: Southwest Airlines

00_southwest_homepage

Southwest Airlines’ (Southwest) web product presents an experience that starts with a Significant Inconsistency on a major element and concept…

…booking a flight / travel.

The Consistency variable is considered to be valued 0, Significant Inconsistencies, if the web product has inconsistencies on a majority of minor elements or any inconsistencies on major elements, e.g. an inconsistency on an informational website’s primary navigation.

Both options, ‘Book Travel’ and ‘Book A Flight,’ lead the user to initiating a search for travel choices. Both options are labeled very differently. And interactions with either result in different methods of configuring the desired search. Both means of initiating the search path, primary elements on a travel website, are surrounded by entirely inconsistent product experiences.

Clicking on ‘Book Travel’ results in…

01_southwest_book_flight

…a very compact form, familiar in structure to many of travel websites. With elements such as ‘From’ and ‘To,’ as well as ‘Depart’ and ‘Return.’

Clicking on ‘Book a Flight’ results in…

02_southwest_book_travel

… a significantly more complex interface than is presented by ‘Book Travel.’ You can accomplish the same tasks (in a much more complicated manner) here as you could have done on ‘Quick Travel,’ but with no logical, consistent connections between the two options. Furthermore, when looking at this form, it appears completed unrelated, almost as if originating from a completely different website, to the ‘Book a Flight’ form – both geared to getting you to purchase airline tickets for use on Southwest Airlines.

Over the next several weeks I will be providing real-world examples of Consistency values…

No Apparent Inconsistencies (value 1)

Minor Inconsistencies (value 0.5)

Significant Inconsistencies (value 0)

Subscribe now (click here) to make sure you don’t miss any part of this series exploring the Usability and Consistency 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!