HCi-think

A blog about HCI, User eXperience, e-learning and more by Vik Tailor

[hci-think]

The living style guide

Anybody who has had to work on or with a style guide will know that they can take a while to produce and quickly become outdated. 

While a regular style guide is a snapshot in time, a living style guide evolves with your site.

Nicole Sullivan explains how a living style guide differs:

To hear more from Nicole and her thoughts on a living style guide take a look at her talk from JSConf 2013 : 

By now you should see that there is a compelling argument for using living style guides, especially in a constantly changing agile environment.

With a living style guide the information is up-to-date, easily accessible and comprehendible.

So how do you go about creating a living style guide?

First let us take a look at some good examples:

http://codeforamerica.clearleft.com/patchwork.php

http://getbootstrap.com/css/

Both examples give a very visual front end to the CSS and allow interaction with UI.

So how do you create your own living style guide?

Here are some links that will help you get started:

https://github.com/bjankord/Style-Guide-Boilerplate

http://jacobrask.github.io/styledocco/

If you are looking to document styles across platforms take a look at the BBC Global Experience Language guide - http://www.bbc.co.uk/gel

[hci-think]

Here's your chance to see my full length interview with e-learning age magazine. You can see me talk about the use of Agile, mobile apps, and the award winning London 2012 Games project.

[hci-think]

Check out my interview in this month's edition of the e.learning age magazine!

Available to view online via this link: http://lnkd.in/dVCQB_N

[hci-think]

Designing the user experience by UPA

[hci-think]

70 20 10... Don't buy the what! Buy the why! - learning technologies summer forum 2013

In my final post on the learning technologies summer forum I am going to cover the main points from a talk on 70 20 10. The talk was given by Boyd Glover, who has been working with TWM (The Working Manager).

What is 70 20 10?

A learning and development model that supports the idea that learning is broken into three groups

70% experience

20% social

10% formal

70 20 10

Why use this?

If you take away the numbers it is a mix of formal learning, social learning and practice. 

There should be an acceptance that you can not teach learners everything, but you can arm them with the right tools to enable them to learn.

Seymour Papert put it like this: 

You can't teach people everything they need to know. The best you can do is position them where they can find what they need to know when they need to know it.

Social

70 20 10 often get's mistaken for 'social'. The social element is very marketable but there are some things to bear in mind apart from the fact that it is only 20% of the whole model.

The contribution phenomena

Jakob Neilson carried out some research for AT&T and found that only 1% of people contributed in a social sense, 9% of people fell in the category of editors, and a massive 90% of people purely consumed. 

If you set out on a 100% usage target, the majority will still consume. Is it right to make people contribute when it is not their natural style to do so?

Contribution phenomena

The diffusion of innovations

Everett M.Rogers came up with this principle in 1962, it is still used often in many areas, especially marketing. This diagram shows that there is a chasm after the early adopters have tried something new, and that there will always be skeptics that create a barrier to getting 100% engagement.

The diffusion of innovations

View counts and comment boxes on social platforms can be crucial in winning over users. A platform with very few view counts and comments can put people off following the trend. Boyd argued that if 90% of people are 'followers' we need to have high counts/comments in place to invite them to engage. The practice of adding your own counts/comments is often used on social media by big business, this tactic was hinted at as a solution to the low count/comments problem.

Personalisation

Disney Land Florida receive millions of visitors a year, so how could they possibly personalise their experience?

Disney's RFID wrist bands

Instead of sending paper tickets, they plan on sending out wrist bands. When purchasing entry to the theme park visitors filled out a short survey. As well as giving visitors entry the RFID (Radio-frequency identification) wrist bands store information about the visitor on them, for example their favourite rides, characters, and food. This information is then available to Disney cast members who can personalise the service they give to visitors. 

"Disney in the coming months plans to begin introducing a vacation management system called MyMagic+ that will drastically change the way Disney World visitors - some 30 million people a year - do just about everything.

If we can enhance the experience, more people will spend more of their leisure time with us,”

said Thomas O. Staggs, chairman of Disney Parks and Resorts.

Barclay's have also recently launched a scheme to allow customers to personalise their debit cards with personal pictures. 

The Thank You team

Gary Vaynerchuck  took his family owned wine business and turned it into an online success, it is now estimated to be worth $60 million dollars. He attributes much of this success to his passion for social media, which he uses to post video blogs reviewing wine.

An important part of Vaynerchuck's strategy for success was based on personalisation. Vaynerchuck's winelibrary.com business have a dedicated Thank you department. The thank you department contacts customers with personalised emails thanking them for their business. In one example the thank you team followed a customers twitter feed and found that he followed a particular baseball team. To thank this customer they purchased a baseball jacket which belonged to the customers favourite player, framed it and sent it to the customer to thank him for his business. It turned out the customer spent $3 million dollars a year on wine elsewhere, after the gesture from the Thank you team he switched all of his business to the winelibrary.com.

Validation

Even powerful leaders look for validation

Opera Winfrey has had the privilege of interviewing some of the most powerful people in the world, at a keynote speech to Harvard graduates she said

"The common denominator that I've found in every single interview is that we want to be validated. We want to be understood. I've done over 35,000 interviews in my career. And, as soon as that camera shuts off, everyone always turns to me and, inevitably, in their own way, asks this question: 'Was that okay?' I heard it from President Bush. I heard it from President Obama. I've heard it from heroes and from housewives,..."

  So where does Personal sit within 70 20 10?

Boyd closed by saying that if you put personal at the heart of what you are doing you increase engagement. More often than not people think "if it's about 'me' I'll do it", if it is about the company "I will wait till I absolutely have to do it".

Personal is at the heart of 70 20 10

[hci-think]

Achieving behaviour change through emotional investment - learning technologies summer forum 2013

At the recent learning technologies summer forum Saffron interactive's Toby Harris and Nick Baurn presented a talk entitled "e-Learning in the age of uncertainty: achieving behaviour change through emotional investment".

Here is a summary of the talk...

Studies show that emotionally engaged employees drive through change/improvement, unfortunately only 31% of employees are emotionally engaged.

Saffron looked at behavioural economics, when tasked to create e-Learning for TFL on mental resilience. They found that people are primarily motivated by intrinsic factors.

Maslow's hierarchy of needs

One of the factors is the sense of 'Community'. The example of the high salaries for bankers and footballers was used to explain that people are less concerned about their salary compared to the world, but are concerned about how it compares to peers. This is called peer-comparison, we compare ourselves to people in our community.

The 3 dynamics of action-orientated learning

involve me, show me where I am in relation to others

content through story telling, emotionally charged scenarios

tailored action plans that belong to the learner

 All three help build emotional investment.

When TFL came to Saffron they had a problem with high levels of staff absence. 1 in 4 of their employees were effected by stress related mental illness, often due to abuse from customers.

Cost of staff absences

The TFL Building mental resilience e-learning uses a questionnaire to gauge your own mental resilience. 

Questionnaire used to evaluate learners level of resilience

Saffron argued that by relating the learning to the learner they maximise engagement. The following screen shows the learners results from the questionnaire.

Results based on questionnaire highlighting learning needs

Learning on how to improve mental resilience is then provided using scenarios and questions.

Scenarios followed by questions 

Finally the learner is invited to create their own bespoke action plan. Tailoring the plan to the user means that they are emotionally invested in the action plan.

A tailor made action plan for learners to take away

Over a thousand members of staff took the course, a year after the it was rolled out 70% of learners said they were still using what they learned from the it.

Saffron and TFL looked at the ROI (return on investment) of the course and found that absenteeism had reduced by 1% saving £7.8 million in costs.

ROI from reduced absenteeism

TFL found that the biggest return on investment was not money, but cultural change through emotional investment.

[hci-think]

Performance Support using mobile devices - learning technologies summer forum 2013

At this years learning technologies summer forum LINE's Sean Nugent gave an interesting talk titled "Performance Support using mobile devices".

Here is a summary of the key points from this talk...

So what are Performance Support tools?

Tools people use to help them do their jobs

Can be paper or digital

Digital EPSS stands for Electronic Performance Support Systems

Also know as job aids, task support, aide memoirs

Examples of Performance Support tools:

Calculator

Sat nav

Check list

Swiss army knife

Thermometer

Why mobile?

They're common place

The rise of BYOD at workplaces

Ideal for people who are often out of the office

Digital means easier to update, cascade and maintain

Can operate offline as well

The difference between Training and Performance support:

  Key Question: If L&D do not provide these tools, who does?

A demo of some tools created by LINE

  Some Performance Support apps were demonstrated, here is an outline of some of them:

Military vehicle maintenance app

This tool tells you how often to maintain different types of vehicle, videos show how to perform tasks to maintain different parts of each vehicle.

Vehicle presentation guide

Designed to be used by car show room sales people to learn about different cars and use with the client. On a tablet the app displays car features per model, specifications, shows what optional extras are available, works with live data to check stock, prices, time scales for delivery.

Vehicle presentation guide 

Safety audit

A data collection form on a mobile giving guidance on what to look for as well as linking data to a business system.

Tour guide 

A tour guide for a hotel including site plans, tour directions to help guides give tours to visitors. Can also be used for staff inductions as well.

Land rover brake assembly

This smartphone tool shows engineers how to perform the brake assembly with video and instructions.

Business dashboard

Live data linked to business systems, which helps senior business people make informed decisions quickly.

Challenger tank for the military

The start up procedure is tricky, it isn't something used everyday so this app was useful in guiding people through the process properly

Military cultural reference tool

To help communicate with locals in Afghanistan in the two main dialects. Helps explain the different local customs that military officers need to be aware of.

LINE's cultural awareness tool for the military

    Tablet or smartphone?

Where possible, Line explained that they made applications for tablets as there is more screen space to work with. The smartphone applications were for tasks that either didn't require as much screen space or required more portability than a tablet could provide.

Deployment of Electronic Performance Support Systems and tracking

LINE argued that an LMS is not the right vehicle for deployment. An LMS is designed to track learning and support tools don't need tracking, SCORM is not designed for this. Performance support tools are designed to be used every day, often in a variety of ways depending on what you need at the time. How useful would it be to know if 'joe blogs' completed a screen on a performance app? It would be more useful to understand how it is being used instead, and for this purpose LINE use google analytics. This together with performance data,for example, car sales figures can provide more useful and relevant information about performance.

LINE then went on to present LINEstream, an app authoring tool allowing easy development of multi-platform performance apps. More information on LINEstream here: http://staging.line.co.uk/what-we-do/line-mobile/linestream-lines-mobile-enterprise-platform/

[hci-think]

Diary of a next generation learner - learning technologies summer forum 2013

At the learning technologies summer forum 2013 I attended a talk titled "Diary of a next generation learner" presented by Charles Gould, MD of Brightwave.

  Brightwave's new social media inspired LMS

  Gould started his talk by claiming that most people in western economies fall into the category of a 'knowledge worker'. He defines knowledge work as "improvisation and the use of judgement in ambiguous situations".

  Wikipedia defines this more clearly :

  Knowledge workers are workers whose main capital is knowledge. Typical examples may include software engineers, architects, engineers, scientists and lawyers, because they "think for a living".

He went on to present some statistics on knowledge work, it was put to us that knowledge workers outnumber other types of works in North America by 4:1. It is estimated that knowledge workers spend 38% of their time seeking information.

  the next gen learner learns all of the time using multiple devices

  Brightwave's argument is that as knowledge workers, we learn all of the time not like we used to at 2 day residential courses or through e-Learning modules. The next generation of learners expect to be able to access information at any time through multiple devices. In fact, according to Cisco mobile data is projected to grow 3 times faster than fixed IP traffic over the next 3 years. In addition to this it is understood that next generation learners have superior technology at home compared to the office, resulting in a learner expectation gap.

  Learner expectation gap is the gap between what employees expect and what employers currently provide

  Outside work we now capture information through a variety of mediums, for example, tablets, mobiles, YouTube, social media. Brightwave argue that technology can help close the learner expectation gap by aligning the way users interact with learning with the way they interact outside work.

Brightwave's solution is a Learning Management System called Tessello, which borrows many ideas from social media.

Tessello interface

  Tessello has the following key features:

Allows expert and peer created learning content

Design works on multiple devices - responsive design

Social media integration e.g. twitter feeds, like buttons, comments

Trending panels, leaderboards, dashboard layout

Integrated social bookmarking, like delicious

Provides detailed analytics of use

Uses Tin Can to track experiences

More information on Brightwave and Tessello can be found here: http://www.brightwave.co.uk/tessello

[hci-think]

Learning technologies summer forum 2013

Attended: June 18th 2013, Olympia 2 London

Most of you are probably aware that the learning technologies group hold an annual event for L&D professionals. The learning technologies summer forum is a free event  designed to further develop the key learning themes from the event that took place earlier this year. It gives us a chance to see, hear and experience the best of January's sessions.

The event floor was made up of 4 speaker zones and many stalls run by different e-learning companies - mostly trying to sell you things!

You can catch up on the recorded talks here, which should be available from the 2nd of July: https://www.annotag.tv/learningtechnologies

To help categorise my notes from the event I have split them into separate posts which you can find on this site, I hope you find these useful!

[hci-think]

HCI Lab Tour @ City University

Last Wednesday I visited City University London to be shown around their HCI lab. City are one of the leading universities for Human Computer Interaction studies and provide HCI consultancy for the commercial sector. In the past the university has helped to user test the official London 2012 web site, most recently they’ve helped redesign the Barclays Cycle Hire payment system. They house a variety of tools in the lab and we were guided through the application of each of these.

Here is a summary of technologies currently being used at the lab:

  Xbox Kinect

http://en.wikipedia.org/wiki/Kinect

Up until now gesture based interaction has been most commonly associated with gaming, some of the latest ‘Smart’ TVs are now also employing gesture based technology. City University are currently experimenting on how gesture based interaction can be applied to office environments. Recently a masters student built an app that uses gestures to allow a user to navigate through an image library.

    E-beam

http://www.e-beam.com/business/ebeam-edge/overview.html

This piece of kit is used as an interactive whiteboard. The e-beam pen uses ultra sound waves to capture what is drawn on a whiteboard and saves it in documents to a computer. You could for example have a website/e-learning screen grab projected to the white board and whilst suggesting changes to it by drawing on the white board the software updates the screen grab file on your computer. The university use this predominantly for wireframing and rapid prototyping. It is suited to group brain storming sessions where a quick solution is required. The e-beam costs around £800.

  Alternative to E-beam:

  Nintendo Wiimote

The Wii remote(Wiimote) uses infra-red to track movement. In the lab they have connected the Wiimote to a pc and used an open source app to make it function as cheaper alternative to e-beam, a Wii remote costs around £15. You can see how Wiimotes are being used for a variety of different projects here : http://johnnylee.net/projects/wii/

    Microsoft PixelSense (formally Surface 1.0) 

http://www.microsoft.com/en-us/pixelsense/default.aspx

Before Microsoft launched their new range of personal touchscreen devices they were working on project Surface, now renamed PixelSense. You may remember media coverage of their interactive table from a few years ago. The technology uses infra-red to track movement, the tables can also recognise objects placed on them. At the moment the university is using it to research how younger age groups interact with technology.

    3d printer

The 3d printer can be used to build prototypes, designs can be created in CAD. The university are using the technology in research and product design. 3D printers vary in size, the one housed at the lab was quite small and cost in the region of £1800. We were shown a bookmark that was created by the printer, which was pretty simplistic but usable. A website called thingiverse allows you to download blueprints of 3d objects which you can use to produce actual products, see this example of a plastic bottle : http://www.thingiverse.com/thing:65922

    Tobii mobile testing

http://www.tobii.com/

Tobii specialise in eye tracking technology. The lab has a three pieces of kit from Tobii. The first demonstration was of the Tobii mobile testing kit. This is made up of a stand for the mobile device to sit on, one camera hovers above the device, and another is positioned to track the eye movements of the user. Tobii records interactions using red lines to show the users eye movements. Red dots represent areas on screen where the user has clicked. The software is used to record multiple user tests, the tracks left by each user can be overlaid for analysis. Heat maps can be produced for interactions as well. The kit is quite expensive at £10-15,000, however there are cheaper more simplistic alternatives.

  Alternatives to mobile user testing:

Mr Tappy

http://www.mrtappy.com/

One alternative is Mr. Tappy, which is a camera that can be attached to smartphones or tablets allowing you to record a user session. 

Reflector

https://www.reflectorapp.com/

I spoke to someone who is user experience lead for a gaming company, and he told me about reflector as an alternative for mobile testing.

Reflector is an app that wirelessly links your apple device to a computer, the computer can then show and record the way the device is being used.

      Tobii desktop eye tracking

http://www.tobii.com/

The desktop kit uses 2 screens, one for the user and one for a facilitator. The facilitator sees a copy of the users screen with live eye tracking and a live feed of the users face. Each user is asked to perform a certain task. For example, find the latest basketball results from a sports website. Typically a user talks allowed, this helps the facilitator understand their trail of thought which in turn can go on to explain why their eye tracks in a certain pattern. Normally this sort of testing is carried out for a group of 8-10 users. As with Tobii mobile you can overlay several users eye tracks to look for common patterns. Tobii is also used for academic research, for these purposes the number of users tested can go up to between 20 - 30.

  Agencies are used to recruit users for user testing sessions. Commercial clients requiring consultancy will have specific user personas. These personas inform agencies about what sort of users are required for a session. One such agency is http://www.peopleforresearch.co.uk/

    Brain wave tracking

http://www.emotiv.com/

This technology is relatively new, the university are still exploring ways in which this can be applied effectively.

The devices  use Electroencephalography (EEG), they can also track heart rate, blink rate and skin response. Once this technology is understood fully it is hoped that the device will be able to recognise the 8 primary emotions of users. http://en.wikipedia.org/wiki/Plutchik%27s_Wheel_of_Emotions#Plutchik.27s_wheel_of_emotions

Currently this technology is being used in the gaming and entertainment industry.

  One of the EEG devices the lab had was called Emotiv EPOC: http://www.emotiv.com/

  The whole subject of brainwave tracking reminded me of this interesting experiment:

http://science.discovery.com/tv-shows/through-the-wormhole/videos/creativity-cap.htm

    Morae recorder

http://www.techsmith.com/morae-uses.html

Morae provide a suite of usability tools. The software can comprehensively record user interaction which includes voice, video, keystrokes, and mouse movements. The suite includes a powerful analysis package which can help interpret results. The university uses Morae to track usability for users with accessibility needs, it is used in conjunction with assistive software like JAWS, Dragon and ZoomText.

    Morae observer

The lab had a hidden viewing gallery behind a mirrored wall. The viewing gallery used Morae observer to allow facilitators to view user testing in action. This viewing gallery is often used to ensure that the presence of facilitators does not impact on the way users behave.

    Tobii eye tracking glasses

http://www.tobii.com/en/eye-tracking-research/global/products/hardware/tobii-glasses-eye-tracker/

Eye tracking glasses are being used to track user behaviour in real life environments, for example a supermarket or whilst driving a car.

Here is a case study of how these glasses have been used to understand how customers in pubs select their drinks:

http://www.research-live.com/magazine/case-study-its-all-in-the-eyes/4004622.article

    Unfortunately I wasn’t allowed to take my own pictures, but you can have a look at some of the kit described on the university’s flickr photostream : http://www.flickr.com/photos/cinteractionlab/page2/