Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Restful User Experience

12,301 views

Published on

Unconventional views on user experience and architectural design

Published in: Technology, News & Politics

Restful User Experience

  1. 1. “Restful User Experience” Unconventional views on user experience vs. architectural design Wayne Lee, May 2009 http://trilancer.wordpress.com/
  2. 2. What is this all about? To share my humble opinions on user experience designs with insights from representational state transfer studies as well as inspecting software architectural design with user experience philosophy to improve overall system design … Or simply put, to study through UX REST LENS and through REST UX LENS to better system designs Image Source: http://www.flickr.com/photos/danielgreene/344196890/ http://www.flickr.com/photos/surstubben/475404411/
  3. 3. 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
  4. 4. The REST Triangle [Post, Get, Put, Delete], Hypermedia: HTML, XML, [Post, Get, Put, Delete], Hypermedia: HTML, XML, Represe [C R U D] … JSON, JPG, GIF … [C R U D] … JSON, JPG, GIF … Verbs Constrained Set Constrained Set ntations Constrained Set Constrained Set RESOURCES Nouns Universal URI, XRI … Universal URI, XRI … Unconstrained Set Unconstrained Set
  5. 5. REST vs. RPC • Resource-centric view • Command-centric view – ONE uniform set of – Custom, unique sets of methods (verbs) methods (verbs) – Standard media types – Custom media types – Lots resources (nouns) – Fewer objects (nouns) – Some common knowledge – Prior specific knowledge required to access ALL required to locate / access resources each object
  6. 6. REST vs. SOAP • REST simplicity = • WS-* Complexity = freedom from choice freedom of choice – 5 decisions to choose – 12 decisions to choose among 16 alternatives among 32 alternatives – 12 decisions already – 2 decisions already taken (but 5 are DIY) taken (SOAP, WSDL + XSD) Source: http://www.jopera.org/docs/publications/2008/restws
  7. 7. UX through REST lens Image Source: http://www.flickr.com/photos/mark_boucher/794747329/
  8. 8. UX Differences in software architectural terms l” ” tfu PC es “R “R Press together to lock / unlock “Dumb Phone” iPhone • Lots models, varying UX • Few models, consistent UX • Lots buttons, with function overload • Few buttons, soft keys on-demand • Various key-combinations to invoke lots • Few gestures (tap, flick, glide…) to (sometimes mysterious) functions invoke ALL functions Image Source: Nokia & Apple
  9. 9. iPhone Feature List … Source: http://www.apple.com/iphone/
  10. 10. … aka “Sitemap” /calendar /photos /sms /maps /youtube /weather /stocks /notes Home /calc /itunes /apps /phone /ipod /sms /safari
  11. 11. Conceptual Restful State Machine of iPhone i.e., web browsing mentality can be mapped smoothly /phone/favorites /phone/favorites/Jerry /phone/contacts/Tom /phone/contacts Call (submit) /phone /phone/keypad /phone/call Dial (form input)  Call (submit) End Call /phone/voicemail /phone/voicemail/Emily Call Back (submit) Delete /phone/reschedule State Transitions Explained with REST Create a new call /calendar POST /phone/call Call session resource Destroy current DELETE /phone/call End Call call session /mail Redirect back to state before call
  12. 12. The iPhone Triangle [Tap, Glide, Flick, Pinch, CoverFlow, List, Icon, [Tap, Glide, Flick, Pinch, CoverFlow, List, Icon, Represe Rotate, Swing … ] ] Map, Table, Player … Rotate, Swing … Map, Table, Player … Verbs Constrained Set Constrained Set ntations Constrained Set Constrained Set Nouns Events, SMS, Mails, Photos, Events, SMS, Mails, Photos, Songs, Videos, Apps … Songs, Videos, Apps … Unconstrained Set Unconstrained Set
  13. 13. Restful User Experience (RUX) UNIFORM STANDARDIZED UNIFORM STANDARDIZED Represe buttons //commands // Info presentation buttons commands Info presentation Verbs ntations gestures … layouts //views gestures … layouts views Nouns UNLIMITED UNLIMITED Volume of content Volume of content indexed or hyperlinked indexed or hyperlinked
  14. 14. Further RUX Example – Universal Remote Control • One-Touch Control • Up to 15 components: video, audio, & gaming • Compatibility: supports 5,000+ brands & 225,000 devices Logitech Harmony 1000 Advanced Universal Remote Source: http://www.logitech.com/index.cfm/remotes/universal_remotes/devices/373&cl=US,EN
  15. 15. Different Approaches to Universal Remote Control, aka RUX vs. RPC-UX 15 Devices VS Logitech Harmony 1000 5 Devices 8 Devices 16 Devices Sony RM-AX4000A Logitech Harmony 510 Sony RMVL610B for common users for power users Image Source: Sony & Logitech
  16. 16. RUX or RPC-UX? aka, REST or RPC Image Source: http://deadthingsdontfly.deviantart.com/art/thisway-thatway-72119766
  17. 17. freedom of choice freedom from choice 4+ 10+ 3 Models 14 10 Models 4 Models Models Models Models 12 (color variation included) Models / Series Source: http://www.electronista.com/articles/08/06/30/rbc.high.iphone.demand/
  18. 18. iPhone Takes 2/3 of Mobile Market Source: http://blog.concentricsky.com/2009/03/iphone-takes-23-of-mobile-market/
  19. 19. 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
  20. 20. REST through UX lens Image Source: http://www.flickr.com/photos/valpopando/2787823568/
  21. 21. Less is More (More or Less): Uncommon Sense and the Design of Computers System Functionality vs. Human System Strength vs. Generality y alit on ti nc Fu of Example: Potato Peeler th row (Can do FEW things BETTER than others) G Strength Strong Growth of Human Capability Example: Generic Kitchen Knife Specific (Can do LOTS things, but NOT optimized) System Threshold of Frustration a.k.a. “Complexity Barrier” Weak General System Generality Source: http://www.billbuxton.com/LessIsMore.html
  22. 22. Software Architecture Design through “less is more” lens System Functionality vs. Human System Strength vs. Generality • SOA • “Smartphone” which demand lity RPC systems, Dedicated client na really smart user tio nc Specific Remote Control… Fu Strength Strong Human Capability Restful systems, Web browser Specific Universal Remote Control… System • Web dev • iPhone Weak General System Generality The theories hold true for developers & users alike …
  23. 23. A Strong AND General System? a.k.a., integrated set of strong specific systems Unlikely – “Net Benefit” – Due to “threshold of frustration” from high A theoretical solution from Buxton about cognitive load in design & use digital and networked devices … Strength Strength Cognitive Load “Net Benefit” Threshold of Frustration Generality Generality Net Benefit: devices communicate & cooperate with each other, thereby assuming much of the load that would otherwise burden the user … Source: http://www.billbuxton.com/LessIsMore.html
  24. 24. Approaches to “Net Benefit” in Software Systems Integration Solution A: Unlikely Solution A: Intelligence in each system to enable Intelligence in each system to enable due to even more automatic communication & collaboration automatic communication & collaboration complexity therein between systems … aka. Magic between systems … aka. Magic Solution B: Feasible Solution B: Apply principles, standardization, Apply principles, standardization, Apply “less is more” simplification, unification & specifications… simplification, unification & specifications… for greater good aka. Design Constraints aka. Design Constraints
  25. 25. Less is More The world wide web works by design, not magic • Few verbs Whole universe of knowledge REST • A few MIME types only clicks away • Uniform resource URI Image: 3D Map of World Wide Web from www.opte.org
  26. 26. More or Less? Situations where RPC works way better … Strong Specific System Weak General System Looking for a Presenter? Handy & efficient Overkill & inconvenient Source: http://www.logitech.com/index.cfm/remotes/presentation_remote/devices/175&cl=us,en
  27. 27. More or Less? … and REST works positively terribly Try playing piano in a browser or on an iPhone all day … Source: http://www.daniellaberge.com/music/webpiano/webpiano1.htm http://moocowmusic.com/
  28. 28. REST or RPC? aka, RUX or RPC-UX Image Source: http://deadthingsdontfly.deviantart.com/art/thisway-thatway-72119766
  29. 29. RUX vs. RPC-UX versus REST vs. RPC RPC-UX RUX • Direct & Efficient • Lower “cognitive load” working with Pros large complex systems • High “cognitive load” operating large • Indirect / inefficient for responsive / Cons complex systems repetitive tasks • Fits specific command-&-control tasks • Fits general tasks Conclusion • Good for power users, professionals … • Good for common users, info seekers… RPC REST • Optimized for specific task • Low technical barrier to entry Pros • Fine-grained control • Massively extensible / scalable • Hidden status & implicit semantics • Performance penalty, hard to customize Cons • Complicated testing & debugging • Coarse-grained control • Fits proprietary mission-critical apps • Fits open resource-oriented apps Conclusion • Costly planning & implementation • Easier planning & implementation
  30. 30. UX Classification of iPhone Apps RPC-UX RUX QuickVoice Recorder BrainTeaser Kindle for iPhone FedEx Mobile quot;Purequot; RPC-UX quot;Purequot; RUX RPC REST A given system is usually a balanced combination of RPC-UX & RUX, aka RPC & REST
  31. 31. “Pure” RPC vs. “Pure” REST Difference in Aggregated Complexity V R V R N N # of systems integrated V – Verbs (method) R – Representations (media) Low High N – Nouns (object, resource)
  32. 32. A Pragmatic Architectural Approach for Large Scale System Integration V R A REST “Core” Some RPC “Deviations” • Governing constraints • Local architecture & principles ARCHITECT • Uniform interfaces & views • Special methods or layouts • Mitigated overall complexity • Optimized local performance DEVELOPER • Clearer global design • Optimized local design • Minimized cognitive load • Optimized local operation USER • Assured common user access • Convenience for power users N
  33. 33. The Pragmatic Architectural Approach to Realize “Net Benefit” Tactic Use of RPC (RPC-UX): Tactic Use of RPC (RPC-UX): Strong Specific Approach Specific command, custom configuration, Local Specific command, custom configuration, To strengthen specific tasks non-standard interface, proprietary layout… non-standard interface, proprietary layout… Deviance and power users To optimize specific local designs To optimize specific local designs + + + Strategic Use of REST (RUX): Strategic Use of REST (RUX): Weak General Approach Architectural constraints, standardization, Global Architectural constraints, standardization, For common user access with simplification, convention over configuration… simplification, convention over configuration… Uniformity minimized cognitive load To mitigate overall complexity for design To mitigate overall complexity for design
  34. 34. The Result – A Hybrid System Actual System Cognitive Load Strength & Generality Perceived by User Strong specific features atop Strength Strength Threshold of Frustration “Net Benefit” foundation Generality Generality
  35. 35. 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
  36. 36. Last Not Least Always Picture Your System First … Your System
  37. 37. 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/
  38. 38. “Everything should be made as simple as possible, but not simpler.” Image Source: http://en.wikipedia.org/wiki/File:Albert_Einstein_portrait.jpg

×