Category — Wireframe Programs

What is parallel design and how does it relate to user interface design?

Parallel design is a useful method when undertaking a user interface design project, or any other creative process for that matter. The basic concept is to accumulate as many ideas as possible and then to take the best ones and synthesize them into better concepts of user interface designs. In many ways evolution is synonymous with the process as a natural selection of ideas occurs with the best ideas cannibalizing on others to emerge as the apex predators of the ideas ecosystem. Parallel design in effect thrives on the input of user interface designers as it requires a stream of ideas. The freedom and impetus to be as creative as possible can be a very liberating way of creating user interface designs.

How to create UI designs through the parallel design process

To further accentuate the generation of ideas a team of user interface designers is further split up into subgroups that brainstorm independently. Wireframing tools are great in this regard as they allow user interface designers to quickly sketch UI designs. Online wireframe tools that create clickable wireframes even further add to the convenience of creating wireframes. The user interface design groups are encouraged not to discuss their UI designs or show any wireframes  thereof until a workshop is held. At this point the UI design teams showcase their wireframes and use the best ideas to create a better user interface design. This process is repeated in cycles (it is recommended to go through at least four of these cycles) until the general user interface design is achieved. As the English say ‘the proof of the pudding is in the eating’ and the pudding of parallel design is repetition and collaboration. In the 2nd part of this blog I shall look at the benefits and drawbacks of parallel design when creating user interface designs.

Purpose of Corporate Blogs

Corporate blogs are a great tool for companies to keep their customers (as well as the greater public) in the loop and increase customer loyalty.
Corporate blogs are blogs with very specific purposes that can be divided into the following categories:

•    Communication: Corporate blogs should be used to communicate with customers and the public; this is the most significant reason for companies to have corporate blogs.  Corporate blogs provide customers and/or the public with direct lines of communication to the company’s employees or even executives, thus empowering customers, leaving them feeling like valued stakeholders.  Conversely, executives and employees also value interaction with customers so corporate blogs are an effective and valuable tool for both sides.

•    Marketing Products and Services: Corporate blogs are also an excellent way to advertise new products and services.  Companies can also obtain valuable customer/user feedback about new products which can help them improve their offers for the future.

•    Maintaining Reputation: Corporate blogs can also help companies maintain or improve their reputation within the public sphere because they can be marketed as the only reliable source for accurate information about a company or venture.  This is especially important with so many other unverified sources floating around on the internet.

Corporate blogs are not the same as traditional blogs.  Traditional blogs are usually maintained by individuals or groups as a way of sharing their thoughts, ideas, advice, and experience.  Corporate blogs are a part of business and as such their purpose is different.  Maintaining a corporate blog is an excellent way to make a business not only more visible, but also more successful.

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

How to conduct the Affinity diagramming process

During the planning phase of the Affinity diagramming process, one should first gather a team of four to six people. Preferably, the group should be as eclectic and diverse (but also relevant) as possible so as to ensure the delivery of as wide a group of ideas as possible. As far as time is concerned, it is optimal to set aside at least, preferably, two hours. You should encourage team members to go for their gut reactions and not spend too much time agonizing over sorting. One of the goals of Affinitization is to reach a consensus so that disagreements can be handled simply. If a team member doesn’t like where an idea is grouped, he or she simply moves it. If consensus is not reached then make a duplicate card of the idea and place a copy in each group. Moving ideas at will without talking encourages unconventional thinking while simultaneously discouraging semantic battles. Here below are the steps to follow during the affinitization process:

1.    Generate ideas – This is where the team brainstorms a list of ideas and writes them down on separate post-it-notes (or some other form of cards).

2.    Display ideas – Post the ideas randomly on a wall, board, table, flip chart paper or other surface.

3.    Sort ideas into related groups – Ask the participants to silently sort idea cards into groupings. This can be done by first looking at two ideas that may seem related
in some way and placing them together in a column off to one side. Then other ideas that seem related to those set aside can be added to that group. Other ideas that are related to each other are also placed into a group. This process is repeated until the team has placed all of the ideas in groups. Ideas that don’t fit in any group shouldn’t be forced into a group. They don’t belong but should stand on their own. Create sub-groups where necessary.

4.    Create header cards – Each group needs its own header card, which concisely describes what each group represents. These should be meaningful enough without having to resort to the contents of their group. Create sub-header cards for sub-groups if necessary.

5.    Draw the Affinity Diagram – Place header cards at the top and corresponding ideas below. Draw lines connecting the headers, sub-headers, and groups. Connect groups that are related too. The resulting diagram should look like a typical organizational chart of a firm.

A great practical application of Affinity Diagrams is to help organize notes and data derived from usability testing of wireframe prototypes of a user interface design. This visual tool aids the whole interface design process by making it easier and faster to make sense of the data collected while gathering requirements and conducting usability tests.

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.