Design considerations for touch screens – Part2

Pros and Cons of Touchscreens
The following overview lists advantages and disadvantages of touchscreens and summarizes their characteristics.

Touchscreen Pros
Direct: Direct pointing to objects, direct relationship between hand and cursor movement (distance, speed and direction), because the hand is moving on the same surface that the cursor is moving, manipulating objects on the screen is similar to manipulating them in the manual world

Fast (but less precise without pen)

Finger is usable, any pen is usable (usually no cable needed

No keyboard necessary for applications that need menu selections only -> saves desk space

Suited to: novices, applications for information retrieval, high-use environments

Touchscreen Cons
Low precision (finger): Imprecise positioning, possible problems with eye parallaxis (with pen, too),
the finger may be too large for accurate pointing with small objects -> a pen is more accurate.

Hand movements (if used with keyboard): Requires that users move the hand away from the keyboard; a stylus requires also hand movements to take up the pen.

Fatigue: Straining the arm muscles under heavy use (especially if the screen is placed vertically).

Sitting/Standing position: The user has to sit/stand close to the screen.

Dirt: The screen gets dirty from finger prints.

Screen coverage: The user's hand, the finger or the pen may obscure parts of the screen.

Activation: Usually direct activation of the selected function, when the screen is touched; there is no special "activation" button as with a light pen or a mouse.

This post is contributed by Mallikarjun

Read More

Design considerations for touch screens – Part1

Touchscreens - The Future
Touchscreens are operated as city guides, in museums, at POS (point-of-sale)stations or as kiosks(standalone advertising booths with user interaction) and now in the recent have made way into homes in the form of DPFs and Multimedia phones. Interaction has to be simple and fast as Users are often untrained. This calls for a screen and interaction design, which is considerably different from normal user
interface design.

Interaction
Touchscreens are operated with a finger or stylus. Therefore, they provide a very direct interaction - the most direct interaction that is possible on computers today. Touchscreens may be operated very fast for certain operations and require little or no training, if applications are designed adequately. For these reasons touchscreens have many uses, especially for untrained users. Many people believe that
touchscreens will replace keyboard and mouse in the future.

The Ultimate Judge is the User!
These preliminary design guidelines for touchscreens take the characteristics of touchscreens, their advantages and disadvantages, into account. Of course, these guidelines will be refined, as our experience with touchscreens grows. The ultimate judge, however, is the user. As ELO Touch Systems quote in their guidelines:

·Testing a touchscreen application on focus groups will disclose the areas that need improvement.
·If anyone pauses in confusion for even a moment, think how to improve the application.

Summary of Touchscreen Characteristics
·Speed: high
·Accuracy: low (finger), high (pen)
·Speed control: yes
·Continuous movement: yes
·Directness: direction, distance, speed
·Fatigue: high
·Footprint: no
·Best uses: point, select

Uses for Touchscreens
Best Suited to Applications Where...
·Opportunity for training is low
·Frequency of use is low
·Accurate positioning is not required
·Little or no text or numerical input is required
·Desk space is at a premium
·The environment may be chemically or otherwise "aggressive"

Not Suited to Applications...
·Requiring training/trained users
·With high-frequency use
·Requiring accuracy
·Requiring a lot of typing

Typical Touchscreen Systems
·Public information systems: Museums, city guides
·Kiosk systems: Advertising, product information
·Systems requiring pointing and selection only

Golden Rules
Speed: Make your application run fast. Speedy systems also reduce vandalism.
Intutiveness: Try to make the application intuitive.
Choices: Limit choices.
Guidance: Guide the user as much as possible.
Testing: Testing a touchscreen application on focus groups will disclose the areas that need improvement. If anyone pauses in confusion for even a moment, think how to improve the application.

This post is contributed by Mallikarjun

Read More

Applying Principles of Salsa Dancing into UX Design

Salsa, a popular Latin American dance, and UX design have a lot of elements in common . And designers can apply some of these principles into their process.

The most important aspect in salsa (or even ballroom dance) is getting the connection right between the dancers. Similarly, for a design to succeed, the designer has to connect with the end user- understand their mental models, predict how the user would navigate, consider the user’s likes and dislikes , and design appropriately. The designer cannot design a product just because s/he finds it cool or creative.

Good dance has well synchronized sequences. This is similar to the sequence of tasks a user does. Designers usually define scenarios to define how the product will be used. The smoother the sequence is, the better the end user experience.

Movements are building blocks to any dance, which define a sequence. Similarly, every interaction in a design defines how well the task can be completed.

Patterns of foot work, swivels and turns help be a better lead and a receptive follower. The designer also needs to understand patterns in usage of elements, problems faced by users and design in a way which would be well-received by user. Patterns in rhythm and beats set the overall mood on the dance floor. Similarly, the designer needs to consider current trends or ‘mood’ to create the appropriate designs.

Space and path (floor path) are important factors which defines how the dancers will traverse and the direction (such as forward, backward, sideways). Similarly, in a design users would traverse across the interface, and the designers need to make sure that the users traverse as smootly and elegantly as possible and complete their tasks easily. On the visual front, the designer needs to take care of both positive and negative spaces for the interface to work well.

Time (or tempo) in dance defines the speed of the dancer. Dance, music (unlike other forms of art like painting) incorporates linear time pattern, which means it moves through time and space. This is an important factor for designers too. Can the user complete a task in a short time? How long do I display a notification when the user receives a mail? And, how quickly should it fade away?

In Salsa , whether dancing with a partner or in a group, there’s always a lead. The lead always aims to provide concise lead with accuracy. The other/s follow the lead; yet they have their own style and movements. If the lead is difficult to follow, the partner stops partnering him. Hence, the lead must adapt to the partner’s skills (based on whether the partner is a novice or an intermediate dancer or an expert), the available space on the dance floor and change the lead appropriately. The designer is like this lead who leads users to perform a certain desired task by understanding the user’s strengths.

Finally, one would always love to dance again with the same person if they had a good experience dancing with him/her. Just like how we designers need to ensure we have repeat users for our products!
So ensure a good ‘dance’ for your users!



Thanks to Afshan and Sannidhya for putting on their editorial hats and reviewing the draft.

Read More

How will it splash in future?

When we start an application, we are greeted by a splash screen. The splash screen lets us know the software we are about to open – it’s name, version, copyright information, the people involved in developing the software, loading status, etc.
The splash screens have undergone tremendous changes in terms of graphic design. A classic example is Photoshop, a tool we designers use often. Below are some examples of it's changes over the years.


The earliest splash screen - single color, single font.


As the resolution of screens increased, so did their graphics. The splash screens introduced color and visualized the product’s features.









The rectangular splash screen changed to free-form shape, going beyond the rectangle box.

However, the information displayed in splash screens over the years has undergone very minimal change. The splash screens were ideal when computers were slow and took time to start an application. But with faster computers, which take less than 5 seconds to start an application, how will user be able to view this information in future? Or do users ever read this information everytime?

Few softwares introduced the startup (welcome) screen, which helped user to pick the task he wanted to do easily, immediately after the splash screen disappeared (as shown below).

In this scenario, do we need splash screens at all? Can splash screens do more than just displaying copyright, license information, loading progress?

With applications increasingly becoming suggestive, it’s more appropriate to merge splash screens with the startup screens. Merging them can help user to decide the task s/he wants to perform in few seconds as well as display the information about the software. While the application is loading in the background, user can decide and click on the selected option (eg: decide to open a new template) and begin their tasks right away after the application has loaded.

The splash screen can also me made social wherein it can have the following:

• RSS feeds
• Link to social networking tools like facebook on what others are talking about the software or share a new technique or tips
• Ratings on software's features
• Appropriate links for collaborative work, where two persons can edit the file at the same time

Ideally, the splash screen can have the information as shown below:

Reference:
Images of Photoshop splash screens: http://www.guidebookgallery.org/splashes/photoshop

Thanks to:
Danny Aldo, Vinay Dixit, Afshan Kirmani & Anshuman Singh for reviewing my draft work and providing relevant suggestions

Read More

Communication Design for Business Intelligence

Users feel that reports are generally overloaded with information. Our understanding on the users’ behavior and mental models helps to reduce the information load and display the information in a reporting tool with optimized presentation.

The following are the usability aspects that need to be taken into account while designing information for a Business Intelligence tool.

1. Efficient & Effective Search Functionality

There could be myriad reports and data to be accessed frequently by the users and the navigation through menus, sub-menus or links could be cumbersome. For faster retrieval of reports the search functionality should be effective and efficient with the following features:



Natural Language Search:

The search component should be able to recognize the regular spoken language typed in by users in addition to keywords. This will give a human touch to the business intelligence tool. An example is shown below:

Auto Suggest:

‘Auto Suggest’ can be used in Search functionality to provide a rich user experience while searching for specific information with a keyword. A sample illustration is provided below.





Categorization in Search Results:

The search results should be clearly categorized for the users to differentiate the kind the data from images, reports etc.



Basic and Advanced Search:

The users should have the ability to use the search as per their convenience. Users who frequently access the business intelligence for reports can have options to view on a daily or weekly basis. Those users, who use the system less frequently, have advanced search options to narrow down their search results to an old report.

Basic Search:





Advanced Search:





Save Search Criteria:

For users who use a search criteria frequently an option to save that search criteria will be useful by removing the reoccurring task of working on the fields.

2. Faceted Organizing

Instead of forcing one way to retrieve reports, faceted organizing allows users to view or find a report in any way they want, with more flexible and dynamic categorization schemes. This helps in the following:

Directory Navigation:

In each step the number of categories is reduced by one





Faceted Search:

Instead of searching by a keyword, the users narrow down the search results matching the characteristics of reports. An illustration depicting faceted search is shown below:

3. Information Design & Graphical Representation

Providing visual cues will help users understand most complex data with ease and with an experience of having fun at work. There should not be a feeling that the task displayed is some agenda that is being thrust upon.

4. Inverted Pyramid Content Design

The best practice of inverted pyramid writing technique can be used for reports with a slight variation. The most important information needs to be provided at the top lines to the user. This will reduce the time taken for a user in going through the entire content of information as opposed to getting the crux of the report with a cursory look.

5. Progressive Disclosure

Progressive disclosure is a trick used by the information architects to design the information architecture in such a manner where additional content is revealed only on an action by the user. An example is shown below where the detailed information of deployable are shown in Level 2

6. Personalization & Prioritization

Everyone’s need for information varies and depend on his/her interests. Thus it is difficult to determine what a user wants from the sea of information that is out there in the business intelligence tool. Information overflow and spamming are definitely unappreciated.

Ability to personalize and prioritize the user interface, inform of dashboard or the user’s secured home page will allow the user to modify the screen based on his/her requirement and need.

7. Derivation of Action

The use of dashboard and reports are not only to display information but also to proactively inform or initiate an action which requires immediate attention. Example: Alerts

8. Exploratory User Interface

To help users to learn by doing, an exploratory approach should be used to design the Business Intelligence tool. This also helps in rectifying the need for help documentation, demos and FAQs and ensures a zero learning curve.

9. Accessibility

It’s also important to make the information accessible for everyone by adhering to accessibility guidelines. MindTree will test the tool for accessibility aiming to analyze the content, layout, navigation, graphics, etc. to ensure that the interface can be used by:

The differently abled

The visually impaired

The Aged

10. Business Intelligence As A Social Tool

We respect users’ privacy but at the same time, we are users’ are becoming more social. The business intelligence tool can now move from just searching reports, displaying dashboards to creating relationships, storytelling, creating and sharing opinions that has influenced decision making practices in general.

Reviews: Peer reviews are greatly influencing learning and decision making in users’ daily lives.

Mobile Access: Portables can be accessed on different mediums, anywhere.

Communication: Interacting and sharing through various mediums or multi-channels.

Collaboration: Allow users to collaborate in report generation and in creating a single document.

Reference:

On Faceted Navigation

http://www.welie.com/patterns/showPattern.php?patternID=faceted-navigation

http://well-formed-data.net/archives/274/mace-portal-update

Thanks to:

Anshuman Singh & Afshan Kirmani for reviewing my draft work

Madheswaran Periasamy for sharing the illustration used for Auto Suggest

Hetna Naik for pointers to Social Tool, Personalization & Prioritization

Baizal Jacob for his thoughts on Derivation of Action

Read More

Swipe To Type

Swype is a patented technology that provides a faster and an intuitive way to input text on touchscreen devices. With one continuous finger or stylus motion across the keyboard users can enter text at over 30-40 words per minute. The technology can run on small screen mobile devices as well as large multi-touch LCD panels.



“QUICK”

In the image above, the word “quick” was generated by tracing the path that roughly aims to pass through the letters of the word.

The user need not be very accurate with motion in order to get right text entry. In fact, the spacebar is made redundant while Swype automatically appends space before each word. The software is equipped with fairly advanced input path analyzer and a word matching search engine along with a 65,000 words learning dictionary. Swype is aiming at supporting multiple languages to penetrate deeper into the international market.

While all this is exciting, some reviews suggest that users are unable to connect with the new data entry pattern intuitively. In case of typing repeat words, users try to remember the exact path. This is even more difficult in case of long words. Existing thumbpad pattern of data entry seems to work better because of its high affordance.

It is indeed a paradigm shift in computing and data entry methods that are in use since computer’s inception. Therefore, one will have to wait to see how the technology can bridge the learning curve and gain user and social acceptance when it makes a commercial entry into the mainstream touchscreen device market.

Read More

Tree based navigation

Trees are usually used to navigate hierarchical pieces of information (Country > Province > City) or to organise information so that retrieval is easy (list of interior design books under architecture books)

While they are commonly used, Tree structures usually don't work well for cases where user's don't know the location precisely i.e. when they are browsing

1. For example, if you know the name of a Prof. but not sure which Department he is in, you will keep looking within a Tree Structure.
   
   
2. It works well for things which you know well. For example if you are looking for Specifications for Maruti 800 car tyre specifications. You know you will go via Car > Suzuki > Maruti > 800 > Tyre
   
   
3. These may not work for deep-information structures with similar first-level categories. This is because the first wrong choice will lead you down a complete wrong path.

Read More