multi platform user exerience
TRANSCRIPT
User Experience for Multi-Platform Applications
by Tanya Zavialova
We’ll take a look atUX specifics for different platforms
Industry standards
Best practices of creation of the multi-platform applications
Some myths about platforms
why do people need so many devices?
different in size and weight
different in mobility and productivity
different in levels on security and freedom
because there are different needs
why do people need so many devices?
along with personal preferences we:• solve different problems;• work in different conditions;• integrate into different environments
who is a typical desktop user?
who is a typical desktop user?
job specifics: office chores that require a high concentration during a long period of time
environment: proper chair, proper table, many people around, limited personal space, annoying air-conditioning
by profession: engineer, administrative employee, support, etc.
equipment requirements: steady Internet connection, cheap but productive hardware
who is a typicallaptop user?
who is a typicallaptop user?
job specifics: always on the move, multitasking, communicate with many different people
environment: constantly changes, noisy, often without a proper desk or in a poor light conditions
by profession: sales people, writers, managers…
equipment requirements: quick start, lightweight, durability,autonomy: possibility work without Internet and power
who is a typicaltablet user?
who is a typicaltablet user?
job specifics: coordination and monitoring when major tasks are done away from a desktop
environment: comfortable with a sudden possibility to change a location for a short period of time
profession: retired, housewife, doctor, top-manager
equipment requirements: quick start, lightweight, durability,autonomy: possibility work without Internet and power
who is a typicalsmartphone user?
who is a typicalsmartphone user?
job specifics: quick and urgent tasks
environment: in the move
profession: any
equipment requirements: quick start, lightweight, durability,autonomy: possibility work without Internet and power, do not bother people around, possibility to share
task specifics
Platform Screen size(px)
External keyboard Mobility Active parallel
tasksTime to
complete a single task
Acceptable system idle
time
desktop 1024+ + - 100500+ hours up to 1 min
laptop 1280+ + + 5+ up to 30 min. up to 30 sec.
web 1024+ n/а + 1–5 up to 10 min. up to 10 sec.
tablet 800+ - + 1–2 up to 5 min. up to 2 sec.
smartphone 320+ - + 1 up to 2 min. up to 1 sec.
industry standards
overview• Desktop: OSX HIG, Windows 7, Windows 8
• Web: W3C, Nielsen Usability Heuristics
• Mobile: iOS HIG, Adroid, Windows Mobile
Apple OS X Human Interface Guidelinesavailable since 2001include: • philosophical principles;• general approach to the application user
interface, menus and screens building;• whole list of user UI elements with full
description and usage patterns;• icon creation guidelines;• texts composition guidelines
Windows 7 Human Interface Guidelines2010include: • to many letters and images;• basic screen building patterns;• UI elements list with descriptions• texts composition guidelines
Windows 8 Human Interface Guidelines2014 improved include: • animation;• dialog behavior patterns;• UI elements;• advertisement placement rules;• design fro several screens guidelines;• flexible layouts
Web Standardsthere are many articles on a general practice and UI frameworks with own specifics. Among others I highly recommend to read: • W3C Web Accessibility Initiative
http://www.w3.org/WAI/users• Nielsen Usability Heuristics
http://www.nngroup.com/articles/ten-usability-heuristics/
10 Usability Heuristics for User Interface Design by JAKOB NIELSEN
1. Visibility of system status2. Match between system and the real world3. User control and freedom4. Consistency and standards5. Error prevention6. Recognition rather than recall7. Flexibility and efficiency of use8. Aesthetic and minimalist design9. Help users recognize, diagnose, and recover from errors10. Help and documentation
Apple iOS Human Interface Guidelinesavailable from the first days of iOS (2008)include: • basic principles of UI design;• UI elements description and
usage guidelines;• steps to take to make an app;• case studies;• description of available technology
Android Designalways online since 2012include: • basic UI design principles;• UI specifics for particular devices;• philosophy behind chosen stylistic
approach;• interaction patterns;• standard UI components description;• graphical assets to start designing fast
Windows Phone Designonlineinclude: • philosophy of the platform as awel as
ecosystem behind;• design approach;• application structure suggestions;• animation;• UI elements;• graphical assets to start designing fast
process
what to do when?
http://www.duncanistan.com/2012/10/embracing-ux-process.html
what to do when?
1. Find out goals of the business, customer and user
2. Suggest and choose a concept
3. Check feasibility with development team
4. Detail the concept, create prototype
5. Check usefulness and initial usability of the concept using
prototype to do a user testing with end users
6. Improve prototype
7. Help developers to implement the design
Goals of business,customer and users
How to understand what the business needs?
Business exists for revenue.
Find out:
What products and services are profitable?
How is it communicated via brand language?
How your project is related to it?
How to understand what the customer needs?
Customer is the business representative
who persuades among others his/her own interest.
Ask:
What have been done already? What is the project status?
What problem is being solved currently?
Who is the target audience?
What users like about the current implementation
(if there is current implementation)?
How to understand what the user needs?
The user is simply wants to perform his/her regular tasks
without being disturbed.
Ask:
What tasks user performs?
How does the user do theses tasks (have done before)?
What does the user likes in current implementation
and what can be improved in his/her opinion?
Design project goal
Good goal helps to stay focused, chose the best possible
alternative, insure in the choice and convince others.
We as designers and usability specialists have to stay focused
first of all on the users goals while keeping in mind
the goals of the business and the customer.
Design project goal
create <a form of solution>, that helps <target audience>
to perform <activity> with a given <level of support>
based on elevator speech design goal by Suleman Shahid
Opportunities
even if there are 100500 similar solutions currently presented on the market, there must be some points that either not yet covered, poorly implemented or there is no such technology to unleash their fool potential
information about such points you can find initial via user study among things people complain about
there those as opportunity areas that if addressed can provide a strong competitive advantage
concept
Concept
Treat the concept phase as an exploration of possible
solutions on how to make a good product or in other words
on how to help the user to accomplish his/her goals
To create concepts:
• write down user goals and tasks;
• explore existing solutions;
• combine existing and suggest new ones
Technical feasibility
Before presenting concepts to your customer
check feasibility with technical experts
To do so:
• visualize several screens;
• invite experts;
• evaluate, discuss;
• brainstorm on alternatives ( these can be even better
then initial concepts)
Detailing
When you have checked feasibility it is the time to detail your concept
Steps to follow:• prepare a scenario of the system usage in order to perform
a specific user’s task;• draw a schematic diagram to visualize the system flow
between screens while performing tasks according to scenarios;
• draw screens in detail;• you can also make an interactive prototype, so you have a better
feeling of the proposed design
users
why do you taste soup when cooking?
User Testing
You have to make sure that you proceed in the right direction,creating a useful product and do not miss important details
Consider:• you create a system to perform tasks –
check the success of the performance;• think beforehand what are you going
to measure and evaluate;• invite right users (target audience representatives);• do not interfere or help the user while he/she
performs the task;• use the test results to improve the product
multi-platform interfaces
Multi-platform interfaces
Think of switching between multiple platforms like of traveling abroad: you have already get used to a certain environment and now you go to a place where people behave differently, look differently and speak incomprehensible language.
How to get prepared? You have to learn:• vocabulary (UI elements library);• attractions (distribution store top apps);• life style and rhythm (interaction design patterns);• myths and superstitions
Vocabulary
Mind:• content;• shape;• size;• layout;• elements behavior
Attractions
Lifestyle and Rhythm
Myths and Superstitions
#1 Mobile First or at the start of the project you must optimize concept to be viewed mostly on mobile
I’d suggest to optimize for each and every platform concentrating of:- tasks;- context of use;- technical possibilities;- common sense
Myths and Superstitions
#2 Responsive Design is the panacea
Good application starts with the content and representation follows.
Consider:- what user requires;- what technology has
to offer;- then how it
could be displayed
Myths and Superstitions
#3 The behavior must be the same for all platforms
A rare user has simultaneously iPhone and Android in his pocket.
First optimize to a specific platform and then make sure the user gets the most from it.
Myths and Superstitions
#4 Desktop is outdated
Mobile and desktop are two parallel realms and we as designers are able to make the coexistence as easy and consistent as possible.
thank you!uxcookbook.com