This is a rediscovery of "Accessibility" in the world of touch-screens and other natural interfaces. With new technology innovation the lines between accessibility technology and Technology for Mass are getting blurred. What used to be a special need is becoming a general need for mass use.Situational Disabilities Use-cases are defining the new age devices, wearable & smart interfaces. High time we need to rediscover on "accessibility" what we think we have already discovered!

Rediscovering Accessibility for Future Tech!

This is a rediscovery of “Accessibility” in the world of touch-screens and other natural interfaces. With new technology innovation the lines between accessibility technology and Technology for Mass are getting blurred. What used to be a special need is becoming a general need for mass use.Situational Disabilities Use-cases are defining the new age devices, wearable & smart interfaces.

High time we need to rediscover on “accessibility” what we think we have already discovered!

Advertisements

Linearity Matters: Rethinking eCommerce UI

“Linearity” plays a strong role when it comes to usability of any e-commerce checkout. Many theories supporting this concept have been proved by numerous statistics. UX sites which talks about the best practices to follow while designing the checkout process, always advocate maintaining linearity. It’s make sense when we see multiple principles in human factors indicate that in most of the time when users are “walking on the path” in a multi-step process they want to move forward. But only designing the checkout process is not enough, as from the views of typical goal oriented design, the whole experience of shopping starts with user’s objective to “find something that might influence him enough to buy”where the whole experience is a flow-state which maps to the mental model of the user where “finding” and “buying” are the major component of buying. The former being the “cause” and the latter being the “effect”, the design of the experience should always be linear in order to avoid the situation where the user is distracted by something else to break that state.

If users think of your multi-step process as a straight path, then the sequence of your views must be linear else you will break people’s expectations that will result into a bad experience and usability.

Traversing from user needs the towards the task flow

“I need” –> “I buy”–> checkout

is equivalent to

“I need” –> “I find it ” –> “I buy”–> checkout

is equivalent to

“I need” –> “I browse for it ” –> “I search for it ” –> “I buy” –> checkout

is equivalent to

“I need” –> “I browse for it ” –> “I search for it ” –> I compare –> “I buy” –> checkout

There are two major task clusters now:

1. “I need” –> “I browse for it ” –> “I search for it ” –> I compare –> “I buy”

2. “checkout”

Note the goal stating “I buy”, is the logical point that is represented by the behaviour of the user through the act of “adding to basket/cart”

Meanwhile the act of comparison of the products can be spanned from what is in the browsable and searchable views and what is already existing in the cart (which the user has added to the card already through a previous loop in this category of task). It is similar to the way that you might have added a deodorant “Old Spice” to the cart and suddenly decided to go for an “Axe” that offers 10% extra in the same price (Note that the user’s mind wanders 30% of time). So it helps to allow the user to be in the loop with in the first task group and then jump to the checkout while making the transition to checkout seamless. In order to achieve, the more the mental model matches to the conceptual one and indicate the user’s state in the flow and encouraging him through “progression” in the linearity path.

Here is a sample flow that takes the benefit of the linearity as a part of the process for the experience that covers the pre-checkout and checkout process to complete the flow state.

The target of the solution is primarily a tablet, which is acting as a catalyst as being a touch enabled swipe gesture controlled device it provides the user the effortless approach to move between the “browse/Search” <–> Cart <–> Checkout , once he has reached the entry point to the system.

Explore the complete project at
https://www.behance.net/gallery/19044315/Flip-the-Cart-Reimagining-Social-Commerce

(c) 2014, Samir Dash. All rights reserved.

Engineering and Design Processes: Usability Engineering vs. Usability Design

Usability Engineering

Usability Engineering began to emerge as a distinct set of “professional practice” in the mid- to late 1980s. The majority of the professionals of this practices were from varied backgrounds such as  Computer Science or in a sub-field of Psychology such as Perception, Cognition or Human Factors. Today this field is being populated from some newer discipline such as  Cognitive Science  and  Human-Computer Interaction.

Usability engineering, is defined by Preece as

 ‘an approach to system design in which levels of usability are specified and defined quantitatively in advance, and the system is engineered towards these measures, which are known as metrics.’

The whole concept of Usability Engineering focuses on the “metrics for measuring usability”.

As the emphasis on usability metrics through “analysis and evaluation”is mostly the soul focus of this process, there is not enough focus on the actual design process. In this process the usability is tried to be attained through “engineering and quantifiable methods and techniques” rather than “designing the way to usability”.

Also the “usability engineering”focuses only on providing range of techniques to analyze users, specify usability goals, evaluate designs,  but it does not address the whole development process.It has more of a focus on “assessing and making recommendations to improve usability than it does on design, though Usability Engineers may still engage in design to some extent, particularly design of wire-frames or other prototypes”.

The usability engineering mostly seen as a separate activity that can be plugged into different SDLC models as a separate set of activities  from a process-oriented perspective.

The Usability Engineering conducts evaluations through the following tools and methodologies:

  1. usability testing
  2. interviews
  3. focus groups
  4. questionnaires/surveys
  5. cognitive walkthroughs
  6. heuristic evaluations
  7. RITE method
  8. cognitive task analysis
  9. contextual inquiry
  10. Think aloud protocol

User-Centered Systems Design (UCSD)

User-Centered Systems Design (UCDS) is set of “usability design” process focusing on usability throughout “the entire development process and further throughout the system life cycle”. It is based on the following key principle:

  1. User focus: The goals of the activity, the work domain or context of use, the users’ goals, tasksand needs should control the development.
  2. Active user involvement: Representative users should actively participate, early and continuously throughout the entire development process and throughout the system life cycle.
  3. Evolutionary systems development: The systems development should be both iterative and incremental.
  4. Simple design representations: The design must be represented in such ways that it can be easily understood by users and all other stakeholders.
  5. Prototyping: Early and continuously, prototypes should be used to visualize and evaluate ideas and design solutions in cooperation with the users.
  6. Evaluate use in context: Baseline usability goals and design criteria should control the development.
  7. Explicit and conscious design activities: The development process should contain dedicated design activities.
  8. A professional attitude: The development process should be conducted by effective multidisciplinary teams.
  9. Usability champion: Usability experts should be involved from the start of project to the very end.
  10. Holistic design: All aspects that influence the future use situation should be developed in parallel.
  11. Process customization: TheUCSDprocessmust be specified, adapted and implemented locally ineach organization. Usability cannot be achieved without a user-centered process. There is, however,no one-size-fits-all process.
  12. A user-centered attitude must be established: UCSD requires a user-centered attitude throughout theproject team, the development organization and the client organization.

 

UCSD_processcyscle

The typical process flow of UCSD can be visualized as the following steps (based on ISO/TR 18529:2000):

  1. Pre-study and business analysis: It  can be anything from a comprehensive analysis of work procedures, business processes, etc., to a brief statement or vision.

 

  1. Planning the user-centered systems design process: includes setting up the project with resources, activities, roles, methods, etc.

 

  1. Do iterative UCSD /Usability DesignActivities: The usability design process approximately.

 

  1. Formal Summative Evaluation: It covers the usability of the resulting system, as opposed to the formative evaluations used in the usability design process to learn about details in the design .

 

  1. Introduce and Operate the System:  includes installation, change management, user training, evaluating long-term effects and so forth.

 

The focus of UCDS is all about “changing the attitude among all professionals involved in the software development process” and these set of 10 principles are key for the “user-centered systems design process” which helps in giving “equal weight to interaction design, analysis and evaluation, combining interaction design, and usability engineering”.

 

 

Usability Design

The Usability Design is roughly a subset of the UCSD process that matches the “Do Iterative UCSD” step of the UCSD process.

usability_design

 Further study

 

The usability design outlines the steps in the development process involving usability design aspects. The process can be divided into three main phases:

  1. Requirements analysis: This step is synonymous with planning and analysis phase of typical software development life cycle(SDLC).
  2. Growing software with iterative design: This is the design and testing phase and development phase of typical SDLC.
  3. Deployment: This is same as deployment phase of typical SDLC.

 

https://samirshomepage.wordpress.com/2013/09/23/dont-get-confused-ucd-vs-ucsd/ 

 

(c) 2012-14, Samir  Dash

 

 

Don’t get Confused: UCD vs UCSD

In my last posts I discussed about Usability Design and User-Centered Design (UCD) and User-Centered Systems Design (UCSD). But many confuse between these two.  So in the following I am trying to differentiate these two:

UCD vs UCSD

UCD is differs from the UCSD in the following areas:

  1. Goal: The goal of UCSD is more on the process than the user so as to make the final product/system more usable. UCD rather focuses more on “users” of the product and not the design process. More focus is spent on understanding the user and their need.
  2. Process vs. Techniques Set: UCSD is about system development where as UCD is mostly a set of tecniques and process sets to be used with in UCSD 
  3. Perception: The DNA of UCSD is about changing the mindset of the professionals in the development process so that the designing aspect of usability can be put into practice freely and with higher priority. The UCD process is not about the changing perception about the priority of the design in the whole process.
  4. Broadness: UCSD covers the whole process that includes the areas which are even not part of “designing” whereas UCD can be seen as a subset of UCSD focusing of the “design process sets”.

UCD Models and Process

There 3 different models that support UCD in varying degrees and follow the ISO standard Human-Centred Design for interactive systems:

  1. Cooperative Design: This involves designers and users on an equal footing.
  2. Participatory Design (PD): Inspired by Cooperative Design, focusing on the participation of users
  3. Contextual Design:  “Customer-Centered Design” in the actual context, including some ideas from Participatory Design.

All these UCD models involve more or less a set of activities grouped into the following steps  mentioned below:

  1. Planning: in this stage the UCD process is planned and if needed customized. It involves  understanding the business needs and setting up the goals and objectives of the UX activities.  Also forming  the right team for the UX needs and if needed hiring specialties fall into this step.
  2. User data collection and analysis: This step involves data collection through different applicable methodologies such as user interviews, developing personas, conducting scenarios , user-cases and user stories analysis, setting up measurable goals.
  3. Designing and Prototyping : This involves activities like card sorting, conducting IA, wire framing and developing prototyping.
  4. Content writing: this  involves content refinement and writing for web and similar activities.
  5. Usability testing: This involves is a set of activities  of conducting tests and heuristic evaluations and reporting to allow refinement to the product. However Usability Testing can have its set of steps involving similar activities such as planning , Team forming, testing , review and data analysis and reporting.

All these are similar to most of the steps that fall under Usability Design as UCD can be seen as a subset of process with in Usability Design.

So many processes: What is where?

After going through multi relation models in all these processes and sub process discussed in this post and the previously discussed posts,  it might be little confusing to visual all the overlapping and dependable process sets. So here is a simple representation diagram that roughly shows the overlapping relations:

processes-relation

Usability Design and User-Centered Design (UCD)

The Usability Design is roughly a subset of the UCSD process that matches the “Do Iterative UCSD” step of the UCSD process.

usability_design

The usability design outlines the steps in the development process involving usability design aspects. The process can be divided into three main phases:

  1. Requirements analysis: This step is synonymous with planning and analysis phase of typical software development life cycle(SDLC).
  2. Growing software with iterative design: This is the design and testing phase and development phase of typical SDLC.
  3. Deployment: This is same as deployment phase of typical SDLC.

 

User-centered design (UCD) is a set of design processes in which “the needs, wants, and limitations of end users of a product are given extensive attention at each stage”. It is characterized as a multi-stage problem solving process involving designers who take the lead responsibility in foreseeing and solving the usability problems the users are likely to face while interacting with or using the system/product. UCD focuses on understanding the behavioral aspect of the user interacting for the first time so that the user’s learning curve in using the system can be evaluated in order to optimize and reduce it. User-centered design philosophy emphasizes on optimizing the product around “how users can, want, or need to use the product, rather than forcing the users to change their behavior to accommodate the product”.

Constantine and Lockwood define UCD as :

‘. . . loose collection of human-factors techniques united under a philosophy of understanding users and involving them in design’. . . ‘Although helpful, none of these techniques can replace good design. User studies can easily confuse what users want with what they truly need. Rapid iterative prototyping can often be a sloppy substitute for thoughtful and systematic design. Most importantly, usability testing is a relatively inefficient way to find problems you can avoid through proper design’. (‘. . . loose collection of human-factors techniques united under a philosophy of understanding users and involving them in design’. . . ‘Although helpful, none of these techniques can replace good design. User studies can easily confuse what users want with what they truly need. Rapid iterative prototyping can often be a sloppy substitute for thoughtful and systematic design. Most importantly, usability testing is a relatively inefficient way to find problems you can avoid through proper design’.

Putting it straightforward UCD is all about 4 factors which are mostly related to the end user :

  1. Needs of users
  2. Limitations of  users
  3. Preferences of users
  4. Business objectives of the product.

This helps in achieving the following benefits:

  1. User satisfaction through more user friendly product experience
  2. Increase in customer /user loyalty.
  3.  Making the product more relevant and valuable for the user
  4. Product / system is more value added as users

 

 

—–

(c)2012-13 : Samir Dash. All rights reserved.

 

 

User-Centered Systems Design (UCSD)

User-Centered Systems Design (UCSD) is set of “usability design” process focusing on usability throughout “the entire development process and further throughout the system life cycle”. It is based on the following key principle:

  1. User focus: The goals of the activity, the work domain or context of use, the users’ goals, tasks and needs should control the development.
  2. Active user involvement: Representative users should actively participate, early and continuously throughout the entire development process and throughout the system life cycle.
  3. Evolutionary systems development: The systems development should be both iterative and incremental.
  4. Simple design representations: The design must be represented in such ways that it can be easily understood by users and all other stakeholders.
  5. Prototyping: Early and continuously, prototypes should be used to visualize and evaluate ideas and design solutions in cooperation with the users.
  6. Evaluate use in context: Baseline usability goals and design criteria should control the development.
  7. Explicit and conscious design activities: The development process should contain dedicated design activities.
  8. A professional attitude: The development process should be conducted by effective multidisciplinary teams.
  9. Usability champion: Usability experts should be involved from the start of project to the very end.
  10. Holistic design: All aspects that influence the future use situation should be developed in parallel.
  11. Process customization: The UCSD process must be specified, adapted and implemented locally in each organization. Usability cannot be achieved without a user-centered process. There is, however, no one-size-fits-all process.
  12. A user-centered attitude must be established: UCSD requires a user-centered attitude throughout the project team, the development organization and the client organization.

The typical process flow of UCSD can be visualized as the following steps (based on ISO/TR 18529:2000):

UCSD_processcyscle

  1. Pre-study and business analysis: It  can be anything from a comprehensive analysis of work procedures, business processes, etc., to a brief statement or vision.
  1. Planning the user-centered systems design process:  includes setting up the project with resources, activities, roles, methods, etc.
  1. Do iterative UCSD /Usability Design Activities: The usability design process approximately.
  1. Formal Summative Evaluation:  It covers the usability of the resulting system, as opposed to the formative evaluations used in the usability design process to learn about details in the design .
  1. Introduce and Operate the System:  includes installation, change management, user training, evaluating long-term effects and so forth.

The focus of UCDS is all about “changing the attitude among all professionals involved in the software development process” and these set of 10 principles are key for the “user-centered systems design process” which helps in giving “equal weight to interaction design, analysis and evaluation, combining interaction design, and usability engineering”.

—–

(c)2012-13 : Samir Dash. All rights reserved.

Socio-cultural User Experience (SX) and Social Interaction Design (SxD): The Socio-cultural Context in UX and Usability Design

Summary

This paper introduces the ‘socio-cultural’ dimension of User Experience (UX) and Interaction Design (IxD) with reference to emerging devices and related eco-systems.

Background

With the emergence of Google Glass, the topics related to devices infringing with personal privacy became hot cakes for tech-debates. Many social scientists, human rights activists have started to see the ‘Glass’ as the evil that reminds them with George Orwell’s ‘1984’. The fear of a ‘Google Big Brother’ controlling the major shares of the information world is seen as the intruder to private aspects of ‘the public’.

Fig1: The backlashes on Google glass has become one of the major discussion in recent tech world.
Example link: http://blogs.computerworld.com/privacy/22144/hey-dont-wink-me-glasshole-itbwcw

It is not the case that Google has not spent money on user research and usability aspects before going ahead with the concept of persons using glass that may change the way we interact with systems in our daily life. Usability wise, it is definitely a super gadget that has the potential to  catapult the device industry into next century. But the new features and interaction methods implemented in the device in a manner that is actually a decade old approach that is only fit for human-computer-interaction (HCI) in case of smart phones and tablets which have less tendency to hurt sentiments of those who do not directly interact with the device when the user might be performing some actions in a certain socio-cultural context. These sentiments could result in the fear of losing privacy , cultural distrust and humiliation among the second-hand users of the  device who are impacted indirectly in some way by the device actions in the context.

There is an interesting article on web titled “7 Innocent Gestures That Can Get You Killed Overseas”  that gives nice examples of various innocent gestures in daily life a  person can actually get him into trouble in a different socio-cultural context http://www.cracked.com/article_16335_7-innocent-gestures-that-can-get-you-killed-overseas.html.

Therefore it is high time to rethink in UX domain to discover the missing pieces which we think we have already discovered.

Socio-Cultural User Experience (SX) – the missing piece in UX

I have coined the term ‘SX’ aka ‘Socio-Cultural User Experience’ to represent the aspect of Usability Design or User Experience (UX) that deals with usability aspect of products/ software in a social context.

 SX

Fig2: The UX model is incomplete without its ‘social’ context.
To make usability design meaningful the model must follow the social context

 

Social and Cultural aspect of UX can be interpreted as a new component of UX – it is the missing piece that makes UX meaningful in social context.

Traditional UX model is centered around human user. But the critical factor that makes human being differentiated from other beings is his ability to ‘evolve and follow social standards’. The history of human growth is actually more clearly represented in the “history of human civilization”. So any product design must adhere to the social factor of design  and this is what SX is all about.

Considering the ‘Others’ in the User’s Social circle

The existing UX model does not analyze the need beyond the current user and his ‘type’ to do a usability test  — it never considers how it is impacting the other members of the society while the target user set is using the app/system.

For example, using car horn is a safety measure, but using it near a hospital or school is considered as unsocial and disturbing. There are many social check points that bar users of any system from using it in special socio logical context.

 

Fig3 : The no horn , camera, mobile phones and similar sign posts can be seen as a few of the social guidelines represented graphically on the use of different systems.

So implementing social context related restrictive design is even though new , is actually a age old tradition.

Criteria of a Good ‘SX’ Compatible System

Criteria of a sound usability design of an app on socio-cultural context:

  1. Universal—has design elements that are universal.
  2. Ethical – follows principles and approach that has positive ethical value
  3. Non-racial – non biased and non-provocative attitude to user’s race and beliefs.
  4. Respectful – towards user’s culture, social beliefs and ethnicity
  5. Safety – has it’s social impact that is safe for the User.
  6. Non-abusive – must not exploit the user and the environment he is in .
  7. Common Sense – has geared towards common sense – behaves and reacts to the user in a sensible way
  8. Protect Privacy – App’s feature and interaction must protect user’s privacy and other humans in the social circle.

Example of a Possible Enhancements to a Real Life Product via ‘SX’ :

Fig4 : Google Glass has an inbuilt camera that can take pictures.  

Let’s take the case of Google Glass.

Google Glass is designed in a way that can act as more personal than a mobile handset, as it is a spectacle and can be indispensable   accessory for the user once he gets addicted to it by replacing his conventional glass with it.

But the support for camera to take picture can pose a problem for the user to enter private areas, industrial areas, secure zones and offices where cameras are not allowed. In some places of earth, the cultural restrictions are in practice to ban cameras in certain places — most of the temples in India do not allow cameras inside. Now imagine, if the user has replaced his traditional spectacle for it , then he may find it difficult to manage without it in these scenarios.

So by following SX approach in usability design, the glass will require to have a “detachable set of camera” used in the glass so that the user can detach the camera and which would power it off and at the same time allow the user to keep on using the glass as a conventional spectacle.

This example may be just one of many features that Google glass might have, but it is enough to illustrate the approach in thought.

Social Interaction Design (SxD) – Helping IxD to Focus on Context and Environment of the User

I am using the term ‘SxD’ aka ‘Social Interaction Design’ that deals with the ‘social aspect’ of Human – Computer – Interaction (HCI) and Interaction Design (IxD) that  focuses on usability design in context of how the user is interactive with the app in specific socio-cultural context.

Points to Focus on while designing a SxD Compatible System

  1. Provide multiple alternatives to the interaction methods to control the same functionalities in different socio-cultural context.
  2. User should have total control over enable/disable of interaction methods for different scenarios.
  3. The default interaction method must follow ‘SX’ approach.
  4. Provide options to the user to switch between interaction methods with the system as and when needed.
  1. Alternative mechanisms should be provided for physically challenged users. Rethink on the use of gestures and other interaction methods in the Article 508 context as everyday the new devices with unpredictable (not necessarily negative!) interaction methods and features.

Gesture and other Interaction Medium of SxD:

The ‘Social Interaction Design’ approach has the following major facets in the  system interaction towards the user in socio-usability context:

  1. Facial Gestures—The selection of Human triggered facial gestures (e.g. wink, smile etc.) to activate the system or trigger any action in the system must be judged based on the canonical meaning of those gestures in social and cultural context of the user where he is going to use it.  For example, in case of Google Glass , the feature of “winking” (the gesture developed by Google Glass developer Mike DiGiovanni http://news.cnet.com/8301-1023_3-57582500-93/google-glass-code-lets-you-snap-a-photo-with-a-wink/  ) at someone to take a photo can pose a problem if the user is in India or Middle East countries. Even in western world winking at a lady or group of ladies (even though it is unintentional for any kind of abasement) can be taken as a negative action (e.g. weakness in character) and evoke anger and misunderstanding. So even if the winking to take a feature is a ‘cool feature’, in social context SxD will suggest the usability/interaction engineer to rethink on it to implement some options to ‘keep it disabled’ by default and allow the user the total freedom to use his judgment to enable and use the feature in any given socio-cultural context.Fig5: The ‘wink’ gesture developed by Google Glass developer Mike DiGiovann allows user to take a snap of the surrounding with just a wink of an eye.

     

  2. Sound Gestures —  The selection of sound gestures – the use of voice or sound pattern to control the system should be examined for different user environments. For example blowing a whistle to activate a play functionality on a portable music player, or to open an SMS on the cell phone can be an interesting feature, but on the other hand if it becomes useless in a busy street or in a meeting room where a discussion is going on.
  3. Touch based Gestures –   Touch, swipe and pinch are popular now a days as most of the tablets and smartphones offer this as a user friendly interaction method for the user. More devices are coming up which do not have any physical button rather a few multi-touch gestures are enough to fully control them. However ‘SxD’ stresses that the devices must be designed and developed with the interaction method that can allow alternative to the available touch triggered interaction mechanism.  For example , while developing a digital medical instrument with touch sensitive display, the interaction methods  should be carefully planned so that the surgeon can use the system without touching to avoid infections through contact with it while conducting any mission critical surgery.
  1. Hand/Finger based 3D gestures – ‘SxD’ approach encourages to conduct a social analysis of the  hand/finger based gestures that are planned to be used in a system – the gestures should selected / innovated by carefully studying the cultural context avoiding common gestures used in daily life that are considered abusive to others. In addition to this practical usage resulting out of user’s environment and work culture must be given consideration. For example the middle finger gesture commonly used by youths to represent the crack humiliating pun on the other should not be used for any app that is expected to be popular among the users from the similar demography. But note that only considering the demography is not enough to decide the gestures.
  1. Mouse /Keyboard Control – Similar to the gesture , voice and the related interaction method with system, mouse, keyboard, joystick and other typical input device based methods should be considered with in the context in which they are going to be used. As this group of interaction method are very old, many standard guidelines are already in there in practice. They However we need to rethink on them and make sure they are upto date with the ever changing human –computer-interaction domain.

Going Forward

Understanding usability is the first step in developing a successful system/software. However we need to understand the social and cultural implications of the UX implementations of the definitions of usability which we think is good for the user in order to   make our software truly complete and meaningful in all aspect. ‘SX’ and ‘SxD’ are the two missing pieces of this whole puzzle, which we need to discover in order to rediscover UX.

 

 

Download the paper from Slideshare :

http://www.slideshare.net/MobileWish/sx-overview

 

 

 

 

My paper on “Socio-cultural User Experience (SX) and Social Interaction Design (SxD) This paper introduces the ‘socio-cultural’ dimension of User Experience (UX) and Interaction Design (IxD) with reference to emerging devices and related eco-systems”

My paper on “Socio-cultural User Experience (SX) and Social Interaction Design (SxD) This paper introduces the ‘socio-cultural’ dimension of User Experience (UX) and Interaction Design (IxD) with reference to emerging devices and related eco-systems”

This paper introduces the ‘socio-cultural’ dimension of User Experience (UX) and Interaction Design (IxD) with reference to emerging devices and related eco-systems.

Socio-Cultural User Experience (SX) – the missing piece in UX

I have coined the term ‘SX’ aka ‘Socio-Cultural User Experience’ to represent the aspect of Usability Design or User Experience (UX) that deals with usability aspect of products/ software in a social context. …

Social Interaction Design (SxD) – Helping IxD to Focus on Context and Environment of the User

I am using the term ‘SxD’ aka ‘Social Interaction Design’ that deals with the ‘social aspect’ of Human – Computer – Interaction (HCI) and Interaction Design (IxD) that  focuses on usability design in context of how the user is interactive with the app in specific socio-cultural context.

 

Check the paper at :

http://www.slideshare.net/MobileWish/sx-overview

 

 

Indexed Tabs: UX Pattern Experiments

What:
Set of tabs where the inactive tabs are represented as index numbers / icons and active tab shows the full tab title by expanding in width.

Use When:

The problem with typical tabs pattern is that when the tab titles are longer there will be less number of tabs that can be placed in a fixed width real estate and this create a problem in smaller devices such as a iphone, where the width is limited.

See the video in the following:
Typical tabs pattern — taking a lot of horizontal space.

To avoid this issue, you can use a new tabs pattern(I call it”Indexed Tabs” pattern ) shown here It can relatively adjust more tabs in the same available width. Specially useful in case of applications designed for mobile devices (iphones/androids etc.)

How: The inactive tabs show the indexed numbers (1-indexed) or can show  icons which will take less horizontal space than if a complete tab title is shown in those tabs.
The mouse-over tool-tip can always display the complete title.
The active tab will shows the complete tab title there by clearly indicating that the corresponding tab view is served.

Whiteboard concept: To minimize the tabs eating up your horizontal space, a new approach can be used – indexed tabs

 

Wireframes of the Indexed Tabs

On touch enabled mobiles/tablets, due to the absense of rollover event, the icons are used instead of index numbers to suggest the kind of information the  tab view contains.



“Indexed Tabs” is in action

  • Sample screenshots showing indexed tabs on a desktop where mouse is supported.
  • In this example the width of the tabs area varies depending on the tab  title length that effects the total horizontal real estate.

  • In this example the selected tab width is set to a default value, that prevents the variation in the total tab area width.