we are: London

I have been reading and thinking a lot about the sign-up processes involved in so many of the websites and apps we use. A website that surrounds a service such as Twitter, Facebook or Tweetdeck deals with the undecided user, the user who is unsure if he wants to use the service or app. However once a user has made the mental decision that he wants to get in on the action he is often faced with nothing more than a boring form. Not the ideal start to the engaging, fun and useful experience promised.

Being met with a sign-up form is not the most engaging way to begin your experience with a product (even if the product is as good as Remember the Milk)

The barrier of the sign-up form

Ok so this twitter thing sounds really good, my friends are all on it so let’s give it a try. Now I know I want to use it but before I can I have to complete the sign-up process. This process can act like a giant barrier between the potential user and the actual user. How can we deal with this problem? Making the process simple and easy to use will greatly improve the completion rate but we can also look at doing more. Services such as Jumpcut (now closed as of June 2009 but outlined in an excellent article on A List Apart), a service for making online movies, used a really interesting approach. Users who arrive on the site can jump in straight away. They can use the service and make a movie and only need to sign-up if they wish to save or share their movie at the end of the process. This removes the initial barrier, getting users engaged from the outset and only asking them to commit to the sign-up process once they have tried to service. This greatly improves the first time user experience.

Twitter engages the customer through the sign-up process

Onboarding and gradual engagement

Getting people signed up to your service is one thing but what about going the next step and getting people using it? This process is often referred to as onboarding. Taking a look at the way twitter handles their sign-up process presents us with an excellent example. If a user wants their own account (they can use twitter to search and read tweets without one) they must go through the sign-up process. During this process they can search suggestions based on interest, search for their friends using their email contacts and also use a free text search for users. Engaging users right from the sign-up process allows them to hit the ground running. They learn about the service and begin with their own customized account filled with tweets based on their own selected interests and people.

Welcome your users

Unfortunately a sign up process will be inevitable at some point for web apps and services but these outlined strategies aim to improve the first time user experience and use the sign-up process to the user’s advantage. If we can let a user experience the service before signing up we can remove the initial barrier. If we can use the sign-up process to engage and teach the user it turns the process into something not only more engaging for the user but of massively more value.

information architecture, interface design, usability design, user centred design, user interface ideas, inspiration, Internet, usability, user experience

There are some web based applications that I use every day. I use Spotify to listen to music, Remember the Milk to organise my life, Tweetdeck to force my opinions on unsuspecting followers and Evernote to record clippings of inspiration and ideas. While thinking about the design of web apps one thing has really stuck in my mind. In an article by Luke W he talked about thinking and designing web applications as products, if web app is a product, design considerations such as customer lifecycle and packaging should be considered.

It made me think if Spotify is the product then what is the packaging? It doesn’t come in a box? The packing of these applications is the website that promotes it. This is the chance that the company has to promote its product and looking towards the restraints and considerations of physical packaging design can help strengthen a design. It gives a narrative for a designer to follow when creating and designing the most effective solution.

The large image used on the tweetdeck homepage makes the product very visible, allowing users to see the product in context.

What can we learn from packaging design?

Packaging has certain contextual and physical constraints.

• Space is limited to the size of box or DVD sleeve so information must be delivered concisely and efficiently.
• Exposure to a potential customer is brief. They may only be walking past or scanning a shelf in a shop.
• Customers will want to see a product so packaging must find a way to make the product visible, either through large, high quality pictures or by making the product physically viewable such as meat wrapped in clear packaging in a supermarket.

The evernote homepage does a good job a quickly communicating the purpose of the product using a limited amount of space and requiring limtied reading time.

Applying this to the web

These are interesting points but how do we apply them to the design of a web apps accompanying website.

• The website should always attempt to get information to the user as easily, quickly and concisely as possible. Copy should be short and sweet, pages should be kept to a minimum, titles and actions should be obvious and users should be able to navigate to content quickly and easily.
• Web users are famously impatient. They will not stick around of they do not get what they want quickly and easily. Just like physical customers time is limited. Benefits and key information must be delivered fast.
• A web application is not a physical product so how can we make this visible to the user? Screenshots, descriptions, videos, tutorials, testimonials, are all ways to make the product visible. The important thing is to let the user learn about the product before they have to download it.

These are all things that most UX designers will already be thinking of but wrapping them up in this analogy or narrative helps to deliver a thought process or a checklist to design against. If you want to learn more about our approach to design feel free to give us a phone on 0207 1991 321 or send us a message.

information architecture, interface design, usability design, user centred design, user interface Design, ideas, Internet, usability, user experience

At best Intranet design is a challenging task for most, at worst it’s a thankless job that sits at the bottom of many companies priority lists.
Taking ownership can be a daunting prospect, especially as many intranets are unfocused, sprawling repositories of content and ideas, grown organically over a long period. But taking ownership is the first step in putting a tool in place that can quickly become a high priority on the business comms list.

Over the past couple of years, intranets have become a hot topic within large and small businesses, and within the world of digital design. New platforms, techniques and an ever blurring line between the Internet and company Intranets driven through the integration of social, UGC, multimedia and semantic technologies has led to more stakeholders, with more requests and usually less budget.

Persuasive design

One of our most common findings during user and stakeholder research is that reason an intranet is unused and unloved is due to the fact that it’s never worked and never been adopted by the business.

Every task users are asked to complete online should at least as easy as off-line methods, or easier, otherwise users will always fall back to the default of asking a colleague, phoning a department or worse not doing anything.

The reason behind this is that existing staff have learnt their way round the system over time, usually years and new joiners are forced to struggle through anyway they can. A recent client’s intranet is so bad that new joiners are given a guided tour as part of their induction and then offered a CD-Rom or online video tutorial. I doubt any owners of an Internet site would expect a tutorial on how to use the site as acceptable; just make it easy to use.

I’m ready to be engaged

Whilst your intranet is unlikely to become “the” destination for your staff and should not try to replace other sources of external information, it should be functional and engaging in equal measures.

Features that rank highly from a users perspective usually include:

• Buy, sell, rent
• Interest groups (sports, social, clubs)
• Lunch menu

For business engagement, these features rank highly:

• Ask the management (live Q&A)
• Personnel contact finder
• Collaboration tools (wikis and connectors)

It’s important to remember that many of the tasks that your staff use the intranet for can only be completed online, so usage should not be confused with satisfaction. Providing tools and services that help staff to become engaged with the business and each other will prove invaluable in driving uptake and long term use of the site.

“Don’t underestimate the power of the intranet for fostering a sense of culture & belonging - it may not be a core ‘money-earner’, but that doesn’t mean it’s not important.”

How to guide

A few points that may help you in planning and designing your intranet include:

• Governance to avoid organic growth - The key to providing a consistent and usable experience is providing a strict governance model to ensure quality control. Intranets by nature are created and controlled by many people and departments and without solid governance grow organically into a combination of different style and experiences.
• Ownership and stakeholder involvement - Many challenges are faced throughout the redesign of an intranet as there is often no clear owner. Different sections and content are owned by different departments and stakeholders. It is important to include all stakeholders to both understand content and to promote a feeling of inclusion and acceptance of the work within the various content owners. This can present many challenges within time and cost restraints.
• Content - Large volumes of content can make it difficult for users to find what they need. Intranets can easily be into tens of thousands of pages. Content can generally be clearly split into two types. Content that is generated by a department specifically for employees of that department (IT generating content for IT employees) and content that is generated by a department for all employees (HR generating content aimed at all employees of the company). Splitting the information like this can dramatically improve the ease of finding content by isolating information only needed by a single department in a departmental section.
• Can’t find what you are looking for? - If content is difficult to find many users will resort to other channels such as asking colleagues to find important information. Information should be easily available so that users do not need to resort to other methods.
• Navigation - Navigation is key to providing a consistent experience and allowing users to find and move through content. In an environment where this may be defined by many different content creators it is important to ensure they follow a strict model, usually by service offered and not by business function.

Next steps

It’s important to have a plan when working on your intranet and it’s valid not matter what stage you are at, defining a new site or migrating to a new platform. Here are a few points to follow:

1. Take ownership; whilst often a daunting task, your ability to lead the project will ultimately deliver a very successful site.
2. Don’t under estimate the scale of the task in hand; updating, migrating or creating an intranet from scratch requires a lot of time, effort and support.
3. Use external consultants; they will bring a wealth of experience, offer an objective view and can help to mediate difficult decisions.
4. Don’t redesign standards; user staff are familiar with Google, eBay, Linked In and Facebook, use these interfaces rather than creating your own, bespoke ones.
5. Start collaborating now; get a range of staff involved in the redesign, they’ll become your champions and power users down the line.
6. Benchmark; creating some form of  measurement will help to justify the time and financial investments needed for short and long term success.
7. Don’t let the software control you; the platform is important but the business requirements and user needs should lead the design process.
8. Content strategy; know what you plan to do with the content and create a strategy for developing it long term.

If you have found this useful, then why not get in touch and see how we can help accelerate the success of your businesses intranet.

Content strategy, Intranet, global usability testing, information architecture, usability research, user centred design, user interface innovation, Intranet, research, usability, user experience

I couldn’t resist downloading the official Twitter app for Android as soon as I heard it was available. As an avid tweeter I was excited to see what it was like.

The homescreen

Users are displayed trending topics at the foot of the screen

When loading the app the user is taken to a homescreen where they can choose if they wish to read tweets, view their profile or view lists messages or replies. The layout is simple and easy to use with large target areas for fingers to press. The area at the foot of the screen is very interesting. This area is used to pop-up various trending topics allowing users to visit these searches directly from the homescreen.

Peoples tweets

Users are presented with a pop-up menu to carry out actions

While reading tweets the application keeps access to all functionality on one screen. The full tweet text is displayed with a small pop-up menu displayed at the touch of an icon. This allows users access to functions as such as retweeting, replies, favourites and sharing while not leaving the main screen, not dissimilar to the method applied by the latest Facebook design where the user has access to many functions from a single screen.

Your tweets

The "Create tweet" screen is clear and well laid out

The “Create tweet” screen is clearly laid out and organised. The update and cancel buttons are placed above the keyboard, not hidden behind it as in so many Android apps. An iPhone style on/off slider is used to toggle the users location on or off, an interface element many people will be familiar with but may not be clear to all of Android’s user base. It is easy to add or upload photos and another function allows users to access their following list to add people as an @ reply into their tweet. This is a handy feature that turns your following list into a contacts list.

Tweetclusion

The official Twitter app is a welcome addition to my Nexus One. It has currently taken the title off Seesmic for my top tweeting tool. Its combination of neat features and smooth interface make it a good choice for anyone.

Mobile, information architecture, interface design, user interface Internet, Mobile, Nexus One, social networking

Working on projects with multiple deadlines, deliverables, meetings and workshops can always be an organisational challenge. Keeping a record of all the things you have to do, when they need to be done and how important they are can be a nightmare to keep on top of. To keep all my tasks under control I list out all my tasks. To keep all my deadlines, meetings and workshops in mind I enter them all into my calendar. I do however start to find myself with multiple lists on various pieces of paper and my calendar is not connected at all. If I leave my list in the office and go to work onsite I am left unorganised. This was of course until a colleague turned me on to a popular web application called Remember the Milk.

Users can easily view their tasks and navigate between lists

My problems answered

Remember the Milk is an online to do list application that lets me enter all my tasks, give them deadlines and days to be done/completed, organise them into priorities, keep several lists separating my work and private tasks and even more. It’s all kept online so is available from anywhere I have an internet connection. It even sync’s with a Remember the Milk application for my Android phone (iPhone version also available), and sends me daily reminders of my tasks due that day. It combines all the tasks both my calendar and paper lists achieve into one easily accessible place.

Remember the user?

So i like the concept and it solves a real world problem for me but what about the UI? I can remember the milk now but did they remember the user?

Using commands can turn the single task input field into a powerful tool

The interface is clean and simple with some nice touches. The right hand column floats to be always visible when users scroll down long lists. The tabbed layout allows for easy navigation between lists. The right hand column gives easy access to all the main task options allowing users to quickly edit due dates, estimated task time, notes and tags.

The key to the usability and experience of the application is the prominent task input field. This allows user not only just to add the name of a task but to use a series of commands to enter further details of the task in the single text box. Users can add due dates, priorities, tags, locations, repeat tasks and time estimates by adding commands such as hash symbols. This may involve a degree of learning but for an application that many users will use every day it turns a single text box into a extremely powerful piece of functionality.

Mobile, information architecture, interface design, usability design, user interface innovation, Internet, Mobile, Nexus One, usability, user experience

Quick n’ dirty

Creating wireframes and prototypes on a daily basis I like keep an eye pealed for usefull tools to add to the kit. When creating wireframes I like to spend my time thinking. I don’t want ot spend my time wrestiling with an application. I need to translate the picture in my head onto the screen as quickly and easily as possible. Luckily there are some great tools out there for creating both static wirframes and interactive prototypes. One that I came across a while ago is Balsamiq Mockups.

Wireframes are quick to produce and post-it note style widgets can addded

Easy as 1-2-3

Balsamiq Mockups is currently a desktop application but with an online version in private beta. The tool allows users to quickly drag and drop interface elements much in the same style as other more commonly used tools such as Visio or Axure. Balsamiq Mockups would however sit much more within the initial stages of my development process. Its rapid development of ’sketchy’ looking wireframes makes it perfect for throwing together first thoughts. Its quick enough to be a viable option for producing the initial sketches in a clear and neat format that retain the skethcy feel that works so well with paper sketches.

iPhone widgets allow for quick iPhone mock-ups

Tasty features?

There are some tasty features in the Balsamiq Mockups interface.

• A library of 75 interface features such as browser windows, radio buttons and iPhone interface elements.
• Nice snap features allowing users to quickly line up elements within minimal effort and time.
• Usefull post-it note style comments.
• Full screen presentation mode that allows users to present work to clients and collegues.
• Runs on both Mac and PC.

For more information on we are:london’s wireframing and interactive prototyping services please contact hello@WeAreLondon.

Uncategorized, information architecture, interface design, usability design, user centred design, user interface Internet, usability

The Invoice Machine is a web application aimed a helping businesses produce professional looking invoices simply and easily. Hearing about them I took a trip to their website.

The homepage is clear and simple

The homepage

The homepage can be summed up very easily. Clear and simple. This is what struck me as I visited the site. A strong simple hero item with clear calls to action, then some slightly deeper information around ‘Why use it’ and ‘Who is it for’. The homepage not only provides a simple route into the information of the site it answers the questions most users will have when they first visit: ‘What makes this better than anything else?’ and ‘Will this suit my needs?’ Answering these questions upfront will not only help many users decide it is for them without the need to look further but it also gives the site an open and honest feel.

Clearly labelled navigation creates a more usable site

Navigation

Primary navgation is simple and easy to use. Clear calls to action at the foot of pages allow me easy access to the sign-up process.

The use of a table delivers the key information in a easy to interpret way

Content

The content of the site is kept very concise and easy to digest. The tour page contains only a well put together tour video. The pricing page contains simple table outlining the attributes of each price plan. Content is direct, the users are given what they need with no uneccesary information.

Keep it simple

The website as a whole is a good example of how simplicity can lead to a strong and usable website. Users visit a site to get information, a good website needs to identify the key information they are looking for and deliver it in a simple, clear and usable way.

Uncategorized, information architecture, interface design, usability design, user interface Internet, navigation, usability

I have recently been thinking a lot about homepage hero items and had an example brought to my attention. The hero item on Mozy.com brings together many of the ingredients that make a good hero.

• Communicates service benefits - the hero item clearly communicates the service benefits of the site. A bold headline stating the purpose of the service, a key marketing message highlighted and further explanation provided.

• Clear visual hierarchy - A very clear visual hierarchy is used. This allows users to identify the most important information and read only as much information as they require. Some users may not wish to read further than the headline then go straight to an action within the page, while some users may feel the require more information.

• Route into information - The hero item provides a route into information. A user can view the introductory video, They can learn more about the service offered or they can go for gold and sign-up straight away.

• Bold imagery - The imagery used is bold and striking but does not overpower the user or distract from the information presented within the hero item.

Uncategorized, information architecture, interface design, usability design, user interface Internet, navigation, usability

Love him or hate him.

It all comes down to one single, tangible factor, which marks out the good from the bad; soul.

The reason for the Clarkson tribute on the left is this weeks Sunday Times Motoring article on an Aston Martin which sees Clarkson pitting it against design perfection in the shape of an Audi R8 V10.

And to save you the read, the Audi is just too perfect, where as the Aston has soul, something that can’t be created by following set rules, but comes from the heart of those involved and is a direct result of the creator’s passion.

All of which brings us nicely to the argument that has raged on since the start of website design; who is best placed to create the perfect site?

The Good, the bad and the ugly.

Let’s go back to basics and look at who the usual suspects are, in the red corner we have “visual designers” (brand and marketing) and in the blue corner we have “interaction designers” (user centred).

Whilst visual designers have a wealth of ability and passion, it is often focused to heavily on making something look good and the risk of making the same, beautiful creation completely unusable.

Now wheel in the interaction designers, who’s passions lie in the creation of the perfect experience, through usability testing, prototyping and more testing. However, there is a strong argument against all of this testing and refining as it can just blunt a sharp, creative idea, making the end result more function than form.

Experience is all, or read Experiential

For years I thought experiential was about experiencing a design, but it’s not it’s about experience, and this where soul comes from.

An experienced designer is passionate about the look and the effectiveness of a design and ensures their soul is applied to everything they do.

An excellent example of what not to do is a site we reviewed a while back that seemingly missed both design and ease of use steps during it’s development and almost certainly skipped public testing.

Help me help you

If you want to avoid the common pitfalls of digital procurement, ensuring your acgency has soul, then follow these easy steps:

• Check potential agencies have a proven user centred design methodology as well as a creative portfolio
• Ask for CVs of key staff and make sure they are guaranteed to be on the project
• Meet the team and chat to them about what they think is good and bad
• Don’t ever feel that it’s not your right to ask questions
• Ask for clarification on every point until it’s clear
• Remember you’re the client and paying the bills

If you would like to know more then give me a call or drop me a note and we’ll take you through our experiences and see how we can help.

global usability testing, information architecture, interface design, internet research, market research, usability design, user centred design, user interface Design, e-commerce, Internet, Mobile, research, usability

Would you buy one?

It’s been a mad year and next year is set to be even more crazy.

2009 has seen luxury good sales boom, e-commerce sites explode and the final mass adoption of digital video and e-ink.

Mobile internet has taken off thanks to Twitter, Facebook and the iPhone. Social has started to be more powerful than most could have hoped and TV has gone down hill so fast it’s breathtaking.

2009 retrospective

Early this year we predicted a few things that have happened, some clever and some obvious. BBC iPlayer has seen an amazing take up across the country and handled 70 million requests in October,  which is about 7 Petabytes of data or 12.5 Gigabytes per second.

Top 10 key changes in 2010

1. The end of free. Well at least as we know it owing to a drop in ad revenue and cold feet amongst media owners.
2. A new media monster. As the old guard struggle to reorganise, one or two new, media goliaths will take over, buying paid content from the old order and giving it out for free to meet the needs of us consumers.
3. Mobile web will overtake fixed line. For key content mobiles will become the only way to access key info, buy stuff and keep in touch.
4. Visualisation goes mainstream. With the increase in e-commerce traffic the only way to get your head around the numbers is to change your view. Being able to represent numbers in new, visual ways will be coming to a vendor near you soon.
5. The customer will become king. Crowds are causing even more trouble for corporates, as I type, Eurostar is suffering huge PR issues; surely it’s time to wake up to what your customers want?
6. Content strategy is the new usability. Too much emphasis has been placed on cool tech recently such as augmented reality, but these are just shiny bows on a box of rubbish. Clients and customers will wake up to the power of well organised content.
7. Data will kill UK networks. As the iPlayer shows, and to some extent the iPhone, when people get going, they really get going. Streaming video and large file transfers are going to carry on causing the biggest customer satisfaction issues as networks fail over the sheer volume of traffic.
8. No one will beat Apple. When it comes to technology that has completely changed the world, the iPhone is an amazing example, and no matter how hard people try (Palm) no one can get close.
9. e-ink will become the norm. We all love our Kindles, those who have them that is, and finally there is some competition, which means cheaper, better ebooks for all. Migrate newspapers from print to digital and you have a new outlet for old media. Shame about the latency of stories though.
10. Measure your customer’s empathy. Stats, conversion and marketing data standalone to offer a crutch, but only when you bring these together can you really measure how successful your business is. 2010 will see customer empathy ratings used as the standard metric for success.

We will have a review in the summer of 2010 and see what’s on, what’s not and what needs to be added.

customer insight, e-commerce, information architecture, market research, usability design future, Our news