The Scenery cancels out the ache

Okay really, who wants to hear about some arb’s bicycle ride around the cape peninsula? It was beautiful and inspirational but who wants to hear me pontificating about Cape Town, cycling, lycra, fresh fish and the like?  However, and this is not just to please the boss, I did discover that it is nigh impossible to do almost anything these days without engaging with the internet.  Like riding a bike, for instance (did I mention that I rode my first Argus?).  As mentioned, I did register for the race and pay my entry fee online.  I did this because it didn’t even enter my mind to write to the race organisers and request an entry form to be posted to me, then fill out said form and post it back with a cheque attached – the only way I could enter without using the internet at all!  Apparently there are some people that still do this – a bunch of folks missed the Comrades Marathon cut off time this way.

Right, so now I have entered, how do I get there?  I live in Joburg and that’s about a thousand miles away.  I will not drive that distance for a weekend stay in the Mother City, I’m not twenty any more.  So guess what?  I turn to the internet once again to investigate flight costs and timetables.  After much research I book and pay for my flights online.  Same for car hire and same for the small matter of getting my bicycle to and from Cape Town.

I don’t want to bore you with the details but here is a list of all the ways that the internet played a role in my little adventure:

• My race number was emailed to me
• I received pre race updates via sms
• Used my mobile phone’s map application to find my way to my accomodation
• I left my cycling shoes in the car after being dropped off and my thumbs worked frantically trying to get them before the start!
• MMS’d my wife a picture of some flowers to thank her for finding her way back through unfamiliar streets to get me my shoes (I couldn’t ride 110km in slops)
• Took photo’s of the magnificent views and sent them to family and friends using my iPhone
• Video’d my ride along Boyes Drive and Chapmans peak (I would add them to this post but my puffing and wheezing in the audio is quite frightening)
• SMS’s my food order for my post race lunch
• Sent incremental updates of my whereabouts so that my four year old son could be at the finish line to cheer his daddy on (he still thinks I won the race because I got a finishers medal)
• At the post race lunch I updated Facebook and Twitter and sent my photo’s to friends via email before the fatigue set in
• Confirmed my return flights online
• Tracked my bicycle’s journey home through the courier company’s web site.

iPhone shot of Hout Bay taken from bicycle

Wow! If you can’t even ride your bike, can we do anything these days without using the world wide web?  I’m guessing the answer is pretty much NO!  Not if you live in the real world.

Right, I can now tick the boxes – blogged about my first Argus and kept the boss happy coz it was about “all things internetty”.

Ciao!

In case you didn’t, let me share my recent findings with you. While researching social media for a client recently I discovered some interesting (and some not so interesting) facts about social media, the internet and the Chinese.  Like, if you consider yourself one in a million in China, there are 1 300 people just like you!  I started my journey on Google, as it is the worlds number one search engine and then discovered that in the very near future we will no longer search for products and services, they will find us via social media.  Nooooo!  I like saying Google just as I like saying Hoover – I will hoover up that mess as soon as I’ve finished Googling the best place to buy a vacuum cleaner.

After trawling through pages of web and blog sites I found my first really interesting fact – that You Tube is the second largest search engine in the world.  And it is here that I discovered Pandora’s Box.  I will not delve too deeply into the facts, except to tell you that all of the Top 10 jobs of 2010, not one existed in 2004.  Really!  Do what I did – type “Did you know” into the You Tube search tool and expect to be amazed.  Video upon video of (I will not say all of them are) interesting facts, all of them user generated, await to spew their often anecdotal tidbits onto your screen.  Some are interesting facts for dinner table conversation ignitors, like the one about Barrack Obama not raising funds for his election campaign in the traditional manner, instead he raised $55 million via social networks, in just 29 days! Others are great for client presentations, like 78% of consumers trust peer recommendations while only 14% trust advertisements.

So don’t ever get caught without an interesting fact again.  Apparently this is the Attention Age so pay attention dammit!

Okay, so we exaggerate. But Google CEO (and we all know Google is still the guru of everything) Eric Schmidt does believe that five years from now the Internet will be dominated by Chinese language content. What’s more, he made this revelation at recent techie heaven expo – Gartner Symposium/ITxpo Orlando 2009 – in front of thousands of IT gurus, so it must be true!

The good news for those of us who don’t speak Chinese is that other radical changes will occur in the next five years which will actually benefit us. We won’t send you to watch the full 45-minute interview available on YouTube – it’s a super-snooze fest and besides, the kind, now-snoozing-no-doubt ReadWriteWeb (www.readwriteweb.com) folk already did that for us. But we did think these points he made were interesting (highlighted by aforementioned now-snoozing ReadWriteWeb folk):

1. The Internet will also be dominated by social media content. (We could have told him that!)
2. It will be delivered over super-fast bandwidth in real time. (Super-fast? Well, us South Africans can live in hope.) We’re talking broadband well above 100MB in performance.
3. Content will move towards more video. We love us some YouTube.
4. Real time information will be recognised as being just as valuable as all other information, and will be included in search results.
5. Google specifically will also be looking at how to rank real time info. “The fundamental shift towards user-generated information means that people will listen more to other people than to traditional sources. Learning how to rank that is the great challenge of the age.”

That, and learning how to speak Chinese so we can follow it all.

Web 1.0 was based on the read-only environment, where what you saw is what you got, very much information based, and then all of a sudden people/geeks started getting clever with this whole thing and said “hey! Why not give the users of the websites the option to comment or to put up their own content instead of the boring over read single user type information. Then bang!…..Web2.0 the read-write environment. From this we had an explosion of websites, with a lot of dudes making a hell of a lot of money.

Posting images, videos, commenting and blogging became a craze. People couldn’t get enough of this… American kids got fatter, Australian kids got lazier, England kids became cheekier. And African kids well they, they just carried on as normal because they didn’t have the internet.

So now we on the verge of what some experts would like to call web 3.0. The so called read-write-execute environment. So what does this mean for us simple minded end users? To be honest, no one really knows, but what seems to be popping up around the internet is the use of web based applications, basically meaning that there might be a trend towards downloadable apps for specific use….or not, it’s up to debate.

Another thing that might come out this, is intelligent based web searches, i.e. artificial intelligence, AI as they call it……wooooo, so what the hell does this really mean, It means that when you search for something it won’t bring up a (keyword search vs most visited) results, what this means is that your search engine will reason with your input in a “quasi-human fashion” so it will try and understand what you are looking for and not just spit out any keyword/tag related results. It will direct you to hopefully exactly what you’re looking for. All the more functionality to sift through some billions of WebPages out there. Anyway that’s a small bit of info about this hiding giant, so I will let you ponder more on that. So let’s wait and see what happens in the next year or so.

One last quote from Google CEO Eric Schmidt – “Web 3.0 will be applications which are pieced together – relatively small, the data is in the cloud, can run on any device (PC or mobile), very fast, very customizable, and distributed virally (social networks, email, etc).”  - Thanks Eric

Image sourced from weblogs.elearning.ubc.ca

A lot of the content in this preso comes from the design gurus at Smashing Magazine – I remixed things and added some of my own spice and then made the format easier to share. Kudos also to Springwise and whole host of others for inspiration and great posts – keep ‘em coming.

The large version is here

Get your own – Open publication

Over at the Function Web design blog Liam has compiled an awesome post of 50 stunning examples of a great redesign – it’s an awesome post that features many iconic brands before and after.

www.colorcombos.com has been created to help web developers select and test the perfect colour combinations for online projects.

The Combo Tester allows web developers to see how different colour combinations work together on the screen while the Combo Library houses hundreds of colour swatches, along with their colour hex values.

You can also use the website colour grabbing tool or the search tool to get started and premium services are charged at a fee.

ReadWriteWeb.com, leaders in social media, web 2.0 and web tech reporting have just released the first part of their ‘Social Media in Africa’ articles.

3 startups in particular are mentioned as Social Media Leaders:

Afrigator (a South African aggregator of African blogs and news),

Zoopy (a YouTube/Flickr like service also out of South Africa) and

Ushahidi (an SMS crisis reporting and mapping engine from Kenya)

Check out the original article to read more, it’s always great to see local ventures hitting the global stage.

Image via

The term ‘Discomgoogolation’ has been coined to describe those people who are feeling stressed or anxious at an inability to access the internet. In a recent survey in the UK 44% of survey respondents are discomgoogolation sufferers, with over a quarter, 27% – admitting to rising stress levels when they are unable to go online.

“The proliferation of broadband has meant for the first time in history we’ve entered a culture of ‘instant answers,’” said psychologist Dr David Lewis, who identified discomgoogolation by measuring heart rates and brainwave activity.

The term comes from “discombobulate”, which means to confuse or frustrate, and Google.

“A galaxy of information is just a mouse click away and we have become addicted to the web,” added Lewis. “When unable to get online, discomgoogolation takes over.

Can not live without internet

“It was surprising to see the stress this led to brain activity and blood pressure in participants both increase in response to being cut off from the internet.”

The survey also found 76% of Britons could not live without the internet, with over half of the population using the web between one and four hours a day and 19% of people spending more time online than with their family in a week.

Forty-seven percent of those polled believed the internet was more important in people’s lives than religion, with one in five people paying the internet more attention than their partner.

Commissioned by information service 118118, the YouGov poll questioned 2 100 Britons during the first week of July.

via News24

This post is taken from a Smashing Magazine story earlier this year. We feel it’s a very comprehensive well presented post, if you have any interest in bettering your online design knowledge and in how online visitors behaviour affects basic design principles then read on.

Perhaps you have some additional points / principles you feel are worth adding to the list? Let us know.

Principles Of Effective Web Design

In order to use the principles properly we first need to understand how users interact with web-sites, how they think and what are the basic patterns of users’ behavior.

How do users think?

Basically, users’ habits on the Web aren’t that different from customers’ habits in a store. Visitors glance at each new page, scan some of the text, and click on the first link that catches their interest or vaguely resembles the thing they’re looking for. In fact, there are large parts of the page they don’t even look at.

Most users search for something interesting (or useful) and clickable; as soon as some promising candidates are found, users click. If the new page doesn’t meet users’ expectations, the Back button is clicked and the search process is continued.

• Users appreciate quality and credibility. If a page provides users with high-quality content, they are willing to compromise the content with advertisements and the design of the site. This is the reason why not-that-well-designed web-sites with high-quality content gain a lot of traffic over years. Content is more important than the design which supports it.
• Users don’t read, they scan. Analyzing a web-page, users search for some fixed points or anchors which would guide them through the content of the page.
  Users don’t read, they scan. Notice how “hot” areas abrupt in the middle of sentences. This is typical for the scanning process.
• Web users are impatient and insist on instant gratification. Very simple principle: If a web-site isn’t able to meet users’ expectations, then designer failed to get his job done properly and the company loses money. The higher is the cognitive load and the less intuitive is the navigation, the more willing are users to leave the web-site and search for alternatives. [JN / DWU]
• Users don’t make optimal choices. Users don’t search for the quickest way to find the information they’re looking for. Neither do they scan web-page in a linear fashion, going sequentially from one site section to another one. Instead users satisfice; they choose the first reasonable option. As soon as they find a link that seems like it might lead to the goal, there is a very good chance that it will be immediately clicked. Optimizing is hard, and it takes a long time. Satisficing is more efficient. [video]
  Both pictures show: sequential reading flow doesn’t work in the Web. Right screenshot on the image at the bottom describes the scan path of a given page.
• Users follow their intuition. In most cases users muddle through instead of reading the information a designer has provided. According to Steve Krug, the basic reason for that is that users don’t care. “If we find something that works, we stick to it. It doesn’t matter to us if we understand how things work, as long as we can use them. If your audience is going to act like you’re designing billboard, then design great billboards.”
• Users want to have control. Users want to be able to control their browser and rely on the consistent data presentation throughout the site. E.g. they don’t want new windows popping up unexpectedly and they want to be able to get back with a “Back”-button to the site they’ve been before: therefore it’s a good practice to never open links in new browser windows.

1. Don’t make users think

According to Krug’s first law of usability, the web-page should be obvious and self-explanatory. When you’re creating a site, your job is to get rid of the question marks — the decisions users need to make consciously, considering pros, cons and alternatives.

If the navigation and site architecture aren’t intuitive, the number of question marks grows and makes it harder for users to comprehend how the system works and how to get from point A to point B. A clear structure, moderate visual clues and easily recognizable links can help users to find their path to their aim.

Let’s take a look at an example. Beyondis.co.uk claims to be “beyond channels, beyond products, beyond distribution”. What does it mean? Since users tend to explore web-sites according to the “F”-pattern, these three statements would be the first elements users will see on the page once it is loaded.

Although the design itself is simple and intuitive, to understand what the page is about the user needs to search for the answer. This is what an unnecessary question mark is. It’s designer’s task to make sure that the number of question marks is close to 0. The visual explanation is placed on the right hand side. Just exchanging both blocks would increase usability.

ExpressionEngine uses the very same structure like Beyondis, but avoids unnecessary question marks. Furthermore, the slogan becomes functional as users are provided with options to try the service and download the free version.

By reducing cognitive load you make it easier for visitors to grasp the idea behind the system. Once you’ve achieved this, you can communicate why the system is useful and how users can benefit from it. People won’t use your web site if they can’t find their way around it.

2. Don’t squander users’ patience

In every project when you are going to offer your visitors some service or tool, try to keep your user requirements minimal. The less action is required from users to test a service, the more likely a random visitor is to actually try it out. First-time visitors are willing to play with the service, not filling long web forms for an account they might never use in the future. Let users explore the site and discover your services without forcing them into sharing private data. It’s not reasonable to force users to enter an email address to test the feature.

As Ryan Singer — the developer of the 37Signals team — states, users would probably be eager to provide an email address if they were asked for it after they’d seen the feature work, so they had some idea of what they were going to get in return.

Stikkit is a perfect example for a user-friendly service which requires almost nothing from the visitor which is unobtrusive and comforting. And that’s what you want your users to feel on your web site.

Apparently, Mite requires more. However the registration can be done in less than 30 seconds — as the form has horizontal orientation, the user doesn’t even need to scroll the page.

Ideally remove all barriers, don’t require subscriptions or registrations first. A user registration alone is enough of an impediment to user navigation to cut down on incoming traffic.

3. Manage to focus users’ attention

As web-sites provide both static and dynamic content, some aspects of the user interface attract attention more than others do. Obviously, images are more eye-catching than the text — just as the sentences marked as bold are more attractive than plain text.

The human eye is a highly non-linear device, and web-users can instantly recognize edges, patterns and motions. This is why video-based advertisements are extremely annoying and distracting, but from the marketing perspective they perfectly do the job of capturing users’ attention.

Humanized.com perfectly uses the principle of focus. The only element which is directly visible to the users is the word “free” which works attractive and appealing, but still calm and purely informative. Subtle hints provide users with enough information of how to find more about the “free” product.

Focusing users’ attention to specific areas of the site with a moderate use of visual elements can help your visitors to get from point A to point B without thinking of how it actually is supposed to be done. The less question marks visitors have, the better sense of orientation they have and the more trust they can develop towards the company the site represents. In other words: the less thinking needs to happen behind the scenes, the better is the user experience which is the aim of usability in the first place.

4. Strive for feature exposure

Modern web designs are usually criticized due to their approach of guiding users with visually appealing 1-2-3-done-steps, large buttons with visual effects etc. But from the design perspective these elements actually aren’t a bad thing. On the contrary, such guidelines are extremely effective as they lead the visitors through the site content in a very simple and user-friendly way.

Dibusoft.com combines visual appeal with clear site structure. The site has 9 main navigation options which are visible at the first glance. The choice of colors might be too light, though.

Letting the user see clearly what functions are available is a fundamental principle of successful user interface design. It doesn’t really matter how this is achieved. What matters is that the content is well-understood and visitors feel comfortable with the way they interact with the system.

5. Make use of effective writing

As the Web is different from print, it’s necessary to adjust the writing style to users’ preferences and browsing habits. Promotional writing won’t be read. Long text blocks without images and keywords marked in bold or italics will be skipped. Exaggerated language will be ignored.

Talk business. Avoid cute or clever names, marketing-induced names, company-specific names, and unfamiliar technical names. For instance, if you describe a service and want users to create an account, “sign up” is better than “start now!” which is again better than “explore our services”.

Eleven2.com gets directly to the point. No cute words, no exaggerated statements. Instead a price: just what visitors are looking for.

An optimal solution for effective writing is to

• use short and concise phrases (come to the point as quickly as possible),
• use scannable layout (categorize the content, use multiple heading levels, use visual elements and bulleted lists which break the flow of uniform text blocks),
• use plain and objective language (a promotion doesn’t need to sound like advertisement; give your users some reasonable and objective reason why they should use your service or stay on your web-site)

6. Strive for simplicity

The “keep it simple”-principle (KIS) should be the primary goal of site design. Users are rarely on a site to enjoy the design; furthermore, in most cases they are looking for the information despite the design. Strive for simplicity instead of complexity.

Crcbus provides visitors with a clean and simple design. You may have no idea what the site is about as it is in Italian, however you can directly recognize the navigation, header, content area and the footer. Notice how even icons manage to communicate the information clearly. Once the icons are hovered, additional information is provided.

From the visitors’ point of view, the best site design is a pure text, without any advertisements or further content blocks matching exactly the query visitors used or the content they’ve been looking for. This is one of the reasons why a user-friendly print-version of web pages is essential for good user experience.

Finch clearly presents the information about the site and gives visitors a choice of options without overcrowding them with unnecessary content.

7. Don’t be afraid of the white space

Actually it’s really hard to overestimate the importance of white space. Not only does it help to reduce the cognitive load for the visitors, but it makes it possible to perceive the information presented on the screen. When a new visitor approaches a design layout, the first thing he/she tries to do is to scan the page and divide the content area into digestible pieces of information.

Complex structures are harder to read, scan, analyze and work with. If you have the choice between separating two design segments by a visible line or by some whitespace, it’s usually better to use the whitespace solution. Hierarchical structures reduce complexity (Simon’s Law): the better you manage to provide users with a sense of visual hierarchy, the easier your content will be to perceive.

White space is good. Cameron.io uses white space as a primary design element. The result is a well-scannable layout which gives the content a dominating position it deserves.

8. Communicate effectively with a “visible language”

In his papers on effective visual communication, Aaron Marcus states three fundamental principles involved in the use of the so-called “visible language” — the content users see on a screen.

• Organize: provide the user with a clear and consistent conceptual structure. Consistency, screen layout, relationships and navigability are important concepts of organization. The same conventions and rules should be applied to all elements.
• Economize: do the most with the least amount of cues and visual elements. Four major points to be considered: simplicity, clarity, distinctiveness, and emphasis. Simplicity includes only the elements that are most important for communication. Clarity: all components should be designed so their meaning is not ambiguous. Distinctiveness: the important properties of the necessary elements should be distinguishable. Emphasis: the most important elements should be easily perceived.
• Communicate: match the presentation to the capabilities of the user. The user interface must keep in balance legibility, readability, typography, symbolism, multiple views, and color or texture in order to communicate successfully. Use max. 3 typefaces in a maximum of 3 point sizes — a maximum of 18 words or 50-80 characters per line of text.

9. Conventions are our friends

Conventional design of site elements doesn’t result in a boring web site. In fact, conventions are very useful as they reduce the learning curve, the need to figure out how things work. For instance, it would be a usability nightmare if all web-sites had different visual presentation of RSS-feeds. That’s not that different from our regular life where we tend to get used to basic principles of how we organize data (folders) or do shopping (placement of products).

With conventions you can gain users’ confidence, trust, reliability and prove your credibility. Follow users’ expectations — understand what they’re expecting from a site navigation, text structure, search placement etc. (see Nielsen’s Usability Alertbox for more information)

BabelFish in use: Amazon.com in Russian.

A typical example from usability sessions is to translate the page in Japanese (assuming your web users don’t know Japanese, e.g. with Babelfish) and provide your usability testers with a task to find something in the page of different language. If conventions are well-applied, users will be able to achieve a not-too-specific objective, even if they can’t understand a word of it.

Steve Krug suggests that it’s better to innovate only when you know you really have a better idea, but take advantages of conventions when you don’t.

10. Test early, test often

This so-called TETO-principle should be applied to every web design project as usability tests often provide crucial insights into significant problems and issues related to a given layout.

Test not too late, not too little and not for the wrong reasons. In the latter case it’s necessary to understand that most design decisions are local; that means that you can’t universally answer whether some layout is better than the other one as you need to analyze it from a very specific point of view (considering requirements, stakeholders, budget etc.).

Some important points to keep in mind:

• according to Steve Krug, testing one user is 100% better than testing none and testing one user early in the project is better than testing 50 near the end. Accoring to Boehm’s first law, errors are most frequent during requirements and design activities and are the more expensive the later they are removed.
• testing is an iterative process. That means that you design something, test it, fix it and then test it again. There might be problems which haven’t been found during the first round as users were practically blocked by other problems.
• usability tests always produce useful results. Either you’ll be pointed to the problems you have or you’ll be pointed to the absence of major design flaws which is in both cases a useful insight for your project.
• according to Weinberg’s law, a developer is unsuited to test his or her code. This holds for designers as well. After you’ve worked on a site for few weeks, you can’t observe it from a fresh perspective anymore. You know how it is built and therefore you know exactly how it works — you have the wisdom independent testers and visitors of your site wouldn’t have.

Bottom line: if you want a great site, you’ve got to test.