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

 

 

 

 

Check out my article “WebKit touch events: background and terms for Edge users” at Adobe Developer Connection

Check out my article “WebKit touch events: background and terms for Edge users” at Adobe Developer Connection at
It’s also featured at
This article explores the concepts of touch events and gestures in reference to normal HTML and JavaScript rendered in the iPhone, iPad, or Android browsers.
Image
Image

Special Kindle Edition at Amazon.com : Quick and Dirty Guide for Designers: Adobe Edge Preview 3 in 4 Hours (Quick and Dirty Guide in 4 Hours) by Samir

Image

Quick and Dirty Guide for Designers: Adobe Edge Preview 3 in 4 Hours (Quick and Dirty Guide in 4 Hours) by Samir Dash (Dec 17, 2011) - Kindle eBook

  • Format: Kindle Edition
  • File Size: 2212 KB
  • Publisher: patternGraphic Digibooks; 2 edition (December 17, 2011)
  • Sold by: Amazon Digital Services
  • Language: English
  • ASIN: B006NFFQ4Q

Special Kindle Edition at Amazon.com : Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours (Quick and Dirty Guide in 4 Hours) by Samir

http://www.amazon.com/Quick-Dirty-Guide-Developers-ebook/dp/B006NFHVS0/ref=sr_1_2?s=books&ie=UTF8&qid=1324260399&sr=1-2Image

Special Kindle Edition.Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours (Quick and Dirty Guide in 4 Hours) by Samir

  • Format: Kindle Edition
  • File Size: 2048 KB
  • Publisher: patternGraphic Digibooks; 2 edition (December 17, 2011)
  • Sold by: Amazon Digital Services
  • Language: English
  • ASIN: B006NFHVS0

Quick and Dirty Guides for Designers and Developers : Adobe Edge Preview 3

“Quick and Dirty Guide for Designers: Adobe Edge Preview 3 in 4 Hours”

Ebook By Samir Dash
Published By patternGraphic DigiBooks
Rating: Not yet rated.
Published: Dec. 15, 2011
Category: Non-Fiction » Computers and Internet » Programming
Category: Non-Fiction » Computers and Internet » Graphics and design
Words: 9365 (approximate)
Language: English

ISBN: 978-1-4658-4425-5

PG2011B3

Here is a discount coupon you can use to get 20% OFF :

Original Price: $4.00

Promotional price: $3.20
Coupon Code: MT66A
Expires: February 15, 2012

https://www.smashwords.com/books/view/114683?ref=patternGraphic

Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours

Ebook By Samir Dash
Published By patternGraphic DigiBooks 

Published: Dec. 16, 2011
Category: Non-Fiction » Computers and Internet » Programming
Category: Non-Fiction » Computers and Internet » Graphics and design
Words: 14341 (approximate)
Language: English

ISBN: 978-1-4660-7972-4

PG2011B4

Here is a discount coupon you can use to get 20% OFF :

Original Price: $4.00

Promotional price: $3.20
Coupon Code: LN68F
Expires: February 15, 2012

Available in following formats: Epub (Apple iPad/iBooks, Nook, Sony Reader, Kobo, and most e-reading apps including Stanza, Aldiko, Adobe Digital Editions, others), PDF, Mobi(kindle), and LRF.

https://www.smashwords.com/books/view/115038?ref=patternGraphic

A quick 4 hours guide for developers, web designer and those having basic knowledge in HTML, CSS, Java Script and jQuery to learn using Adobe Edge Preview 3 to develop web interactive and web applications.
The book covers the following topics:

Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours

Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours

Ebook By Samir Dash
Published By patternGraphic DigiBooks 

Published: Dec. 16, 2011
Category: Non-Fiction » Computers and Internet » Programming
Category: Non-Fiction » Computers and Internet » Graphics and design
Words: 14341 (approximate)
Language: English

ISBN: 978-1-4660-7972-4

PG2011B4

Here is a discount coupon you can use to get 20% OFF :

Original Price: $4.00

Promotional price: $3.20
Coupon Code: LN68F
Expires: February 15, 2012

Available in following formats: Epub (Apple iPad/iBooks, Nook, Sony Reader, Kobo, and most e-reading apps including Stanza, Aldiko, Adobe Digital Editions, others), PDF, Mobi(kindle), and LRF.

https://www.smashwords.com/books/view/115038?ref=patternGraphic

A quick 4 hours guide for developers, web designer and those having basic knowledge in HTML, CSS, Java Script and jQuery to learn using Adobe Edge Preview 3 to develop web interactive and web applications.
The book covers the following topics:
Before We Start!

  • What is Adobe Edge?
  • What to Expect from this Book

Hour 1: Overview of Edge Runtime

  • Edge Composition
  • Edge Symbol
  • Edge Action
  • Events
  • HTML page DOM specific Events
  • Edge Elements DOM specific Events
  • Element level Touch Interaction specific
  • Triggers

Hour 2: Adding Basic Actions to Your Animation – Playing with Triggers

  • Where to Add Triggers in the Edge IDE ?
  • Different Type of Triggers
  • “Earth” – An Example for Basic Playback Control
  • “Day and Night” – An Example for Changing the content of an Element in Runtime
  • Where all Triggers are Saved When We Type into the Edge Code Editor?
  • Reference to different Elements and their properties while writing Triggers
  • Using Lookup Elements (Lookup Selectors) and jQuery API
  • Using Some Other Useful Edge Runtime APIs
  • “Progress Bar” Example – Using what we have learned about referencing Elements

Hour 3: Edge Touch API and Gestures for iPhones, iPads and Android devices – Thinking Beyond Desktop & Mouse

  • Touch Events supported on iPhones, iPads and Android devices
  • Difference Between Touch and Mouse Events
  • The WebKit Event Object for touch events
  • Note: Setup Environment to Test HTML Pages on Your Devices
  • Gestures
  • Adobe Edge and jQuery Mobile Events
  • Using Touch Events in Edge Compositions
  • Adding Touch Events to Edge Element’s Action
  • Adding Touch Events to the DOM Elements Associated with Edge Element
  • Adding Gesture Events to Compositions in Edge IDE
  • Making Edge Compositions Compatible for Both Mouse and Touch Events
  • Example: Cross-platform Slider
  • Prevent scrolling
  • Prevent Default HTML Resize

Hour 4: Complex Interactions between Multiple Compositions and Development and Usage of Reusable Compositions

  • Wheel: Example of a nested Element Animation
  • Adding Interaction to Control the Animation of the Nested Element
  • Benefits of Nested Animation
  • Reusability Approach of Development in Edge
  • Example: Building a Reusable Slider Component
  • Example: Product Selector – How to Use of the Reusable Edge Composition Multiple Times in another Edge Composition with Different Configurations

Going Forward

  • Next Steps

Source Files for this Book

This is a quick guide that will help you feel comfortable using the Adobe Edge Preview 3 in context of designing and animation.

If you are looking for the designing and animation using Adobe Edge instead of programming check “ Quick and Dirty Guide for Designers: Adobe Edge Preview 3 in 4 Hours” …that is available at https://www.smashwords.com/books/view/114683?ref=patternGraphic

 

 

Videos related to the book:

In hour 4 section of this book you will learn how to create reusable compositions which can be used in other Edge composition through configurable parameters. For source files and details check the book

This sample shown in this video is explained in the current book. In the video you can see there are 3 different Edge compositions the first one is a simple background, the second one is a rotating wheel and the third one is the combination of the two to render the final interactive. For source files refer to the book.

Here is an experiment from the current book, showing how a product selector can be built with Flash like user experience using HTML5, jQuery, CSS3 and of course Adobe Edge Preview 3 runtime. For source code refer to the book.

Quick and Dirty Guide for Designers: Adobe Edge Preview 3 in 4 Hours

Quick and Dirty Guide for Designers: Adobe Edge Preview 3 in 4 Hours

 

 

https://www.smashwords.com/books/view/114683?ref=patternGraphic

“Quick and Dirty Guide for Designers: Adobe Edge Preview 3 in 4 Hours”

Ebook By Samir Dash
Published By patternGraphic DigiBooks
Rating: Not yet rated.
Published: Dec. 15, 2011
Category: Non-Fiction » Computers and Internet » Programming
Category: Non-Fiction » Computers and Internet » Graphics and design
Words: 9365 (approximate)
Language: English

ISBN: 978-1-4658-4425-5

PG2011B3

Here is a discount coupon you can use to get 20% OFF :

Original Price: $4.00

Promotional price: $3.20
Coupon Code: MT66A
Expires: February 15, 2012

Table of Contents

  • Before We Start!
  • What is Adobe Edge?
  • What to Expect from this Book
  • Getting Ready : Download and Setup Adobe Edge on your System
  • Hour 1: Quick Tour of the Adobe Edge IDE
  • Default Layout : Welcome to Adobe Edge!
  • “Get Started..” Panel
  • Stage
  • Toolbars
  • Elements panel
  • Timeline panel
  • Properties panel
  • Menu bar
  • Editor
  • Hour 2: Drawing and Animating Shapes
  • Creating your First Animation
  • Changing Color through Animation
  • Shape Morphing Animation
  • Animating Background Color of the Stage
  • Example: Creating a Flip Book animation
  • Hour 3: Editing Webpages Not Created With Edge
  • Animate Existing Webpage
  • Adding Animation to HTML Forms
  • Feedback Form Animation – Example of Animation to HTML Forms Elements
  • Hour 4: Adding Basic Actions to Your Animation through Triggers
  • Where to Add Triggers in the Edge IDE ?
  • Different Type of Triggers
  • “Earth” – An Example for Basic Playback Control
  • Going Forward
  • Next Step s
  • Source Files for this Book

This is a quick guide that will help you feel comfortable using the Adobe Edge Preview 3 in context of designing and animation.

Available in following formats: Epub (Apple iPad/iBooks, Nook, Sony Reader, Kobo, and most e-reading apps including Stanza, Aldiko, Adobe Digital Editions, others), PDF, Mobi(kindle), and LRF.

If you are looking for the programming part stay tuned…”Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours” is underway…… Notice the diff …it will be for DEVELOPERS.

Jayanta Mahapatra’s “Relationship” is available for iPhone/iPad/Android and as Standard eBook Formats

 

 

 

Relationship by Jayanta Mahapatra.

published by patternGraphic.com

from Smashwords.com

Original Price: $2.00   

Promotional price: $1.40


Coupon Code: BG98H


Expires: December 31, 2014

Available eBook Formats :

Kindle (.mobi for Kindle devices and Kindle apps) Download
Epub (Apple iPad/iBooks, Nook, Sony Reader, Kobo, and most e-reading apps including Stanza, Aldiko, Adobe Digital Editions, others) Download
PDF (good for reading on PC, or for home printing) Download
LRF (Use only for older model Sony Readers that don’t support .epub) Download
Palm Doc (PDB)

Jayanta Mahapatra needs no introduction. Any discussion on Indian English Poetry is incomplete without reference to his poetical works. Mahapatra holds the distinction of being the first Indian English poet to have received the Sahitya Akademi Award for the current book “Relationship”. “his international reputation has been compared to that of Wordsworth…”

The Hindu, Sunday, Jan 29, 2006

‘History’ in Criticism – the ‘Other’ Side of the Story (Part – 1)

Image

[Fig: Michel Foucault]

Focault and his contemporary post structuralists might make it a part of his consciousness that ontological studies of literature leads towards a future of studies without a point of convergence, as knowledge necessarily entails power relationship – that the moment one attempts to define in strict tones some aspect of ‘text’, it becomes something else. Exploiting this power relationship of knowledge with the interpreter’s environment (which is essentially socio-political). Said in Orientalism, adopted a different methodological standpoint – the method of “historical generalization”. And after publication of Orientalism the subaltern poststructural critics like Spivak termed it as the “source book” for the related disciplines  to which she belongs. The reason to present this fact is that, I want to direct our attention to one distinguish point of today’s criticism – that the so called anti-historic criticism (like post-structuralism) lead the way to point a fault i.e. “ontological interpretation” is never free from bias and thus it gives way to ‘historical generalization’ or (more specifically) to ‘use of history in critical interpretation of texts’, to which it is totally against. That means, in plain words, through the structuralists and post structuralists, deconstructionist distorted history, by assigning it the title of a ‘system’ with changing ‘center’ (For instance, Derrida thought his articulation of his deconstructionist ideas as an event, and this he showed as a process of change of “center” – by replacing “metaphysics” with the “deconstruction”, at the center of our belief system), they later paved the way (through Focault’s theory) for a new mode of interpretation where history plays an important role – in post colonial, subaltern and Oriental studies (more specifically in the words of Said and Bhaba).

Thus the most interesting point that comes to our notice is the relationship between two modes of idealism – one that supports the use of history and the other that is totally against the use of history in the study of literature are infact are the two sides of the same coin. This point as we observed in case of modern critical theories, tempts us to examine its validity in every phase of critical history itself, and in the following I am attempting to give this temptation , a mode of reality.

(Continued…)

[From my essay with the same title written in December 2003]

————————————————————————

© Samir K. Dash, 2003

Two oldmen

 

 
Two oldmen

Two oldmen met each other
One entered from a door
The other leaving

Both smiled at each other
Talked insane to the other
One has learned this world
The other yet to
One thing common
Both innocent at the moment
Rest too complex to explain
Like life itself!

——————————————————————————————

“Two oldmen” (c) Samir K. Dash: 2011,

All Rights Reserved. No part of the above poem(s) can be published any where in any form (electronic or non-electronic ), with out the written permission of author. However you can direct yours links to this page in your websites.

——————————————————————————————