Website Review of GMBHnews

by on 08/05/10 at 4:11 pm

A UX review was requested by GMBHnews.com and I have decided to critique the site for them and share it with everyone.  I will check the site based on 4 criteria that I believe make up good user experience design.

  1. Clarity – The message of what the site is and what it does should be clear and understood to the user.
  2. Simplicity – The design should display the essentials without trivial elements that complicate and dilute the user interface.
  3. Beauty – The design should be interesting and pleasing to the user’s senses.
  4. Utility – The application should be useful and offer the user with genuine benefits.

Clarity

Lets start by evaluating the CLARITY of the site.  By looking at the URL address and the tagline for this mobile website, I can tell that the purpose of this site is to bring you news of some sort, however, as I scroll down I see a collection of different blogs surrounding a variety of topics.  When I think news I think headlines and stories first.  It seems that this site is intending on introducing news, but instead they are more prominently introducing and promoting different blog sites as opposed to the news content itself.  Each blog topic you click on takes you to a collection of blogs on that topic, and to get the stories (the real news content) you have to visit each blog individually. Thus, the real news stories remained buried deep, and it’s not clear to the user exactly where the real news content is and how to actually get to it.

What makes it really hard for users to find content that they want is that there are several blogs that cover a single topic, and to actually get to the news content the user has to click on each blog individually.  What this means is that the user has to scan the names of each blog, as opposed to scanning a collection of descriptive headlines.  It’s easier to find the content you want when you scan headlines because the headlines are descriptive and they tell you what the story will be about before you even click on it.  This way you won’t make the mistake of clicking on something you didn’t want and have to go back and forth and back and forth from screen to screen.  Scanning personal blog names doesn’t tell users anything about the real content because the names are generic, non-descriptive and irrelevant to real content.  The design limits the user’s experience to only a few blogs’ content, instead of all the content relevant to the topic of interest.

Solution

The solution I am proposing to improve the clarity of the site is to bring the news content front and center instead of leaving it behind the scenes.  On the first screen you can let the user select the news topic of their interest, but when they make their choice let them immediately view the news content that they’re looking for.  The blog source is irrelevant and serves as a barrier from bringing people to the interesting stories they want.  People just want to find good and interesting content in an easy way.  What blog it comes from is after the fact.

Simplicity

Scrolling down I feel overwhelmed because there at least 50 topics for me to choose from.  Based on Hick’s Law which I wrote about in this article, when there are too many choices presented, it takes longer for the user to make a selection if they are even going to make a choice at all.  Not only that, but the overwhelming stress it causes discourages them from engaging the site at all.

There are at least 50 topics on the site, all of which can be joined in some way or form.  What users need is a basic categorization of topics, such as HEALTH, BUSINESS, SPORTS, TECHNOLOGY and etc.  It needs to be broad and simple, so that users can navigate to the content they want.  The way it is now makes it hard for users to differentiate the quality of one topic versus another because they are too detailed and complicated.

The amount of topics and categories on the site is absolutely excessive.  If you try to be everything to everybody, you will only fail to be nothing to nobody. What I mean by this is that when you are providing value to others you need to be known for something, that way people can go to you for that particular type of value that you give.  If people can’t nail down what your specialty is and what makes you different from all the others then they’ll end up going somewhere else for their needs.  It’s really important to know what you value, but even more important to know what you DON’T value, so that way you can have an identity for yourself and stick to it.  This makes it easier for you to target your users and for your users to target you.

Solution

I think the solution to improve the simplicity of the site is to condense the amount of topics to a few essential ones and label them in a way that is basic, broad and simple, so that users can better find content of their interest.  Such a solution will require the culmination and elimination of several topics, but will result in making the content you do feature that much stronger and meaningful.

Beauty

Upon initially viewing the site I expected to find a logo and the title of the site at the top, but that was, for some reason, nowhere to be found.  There is an icon next to the tagline, but it’s unclear to me if that is the logo or not because it looks more like an icon.  Instead of placing the name of the site on the top bar, the top bar says “iPhone RSS, windows mobile reader”, but as a user that has no significance or meaning to me whatsoever.  In order for a user to come back to the site, they’re going to have to remember the NAME of the site, and there is no emphasis on that here.  An attractive logo can also make the site more memorable, but that isn’t here either.

At the top bar, the link to “Add a Feed” collides with the title of the site, which not only makes it difficult to read, but almost invisible. What you can do instead is use the plus icon that symbolizes the adding of something. That way it’s more visible, beautiful and saves you more space in the top bar.  In addition to that,  when you go into a topic there are two back links at the top bar that take the user back to their earlier screen. One back button is really all you need. It should also be a button, not a link, that way its visible to users and they can click on it easier. It’s very important that it’s a button because back buttons relied on heavily, especially on mobile devices. Another thing you can do to the top bar to make it more beautiful is to cut down the size and length of the titles. When the entire title fits on the bar, it makes it look more clean and beautiful, as opposed to the ellipses displaying because of the title length.

One thing that really struck me is the amount of buttons on the user interface. Buttons are mostly used to stress an important call-to-action. In this case, they used as links to content, which results in a galore of buttons and gradients everywhere. This really isn’t necessary, as one content topic is not more important than the other, but rather they are all equal. To fix this, just use simple horizontal lines to separate the links, and let the links shine and speak for itself.

The use of icons are a nice touch, but when you use the same icon for every link it defeats its purpose for being there. If you’re going to use icons make sure to use different icons for the different categories of content. This will make it more descriptive and personable to users.

On the stories screen, there is a down arrow icon next to each headline. This affordance is the wrong icon to use in this situation. The down arrow is often used for downloads or down-voting. A better affordance would be to use the arrow that points to the right that you use on the blog topic screens.  This way you keep your affordances consistent with the functionality, and you make it less confusing on the user. Each headline doesn’t need the separation by each panel because they are all related should all be grouped in one panel with horizontal lines separating each of them. This is a standard UI convention on mobile applications.

Solution

Following the basic design conventions I have outlined above will make this site more beautiful. Beauty in design often means making content shine in a simple non-intrusive way.

Utility

I do think this application is very useful to people. It’s aggregates news content across different blog sites, which makes it easy for people to find content of their interest. As long as the site focuses on a few essential topics and makes the stories easy to reach I think the application will continue to be useful for people. It certainly has a lot of potential, and I hope this review will help improve its overall user experience and bring its potential to life.

Interface Libraries

Interface Papers

Interface Styles

2 Responses to “Website Review of GMBHnews”

  1. Charly

    Aug 8th, 2010

    Thanks for the great review and the feedback Anthony, I’ll come back to it with a bit more details to explain why some features work as they work and implement some of the suggestions.

  2. Adam Kochanowicz

    Sep 10th, 2010

    I was surprised you didn’t point out how they used the button gradients incorrectly. The buttons appear to be set in, as if someone had pressed and stuck them all. Of course I agree with you in that gradiented correctly or not, they probably shoudn’t be buttons in the first place.

Leave a Reply