Post on 01-Nov-2014
description
transcript
“Restful User Experience”Unconventional views on
user experience vs. architectural design
Wayne Lee, May 2009http://trilancer.wordpress.com/
What is this all about?To share
my humble opinionson user experience designs with
insights from representational state transferstudies as well as inspecting software architectural design
with user experience philosophy to improve overall system design
…
Or simply put, to study
to better system designs
Image Source: http://www.flickr.com/photos/danielgreene/344196890/http://www.flickr.com/photos/surstubben/475404411/
throughand
through
UX
REST
REST LENS
UX LENS
Background•
Representational state transfer (REST)–
A software architecture style
for distributed
hypermedia
systems, e.g., the World Wide Web–
Introduced by Roy Fielding
in 2000
•
User experience (UX)–
The overarching experience
a person has as a result
of interactions
with a product or service, its delivery, and related artifacts, according to their design
RESOURCES
The REST Triangle
Universal URI, XRI …Unconstrained Set
Universal URI, XRI …Unconstrained Set
[Post, Get, Put, Delete],[C R U D] …
Constrained Set
[Post, Get, Put, Delete],[C R U D] …
Constrained Set
Hypermedia: HTML, XML, JSON, JPG, GIF …
Constrained Set
Hypermedia: HTML, XML, JSON, JPG, GIF …
Constrained SetReprese
ntations
Nouns
Verbs
REST vs. RPC•
Resource-centric
view
–
ONE
uniform set
of methods (verbs)
–
Standard
media types
–
Lots
resources (nouns)
–
Some common knowledge required to access ALL
resources
•
Command-centric view–
Custom, unique sets
of
methods (verbs)
–
Custom
media types
–
Fewer
objects (nouns)
–
Prior specific knowledge required to locate / access
each
object
REST vs. SOAP
•
REST simplicity
= freedom from choice
–
5 decisions to choose among 16 alternatives
–
12 decisions already taken (but 5 are DIY)
•
WS-* Complexity
= freedom of choice
–
12 decisions to choose among 32 alternatives
–
2 decisions already taken (SOAP, WSDL + XSD)
Source: http://www.jopera.org/docs/publications/2008/restws
UX through REST lens
Image Source: http://www.flickr.com/photos/mark_boucher/794747329/
UX Differences in software architectural terms
“Dumb Phone”•
Lots models, varying UX•
Lots buttons, with function overload•
Various key-combinations to invoke lots (sometimes mysterious) functions
iPhone•
Few models, consistent UX•
Few buttons, soft keys on-demand•
Few gestures (tap, flick, glide…) to invoke ALL functions
Image Source: Nokia & Apple
Press together
to
lock / unlock
“RPC”“Restful”
…ak
a “S
item
ap”
/youtube
/stocks
/sms
/calendar /photos
/calc
/maps
/weather
/itunes
/phone/sms /safari
/ipod
/apps
/notes
Home
Conceptual Restful State Machine of iPhone i.e., web browsing mentality can be mapped smoothly
/phone
/phone/favorites
/phone/contacts
/phone/keypad
/phone/reschedule
/calendar
/phone/contacts/Tom
/phone/call
Call (submit)
/phone/voicemail /phone/voicemail/Emily
/phone/favorites/Jerry
Dial (form input) Call (submit)
Call Back (submit)
Delete
End Call
Call POST /phone/call
End Call DELETE /phone/call
Create a new call session resource
Destroy current call session
State Transitions Explained with REST
Redirect back to state before call
The iPhone Triangle
Events, SMS, Mails, Photos, Songs, Videos, Apps …
Unconstrained Set
Events, SMS, Mails, Photos, Songs, Videos, Apps …
Unconstrained Set
[Tap, Glide, Flick, Pinch, Rotate, Swing …
]
Constrained Set
[Tap, Glide, Flick, Pinch, Rotate, Swing …
]Constrained Set
CoverFlow, List, Icon, Map, Table, Player …
Constrained Set
CoverFlow, List, Icon, Map, Table, Player …Constrained Set
Represe
ntations
Nouns
Verbs
Restful User Experience (RUX)
Represe
ntations
Nouns
Verbs
UNLIMITEDVolume of content
indexed or hyperlinked
UNLIMITEDVolume of content
indexed or hyperlinked
UNIFORMbuttons / commands /
gestures …
UNIFORMbuttons / commands /
gestures …
STANDARDIZEDInfo presentation layouts / views
STANDARDIZEDInfo presentation layouts / views
Further RUX Example –
Universal Remote Control
Logitech Harmony 1000 Advanced Universal Remote
Source: http://www.logitech.com/index.cfm/remotes/universal_remotes/devices/373&cl=US,EN
•
One-Touch
Control
•
Up to 15
components: video, audio, & gaming
•
Compatibility: supports 5,000+ brands & 225,000
devices
Different Approaches to Universal Remote Control, aka RUX vs. RPC-UX
Logitech Harmony 1000
15 Devices
Sony RM-AX4000A
16 Devices 5 Devices
Logitech Harmony 510 Sony RMVL610B
8 Devices
VS
for power usersfor common usersImage Source: Sony & Logitech
RUX or RPC-UX? aka, REST or RPC
Image Source: http://deadthingsdontfly.deviantart.com/art/thisway-thatway-72119766
Source: http://www.electronista.com/articles/08/06/30/rbc.high.iphone.demand/
freedom from choicefreedom of choice
3Models
(color variation included)12Models / Series
4+Models
10Models
14Models
10+Models
4Models
Source: http://blog.concentricsky.com/2009/03/iphone-takes-23-of-mobile-market/
iPhone Takes 2/3 of Mobile Market
Implications•
Market suggests RUX popularity–
Device / application with lots “nouns”
in usage scenarios better adopt
RUX to ease user access–
RPC-UX still works with limited nouns, but potential extensibility greatly hindered by e.g., physical shape
•
iPhone resembles web browsing experiences–
If you can surf the Web, you can use an iPhone
–
If you can’t “surf”
a phone, you won’t use it to surf the Web
•
Less choices + good design = good business
UX through REST lens
REST through UX lens
Image Source: http://www.flickr.com/photos/valpopando/2787823568/
Strong
SpecificSystem
Less is More (More or Less): Uncommon Sense and the Design of Computers
Source: http://www.billbuxton.com/LessIsMore.html
Growth of Functionality
Growth of Human Capability
Threshold of Frustration
a.k.a.
“Complexity Barrier” Weak General SystemS
treng
th
Generality
System Strength vs. GeneralitySystem Functionality vs. Human
Example: Generic Kitchen Knife(Can do LOTS things, but NOT optimized)
Example: Potato Peeler(Can do FEW things BETTER than others)
Strong
SpecificSystem
Software Architecture Design through “less is more”
lens
Functionality
Human Capability
Weak General SystemS
treng
th
Generality
System Strength vs. GeneralitySystem Functionality vs. Human
Restful systems, Web browserUniversal Remote Control…
RPC systems, Dedicated client
Specific Remote Control…
•
Web dev•
iPhone
•
SOA•
“Smartphone”
which demand really smart
user
The theories hold true for developers & users alike …
“Net Benefit”
Generality
A Strong AND General
System? a.k.a., integrated set of strong specific systems
Source: http://www.billbuxton.com/LessIsMore.html
Stre
ngth
Cognitive LoadThreshold of Frustration
“Net Benefit”
–A theoretical solution from Buxton about
digital and
networked devices …
Unlikely –Due to “threshold of frustration”
from highcognitive load in design
& use
Generality
Stre
ngth
Net Benefit: devices communicate
& cooperate
with each other, therebyassuming much of the load that would otherwise burden the user …
Approaches to “Net Benefit” in Software Systems Integration
Solution B:Apply principles, standardization,
simplification, unification & specifications…
aka. Design Constraints
Solution B:Apply principles, standardization,
simplification, unification & specifications…
aka. Design Constraints
Unlikelydue to even more
complexity
therein
Solution A:Intelligence in each system to enable
automatic communication & collaboration between systems …
aka. Magic
Solution A:Intelligence in each system to enable
automatic communication & collaboration between systems …
aka. Magic
FeasibleApply “less is more”
for greater good
•
Few verbs•
A few MIME types
•
Uniform resource URIREST Whole universe of knowledge
only clicks away
Less is More The world wide web works by design, not magic
Image: 3D Map of World Wide Web from www.opte.org
More or Less? Situations where RPC works way better …
Source: http://www.logitech.com/index.cfm/remotes/presentation_remote/devices/175&cl=us,en
Looking for a Presenter?
Weak General SystemStrong Specific System
Handy & efficient Overkill & inconvenient
More or Less? … and REST works positively terribly
Source: http://www.daniellaberge.com/music/webpiano/webpiano1.htmhttp://moocowmusic.com/
Try playing piano in a browser or on an iPhone all day …
REST or RPC? aka, RUX or RPC-UX
Image Source: http://deadthingsdontfly.deviantart.com/art/thisway-thatway-72119766
RUX vs. RPC-UX versus
REST vs. RPC
RPC-UX RUX
Pros •
Direct & Efficient •
Lower “cognitive load”
working with large complex systems
Cons •
High “cognitive load”
operating large complex systems
•
Indirect / inefficient for responsive / repetitive tasks
Conclusion •
Fits specific command-&-control tasks•
Good for power users, professionals …•
Fits general tasks•
Good for common users, info seekers…
RPC REST
Pros •
Optimized for specific task•
Fine-grained control•
Low technical barrier to entry•
Massively extensible / scalable
Cons •
Hidden status & implicit semantics •
Complicated testing & debugging•
Performance penalty, hard to customize •
Coarse-grained control
Conclusion •
Fits proprietary mission-critical apps•
Costly planning & implementation•
Fits open resource-oriented apps•
Easier planning & implementation
UX Classification of iPhone Apps
BrainTeaser QuickVoice
Recorder FedEx Mobile Kindle for iPhone
RPC
REST
RPC-UX
RUX
A given system is usually a balanced combination ofRPC-UX & RUX, aka RPC & REST
"Pure" R
UX
"Pur
e" R
PC
-UX
V R
NN
V R
V –
Verbs (method)R –
Representations (media)
N –
Nouns (object, resource)
“Pure”
RPC vs. “Pure”
REST Difference in Aggregated Complexity
# of systems integrated
Low High
A Pragmatic Architectural Approach for
Large Scale System Integration
A REST “Core” Some RPC “Deviations”
V R
N
•
Minimized cognitive load•
Assured common user access•
Optimized local operation•
Convenience for power usersUSER
•
Mitigated overall complexity•
Clearer global design•
Optimized local performance•
Optimized local designDEVELOPER
•
Governing constraints•
Uniform interfaces & views•
Local architecture & principles•
Special methods or layoutsARCHITECT
The Pragmatic Architectural Approach to Realize “Net Benefit”
Strategic Use of REST (RUX):Architectural constraints, standardization,
simplification, convention over configuration…
To mitigate overall complexity for design
Strategic Use of REST (RUX):Architectural constraints, standardization,
simplification, convention over configuration…
To mitigate overall complexity for design
Tactic Use of RPC (RPC-UX):Specific command, custom configuration,
non-standard interface, proprietary layout…
To optimize specific local designs
Tactic Use of RPC (RPC-UX):Specific command, custom configuration,
non-standard interface, proprietary layout…
To optimize specific local designs
Weak General ApproachFor common user access with
minimized cognitive load
Strong Specific ApproachTo strengthen specific tasks
and power users
+
GlobalUniformity
LocalDeviance
+ +
The Result –
A Hybrid System
Generality
Stre
ngth
Actual System Strength & Generality
Generality
Stre
ngth
Threshold of Frustration
“Net Benefit”
foundation
Cognitive LoadPerceived by User
Strong specific features atop
Implications•
Complexity
should be a decisive factor in architectural design
–
For small & simple systems, either
RPC or
REST will work–
For large complex system integration: Strategic
use of REST
+ Tactic
use of RPC
recommended
•
An actual system architecture should be a reasonable balance
of REST + RPC, according to usage nature
•
Always fight complexity with Architectural Wisdom, not prayers for miracle
REST through UX lens
Last Not Least Always Picture Your System First …
YourSystem
References•
Roy T. Fielding’s DISSERTATION
–
Architectural Styles and the Design of Network-based Software Architectures
•
Wikipedia:–
http://en.wikipedia.org/wiki/Representational_State_Transfer
–
http://en.wikipedia.org/wiki/User_experience
•
Bill Buxton:–
http://www.billbuxton.com/LessIsMore.html
•
iPhone App Store–
http://www.apple.com/iphone/appstore/
Image Source: http://en.wikipedia.org/wiki/File:Albert_Einstein_portrait.jpg
“Everything should be made as simple as possible, but not simpler.”