Tuesday, 29 July 2008

Online persuasion or better user experience - You be the judge!

Posted at: 11:04 AM by Marianna

There is a thin line between designing a web site to increase the company's sales and to increase the users' experience.

A clients' main reason for creating a web site or redesigning their existing web site is to increase profit/company sales, which can happen by improving the web site's traffic.

Sometimes Information Architects have the dilemma of whether to design with focus on a client's or a user's needs. Don't get me wrong, both should be taken into consideration, but some circumstances dictate more attention should be given to one than the other.

If we create a new user experience that should strongly promote services and products (Picture 1), persuading more and more people to engage with the page, we have to design a web site with authority, give examples of what other users do and add user testimonials. In general, we should enhance understanding, create persuasive visual design, generate confidence and stimulate desire (How to manipulate website visitors). On the other hand, if we are more user-focused (Picture 2) we should for example: avoid blinking imagery (though it could drive user attention to a service or a product), have no more than one animation per page and provide users with a sense of control.

As Spencer Gerrol and Kim Snedaker discussed at UPA 2008 there is a difference between what users "can do" (usability) and what users "will do" (persuasion) while visiting a website. I believe the best approach, is to ensure that users will have access to all the possible options before proceed to the desired action.

Picture 1

Picture 2

Labels: , ,

 Use this button to bookmark this post.

Thursday, 3 July 2008

Silent Corridors

Posted at: 9:18 PM by Hammad

It's not often that I come across a bit of industry lingo that I haven't heard before, but whilst working with a partner agency recently, I came across just that.

A Silent Corridor.

Now apparently the phrase was coined by somebody at BT and it refers (at least in the world of Information Architecture anyway) to a column on a page that becomes completely empty under certain circumstances.

For example. It's commonplace to use a 3 column layout for a web site, with the right column used for related links etc. However, what happens if a page/template no longer needs to use this area as defined? It's not always as simple as allowing the central column to 'flow' into this open space, as it's often restricted by a series of inherited template definitions (especially if the site is developed on a Content Management System; aka CMS). This actually happens quite a lot, like on Privacy policies or Sitemap pages. It can also be relevant during an e-commerce/shopping process, when you want to strip back on the hard-sell and keep people focused on what happening on the core real estate.

The result is a silent corridor; a complete end-to-end column that is empty and has nothing to offer anybody wandering into it. If you try to use it, you will go unheard.

It's not actually a bad thing to happen though, despite the eerie name it has become Christened with.

Template and layout consistency is very important for a good user experience and so by using a silent corridor effectively, you can keep your users focused on the important content on a page, instead of ramming unnecessary links and promos in their face and making them claustrophobic.

(oh dear, I think the hospital connotations are starting to take over!).

Labels: , ,

 Use this button to bookmark this post.

Friday, 20 June 2008

Persona card sorting exercise

Posted at: 2:07 PM by Marianna

Persona is involved in a new IA project for the redesign of one of a partner's client website. The deadline for designing a new sitemap for the client's website was tight so we conducted a card sorting exercise to identify possible ways to design the navigation layout.

The Card sorting method was chosen among other user-centred design methods as it is a useful tool Information Architects' use when they have to design a website sitemap in a quick, inexpensive, and reliable way. Card sorting helps efficiently structure the information you have. Furthermore, it gives suggestions for navigation, menus and taxonomies. (Donna Maurer)

The card sorting method usually does not provide results that can be used in the final structure of a sitemap, but can help to resolve several initial issues as:

  • Structure the Information under the same group
  • Find names for the groups
  • Identify categories that the Information Architect might have not included
  • Identify whether users want to see information structured with focus on subjects, audiences, or both

In order to organise the test sessions, we formed a list with items that could be placed in each card. Then we created 53 different cards with short labels that participants could quickly read but were detailed enough for the card content to be comprehensible. Seven individuals were invited to participate on the exercise. They were advised to carefully read the cards and try to group them accordingly. Throughout the sessions, we tried to answer some of their questions and took some notes to keep track of insightful comments they made. Finally, at the end of each session, we encouraged each individual to add any other cards he thought would be appropriate, or exclude any he thought were not relevant within any group.

Some individuals preferred to organise the cards in groups and then decide which will be the name of each group (picture 1, 2) while others chose to form a sitemap by first identifying the main navigation sections and place each card under them where appropriate (pictures 3, 4, 5). None of the individuals added any new card, though some of them excluded some which proves that we might have added more cards than those needed.

Picture 1

Picture 2

Picture 3

Picture 4

Picture 5

After the completion of the exercise, we gathered all the results and designed a sitemap, taking into account most of the users' preferences. The whole card sorting procedure proved to be very helpful as we wanted to form a navigation layout that would be more user- than project-driven. This method of involving real users before the design helped reach that goal and it also reduced the research time.

Finally, we would like to thank all the participants involved for their time and clever suggestions.

Labels: , , ,

 Use this button to bookmark this post.

Wednesday, 2 April 2008

Reading a web page backwards

Posted at: 2:19 PM by Hammad

Lately, I've been tracking various types of user behaviour when using web sites; you know, the usual kind of thing like navigation use, links, calls to action etc.

One strange behaviour patterm that has come to my attention though was actually one of my own!

I've noticed that when I see long web pages (e.g. with a scroll), it doesn't quite put me off, but I generally scroll down to the bottom straight away - to get a feel for how long the content is that I'm about to either enjoy or waste my time on.

Quite often, I'll then start reading back up the page in blocks/paragraphs; in a weird attempt to see if the rest of the article is worth reading. I guess it's a kind of 'read the last page of the book' type of syndrome.

Now I know many of you will think that I'm just plain stupid (and perhaps you're right), but I wonder how many other people out there have a similar behaviour pattern and indeed if the percentages are high enough to actually give this more thought when architecting a content page wireframe or design.

I'll put this to the test and report back anything new I find...

Labels: , , , , ,

 Use this button to bookmark this post.

Monday, 6 August 2007

Transform your World with Toshiba and Persona

Posted at: 9:03 AM by Hammad



Notebooks in Disguise

When Toshiba told us they would be tying up with one of the big summer blockbusters, we we're hoping it would be Transformers!

So, when we got the call to attend a briefing at Toshiba HQ, the childhood dreams of the lads at Persona came well and truly to life.

We've produced an interactive campaign web site in Adobe Flash that highlights their featured notebooks and promotes the tie up between the two iconic brands.

Optimising a Prime time experience

Using the movie footage as inspiration, we've used choice cuts of film, stills and sound to produce an intro sequence that sets the mood for the site concept.

The site then features an interactive, 360 degree viewpoint of a Satellite notebook that users can 'Transform'. Browsing through the site, visitors can also take part in a competition to win a Helicopter flying lesson - a direct reference to the new movie Transformer 'Blackout'.

On a more technical level, the site uses ASP.NET to provide 'send to a friend' functionality and also process the competition entries.

Under the bonnet

The intro sequence was edited together and sound synced in Adobe Premiere, with Adobe After Effects used to add the atmospheric lighting. Finally, this was exported as Flash Video and added to the main site without needing any additional browser or plug-in software for visitors to view it.

For the competition, our ASP.NET code validates entries and posts them as XML to a remote web service on Toshibas contact database; in a format that complies with their specifications. The web service then returns XML instructions that we use to re-direct visitors to the right page; either a message highlighting any problems or a confirmation that their entry has been successful.

To keep a smooth user experience, we've also used AJAX for the navigation, so the page isn't reloaded when moving between sections.

More than meets the eye

Toshiba and Transformers are both iconic brands in their own right; so how do you start to blend the two together in a partnership?

After being briefed by Toshiba, we worked with the Paramount Pictures footage, image library and usage guidelines to ensure both identities were given the right balance.

In our creative brainstorm, we came up with the concept that just like the Transformers robots, we needed to show that there can be more than meets the eye.

Other than highlight the more obvious brand synergy of Technology between the brands, we wanted to do something different.

For the site, everyday features such as USB connections and Keypads have been shot in an abstract style; suggesting they could be parts of a Transformer. By focusing on areas often taken for granted, we've created a mood that emphasises that the difference with a Toshiba notebook is that style and technology are equally important.

Using the All Spark

Using our in-house photography studio, we had full control of the lighting to create the right artistic style. We then put the shots through digital post production to add the Blue lighting - a common feature in footage from the movie.

Autobots, Roll out

Producing a site is only the first part of a campaign - the challenge is to get people to it. Toshiba have used a number of promotional channels to market the site, including:

  • Press Releases to the media
  • Banners on the main Toshiba Computers web site
  • Send to a friend email
  • Viral seeding and link building
With the campaign being time-critical (it's only being ran for the Summer), it is important that the PR activity focused on outlets of quick turnaround; specifically weekly publications and online media. Press releases have been sent to the design, IT and brand media to bring awareness of the campaign to the more effective audiences.

Toshiba have also agreed page sponsorships with Tiscali and have promotional material and signage in Dixons and Toshiba retail stores around the country.

The site features a send to a friend feature, that is branded as either Autobots or Decepticons depending on the users choice. The email sent is branded in the same style as the site, so recipients are enticed to visit the campaign to find out more.

Finally, the site has marketing analytics installed to track visitor levels, user journeys and conversion goals for the competition.

Avoiding Decepticons

Targeted traffic is being sourced and driven to the site using viral marketing. This was chosen over Pay Per Click advertising, so that the word-by-mouse effect would spread fast and search marketing budgets could be reduced - giving more creative freedom to the production side of the project.

Labels: , , , , , , ,

 Use this button to bookmark this post.