"Lifecycle of Webpage", is set out in a very clear order making it easy to understand. All the information given on the page is relevant with the main message of how superior Stumbleupon is compared to other social network websites. There is a good mix of information presented in various ways keeping it interesting and engaging. It has a clear focus most of the time but sometimes there are a few too many comparisons to other websites making it slightly confusing or overwhelming. A few comparisons would have been sufficient enough and would have made the message more obvious straight away. However, the images don't give you all the information that is needed, so to fully understand what is being communicated you have to read the text as well.
Every fact on the infographic was new to me as I had only briefly heard of the existence of Stumbleupon. I found them interesting but surprising as I had previously assumed that facebook would be the most widely used social network when it is in fact Stumbleupon. The various graphs on the design make learning the facts very easy as the information is clear without the need to read the text.
We agreed that the most likely target user would be someone who was trying to promote a business of some sort via social networks. The infographic would encourage them to use Stumbleupon to get the most exposure. The user is engaged through colour change as orange is used to make their own stats stand out, drawing the attention of the user onto how ‘better’ Stumbleupon is.
The infographic is laid out in a long strip that guides the viewer’s eye from top to bottom without any complication and because of this the hierarchy is kept very straight forward. The title as you would assume is the most dominant thing on the page with a large point size, but after that the info is given to you one fact after another in order from start to finish making it very easy to follow. As a result there is little space in between the items on the page with one image after another creating a sort of list effect.
The text on the design is displayed in clear, short statements to keep the main focus on the images and to make the infographic flow quicker. The hierarchy is communicated through typography by using a small point size for the majority of the text, which again keeps your attention on the statistics/images. The sub-headings are distinguished through colour change, larger point size and are made to stand out with a black decorative border around each of them. All the text on the design is presented in all caps, which would usually only be used for headings, and is a sans serif typeface, which adds to the clean feeling given throughout. Also, the sans serif font doesn’t add too much personality to the design, which doesn’t distract the user from the content.
The imagery doesn’t really add meaning but rather backs it up. Each statistic would still make sense without the symbolic images which add character more than meaning. They are included to make the design more visual, perhaps more interactive as the user has to actually count the images, e.g. the baby bottles that symbolise how many American’s are born per minute. The images relate to the statistic as well, e.g. a bottle is associated with a newborn baby, a stopwatch is associated with time, etc. In the case of the stopwatch, the user knows immediately that this specific fact is going to be about time before even reading it.
Bright colours, in most cases orange, have been used to highlight Stumbleupon’s facts, which are the most important facts according to this infographic. The other features of the design are a less dominant colour of light blue helping the orange text to stand out more. This makes it clearer that the infographic is bragging about the success of Stumbleupon and pointing out how far ahead it is than its main competitors.
The research content has been made visual, e.g. put into graphs, and if the visuals are not clear enough a small piece of text has been added to help make it clearer. A perfect example of this in action is the baby bottles as mentioned before. Another example of how type and imagery work together is when the actual logos for the competitor websites have been used instead of typing out the names. This makes it immediately obvious to the user what’s going on.
The images have been simplified to keep the content as clear as possible and to help not to confuse the user or to over complicate the design. The style of the design resembles the work of Jason Munn and is perhaps a reference to his design style. For instance, the clean, simplified imagery, sans serif fonts, the clear, straight forward hierarchy, the colour scheme and the overall feeling all give the impression of his work in my opinion.
Design process:
• Sign up to all the websites and see how they work
• Research the facts about each site
• Narrow down the facts you have found to the most relevant ones
• Find the clearest way of showing the chosen facts
• Choose the colour scheme that compliments Stumbleupon and attracts the user
to the correct parts of the design.
• Work out the layout and the order you wish to show the information so it’s
not too cluttered or confusing
• Work out the information hierarchy from the most important data to the
least important
• Insert the data in appropriate order into the design
