Category — Wireframe Tools

This blog post is the second in a series of two about Contextual Design as a usability method.

The Contextual Design sequence

In the first post on Contextual Design we clarified what Contextual Design is and why it is important for creating usable UIs.  Now it is vital that we discuss how the Contextual Design process occurs. Contextual Design is a process that happens sequentially in the following hierarchical steps: Contextual Inquiry, Interpretation, Data Consolidation, Visioning/Storyboarding, User Environment Design, and Prototyping. Each of these steps is equally important in contributing to the synergy of the Contextual Design process and buttresses the resultant user interface design in a positive user experience.

•    Contextual Inquiry:  Contextual Inquiry is the crux of Contextual Design. It is used to reveal what people actually do and why they do it that way. Contextual Inquiry happens at the very beginning of the design process and calls for one-on-one field interviews observing subjects in their natural working or living environment doing what they would normally be doing.
•    Interpretation: The interpretation phase is when the data from all the interviews is analyzed and detailed work models are created in order to ascertain context of use and aspects of work that matter for the user interface design team. What matters here is looking at the interviews from a macro birds-eye-view level for key insights across the board.
•    Data Consolidation: Data consolidation is the level at which individual interviews are analyzed. An example of a good method of processing observations from a bottom-up design approach (piecing together systems to give rise to grander systems) for data consolidation purposes is by making affinity diagrams.
•    Visioning/Storyboarding: Visioning is akin to brainstorming, but distinctly it is the gathering of a cross-functional team in order to create stories or visions of how new product concepts, services, and technology can better support a user in accomplishing her tasks. After determining key issues and opportunities from the consolidated data, the visioning team sets out to generate new concepts by way of scenarios of use. These visions are then fleshed out further through the use of Storyboarding.
•    User Environment Design: User Environment Design is the stage of Contextual Design whereby the stories created begin to become more refined in terms of product and system requirements. What are the different parts of the system? What functions are available in each part? How do all these components support and enhance a user’s work?  Where in the user interface design scheme should they be integrated? User Environment Design seeks to answer these questions.
•    Prototyping: Prototyping is an efficient way of creating preliminary partially functional UIs that can be used to test the structure of a User Environment Design for usability issues. But prototyping is also great as a communication tool for stakeholders of a project to flesh out user interface design ideas. Prototyping can be done through the use of paper prototypes (hand drawn or printed out) or, better yet, through interactive wireframe prototypes.

Performing these steps is an art of itself but can be immensely helpful in creating superior UI designs.

Desirability and usability as a design team

According to John Soellner’s article “Design, Usability, Desirability, What’s The Difference?” desirability design is “about expanding on the idea of what human factors are” in order to better understand what drives users to employ interfaces based on their interest level and personal satisfaction.  Desirability can be functional and emotional.  Functional desirability is almost interchangeable with usability in that it means users desire to use a site because it is usable and well organized.  Emotional desirability breaks away from usability because it seeks to understand a user’s emotional reaction to the aesthetics of a user interface: the look, feel, and even the content.  Emotional desirability concerns itself with the intangibles and emotional human factors that Soellner refers to above.

Desirability works well in tandem with usability because it measures the intangible aspects of user experience such as fun and enjoyment, aspects that usability itself usually cannot address.  Desirability helps designers discern whether or not their user interface is enticing enough for users to want to employ, reaching beyond whether or not it is easy and functional enough for users to want to use.  “Desirability design techniques supply the X Factor which motivates users to make usability matter” says Soellner.

This blog post is the second in a series of two about Human Computer Interaction (HCI)

Principles of User Interface Design for HCI systems

Since I am looking at HCI relative to interface design, it is important to underline how to improve the quality of user interface designs.  Thus, as interface designer one should be mindful of the principles of user interface design. According to Larry Constantine and Lucy Lockwood, these are:

1.    The structure principle – This is concerned with the overall user interface architecture and layout. An interface design should be organized in a way that is clear, apparent and intuitive to users. In other words similar things should somewhat resemble each other. For example, toolbar buttons should all look like toolbar buttons.

2.    The simplicity principle – The interface design should make simple, common tasks easy, communicating clearly and simply in the user’s own language. For example a search bar with the word ‘Search’ is usually better than the convoluted ‘Quick Keyword Search’.

3.    The visibility principle – All the options and tools needed to accomplish given tasks should be visible and easily accessible on the interface design without distracting the user with redundant information.

4.    The feedback principle – A good interface design should keep users informed of actions or interpretations, changes of condition or errors that are relevant through clear and concise language. This helps users feel in control of the process by being aware of their actions.

5.    The tolerance principle – The interface design should be able to accommodate a certain amount of failure from users (users, just like interface designers, are not infallible). A wrong click or some such other should be rectifiable. Undo and redo features that allow users to effectively time-travel through their steps are a good example of this principle.

6.    The reuse principle – An interface design should reuse internal and external components and behaviors, maintaining consistency with purpose rather than merely arbitrary consistency, thus reducing the need for users to rethink and remember. This is also referred to as the memorability of an interface design.

How to ensure that User Interface Design principles lead to optimal HCI systems

To ensure that these principles guide the interface design process and lead to optimal HCI systems, the use of wireframe tools can be useful. Often, the large number of stakeholders with various levels of technical expertise in the design process requires the use of such tools for visualizing requirements and concepts. Tools suitable for wireframing, such as Pidoco, a cloud-based rapid prototyping tool that works through a browser, allows interface designers to create wireframe prototypes of graphical user interfaces with simple drag and drop handling without the need for any programming. Interface designers can use this system to collaborate within a team through the cloud and get feedback from sharing prototypes, even going as far as conducting remote usability testing. This type of approach makes optimizing human computer interaction much simpler and safer and leads to more reliable results.

This blog post is the second in a series of two about accessibility design as a usability method

The aims of accessibility design

Accessibility design is specifically targeted at designing user interfaces that assist people with various disabilities.  The needs relative to disabilities that accessibility design specifically addresses include the following four categories:

•    Auditory: Creating interface designs that are user friendly for those who have hearing impairments.
•    Cognitive/Intellectual: Creating interface designs that are user friendly for those with developmental disabilities such as dyslexia or cognitive disabilities that affect memory, attention, developmental maturity, logic and problem solving skills etc.
•    Motor/Mobility: Creating interface designs that are user friendly for those with difficulty or inability to use their hands (people with Parkinson’s disease etc.)
•    Visual: Creating interface designs for people with various visual impairments.

Why is accessibility design an important usability method?

Aside from the egalitarian implications, accessibility design is crucial to usability because it creates an interface design that can attract an even wider range of users and thus ensure more success for the website.  There are many users who are disabled and if a website is not designed with them in mind, they will not be able to use it.  This can be especially dangerous in the context of e-government where equal access is a must. It can also help to integrate accessibility design into the web development process because in addition to diversifying the number of users, it also makes for a development process that is suffuse with simplicity, as designers must find way to create a site that is universally usable for users of all abilities, thus diminishing their ability to create user interface designs that are too convoluted or contrived.

In this blog post, inspired by a German blog by Christian Seifert, I shall look at some of the interface design challenges that interface designers encounter when porting a website over to its Chinese version.

One of the very first things to consider is the text. In Chinese, the text length differs dramatically.  Chinese text takes up far less space than the Western script. This means you may have to rearrange parts of your interface design layout. So expect your translated text to do much more with much less on your interface design.

Furthermore, the calligraphy can be read in any direction but the familiar Western layout of horizontal rows from left to right, read from the top of the page to the bottom, has become more popular.  Nevertheless, it may not suffice to translate the text of your website into one Chinese version. In order for your interface design to succeed in China, a localization and adaptation to the expectations of Chinese users is required.

The images will also have to be different to reflect the Chinese market. Websites in China tend to be more colorful than those in Europe or North America. Bright, cartoony colors abound on Chinese websites. So, be sure not to simply retain the “Western” interface design asthetics, but rather do some research on the perceptions held by Chinese users. Utilizing usability tests may be a powerful avenue.

Interface designers would do well to follow Chinese design conventions. An example of this is with Yahoo. To a European-language speaking eye, the Chinese version of Yahoo looks very noisy and busy. In addition, a European reader may find the contrast of colors within the interface design astonishing. Yet, this style is customary in Chinese websites and will have to be emulated in your interface design to appease a Chinese audience.

In addition to the purely software-related factors, you need to consider the technological environment in which your Chinese website will be used. One important example is that your interface design should be optimized for Internet Explorer which is far and away the most popular browser in China.

Besides interface design concerns, other things to consider include hosting your website on local servers in china to ensure faster access. As far as search engine optimization goes Baidu.cn’s 62% market share dwarfs Google’s so you can’t afford to overlook it. Furthermore, websites ending with a .cn domain name are ranked higher on Chinese websites.

As is true so often in multi-cultural contexts, whenever in doubt, you may consider involving experts, both in questions of porting the website into Chinese and testing its usability with Chinese users.

In part 2 of this blog post on context of use I shall look more intricately into the relationship between context of use analysis and user interface design.

Context of use analysis and user interface design

The importance of understanding the context of use when producing successful interface designs has lead to the creation of a usability method called context of use analysis that is commonly used by interaction designers and interface designers. Analysis is arrived at via a brainstorming methodology in order to devise successful usability tests during the development process of a website or application. Successful user interface design requires the analysis of user experience feedback in order to create a user interface characterized by optimal usability. However, collecting meaningful user experience feedback and interpreting it is not always simple, especially when interface designers lack a solid methodology or have not thoroughly thought through their usability tests.

The name of the game here is to be well prepared. Being able to define a site’s target users or knowing what kinds of tasks they will need to perform and what types of goals they want to achieve through the interface design is key. When interface designers are unclear about these salient usability test questions, creating a test that is realistic and relevant and results in meaningful knowledge about the new interface design concept becomes difficult. Without knowing about the context of use, interface designers run the risk of creating interface designs that do not satisfy the requirements dictated by the way the products will be used in a real-life context.  The resulting interface designs are often not sufficiently usable. This is why context of use analysis is a crucial usability method: it allows designers to create tests based on predetermined context-specific user needs and performance paradigms. Thus, designers not only learn what user experience feedback to elicit and how, but also have a framework to interpret the feedback in order to create a solid interface design that works for the user.

Why is context of use analysis a vital usability strategy?

When developing a website or application interface designers need to uncover crucial usability “probe” questions that speak to the usability heart of the matter. These questions seek to ascertain valuable information and insight that may not yet have been thought of by the interface designers. These questions, often derived through collaborative brainstorming sessions, help interface designers to tackle critical usability issues head-on when they design and distribute their usability tests. The deeper understanding of the design of a system relative to the context within which it is used can be a vital contribution in saving time and money during the testing and development process. It can also lead to significantly more successful products.

Other top stories appear in the top right for easy access followed by the most popular stories on the website. This is really great for people to have access to them without even visiting the main page (particularly if they just opened a direct link to the story). Below each story are related stories as well as more on the story from other news sources. The video player is now bigger and has better quality video. Previously, video was squeezed in the middle with the navigation on the left and other video suggestions on the right. The new video page now has a wide range of video, also classified under the different sections of the website.

All these changes to the interface design show that the BBC is aware of the importance of usability and is keeping a close watch on interface design practices of its competitors. With the new layout it may be on to a winner.

What are the drawbacks of imitating the desktop interface design?
Despite all the advantages, a drawback that I found with the interface design was that I found myself at times trying to use the same keyboard shortcuts etc. that I would use on a Mac to manipulate the various apps on Kohive. But instead of manipulating Kohive functions, I was affecting native apps on my desktop. An example of this was when I had various apps open in Kohive that cluttered the interface. I would inadvertently enable the Exposé feature which allows a user to quickly locate an open window, or to hide all windows and show the desktop without the need to click through many windows to find a specific target. However this applied to my desktop and still left the Kohive interface design as cluttered as before. Despite drawbacks such as these I find that this interface design scheme is very promising.

Seeing is believing

However, general good will and cooperation among team members is not the only reason all stakeholders should be involved in the usability testing process.  According to Jakob Nielsen, the main reason to involve all stake holders is because seeing is believing.  For example, if you are designing an interface design for a corporation you want all stakeholders to share in the usability process so that they can see the results you have.  Remember, stakeholder literally means someone holds a share in the company, and that means they hold a stock, an interest, in the work you produce as a usability tester.  If you involve them in your work and let them directly see your results they are more likely to allow you to proceed with your design based on mutual agreements that your results are valid.  In addition, if your interface design is a bomb because your usability test results weren’t as reliable as you thought, you will have less of the burden of blame because your results were originally approved by all stakeholders.  So, in short, if you are an interface or interaction designer running usability tests, make sure everyone in your company is involved in the process.  It can only be good for the interface design, for the end users, for the team – and for you.

This blog post is the second in a series of two about usability and interface design

User centered design and usability

Usability as one of the main goals of the user interface design process benefits not only from usability testing, but also from employing other methods of user centered design. User centered design allows designers to set realistic goals and objectives for the design of a user interface that balance the needs and limitations of the end user with the needs and goals of the designer or the organization employing the software application. User centered design tools can assist in the creation of user interfaces that are rooted in how users can, want, or need to work, instead of forcing the users to change how they work to accommodate the approach taken by the software developer. In order to achieve this goal, designers should make the needs of the user the central guiding force throughout each step of the interface design process:
•    Website / application planning
•    Content creation
•    Prototyping
•    Usability testing
•    Collecting user experience feedback

The benefits of employing the user centered design method are manifold because not only can you increase the popularity of a website of program, but you can also cut costs by developing applications that are successful on the first try.

Don’t make me think!

Many users encounter problems with interface designs because web developers lose sight of the importance of simplicity during the development process. Interface designs often become convoluted and complex, ultimately requiring too much time and energy output from the user in order to understand and navigate a system. Steve Krug, author of „ Don’t make me think: a common sense approach to usability“, has an excellent usability mantra: „Don’t make me think!“. According to Krug, this motto is the first law of usability. If you want a web site to be successful then you have to make sure your users find it so easy to use that they literally don’t have to think. This often means that designers have to think even more during the interface design process. Ensuring great usability in an interface design can be a very complex process, especially when the tasks to be accomplished with the application are complex. But the effort is worth it, since usable applications tend to be much more successful than those that require users to think about them too much. Not having to think – that is how you know your interface design has reached the level of usability required for success.