UI/UX: Distinction and Trends


Published on

Presentation on distinction between UI and UX, why developers should be aware of UX designing and participate, what are the simple tips to incorporate and what are the upcoming trends on UX design. Presented at the Developer Meet Nepal on May 12th at islington college, Kathmandu, Nepal.

Published in: Design, Technology, Business
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

UI/UX: Distinction and Trends

  1. 1. UI/UXDistinction and TrendsAnkur SharmaDigital Media, HCI and Innovation enthusiast.Hello! this is me, Ankur Sharma. This is my fourth on a series of public talk on HCI relatedissues. This talk was delivered at Developer meet. This talk is about UX, few distinction, tipsand trends.
  2. 2. UI Vs UXSo, how do we differentiate between the two? Ritesh Dai (@ormt) helped me figure out thetrue distinction between them :)
  3. 3. U ARE WITH ME = UIIf you are with me, then it is U and I hence UI
  4. 4. U ARE WITH UR EX = UXIf you are with your ex then it is U and X hence UX ... :D ... well, I guess if it was that simple!Let me elaborate it.
  5. 5. USER INTERFACE 1I wanted to buy a pack of gum, I went to this shop. Pretty good interface with neatlyorganized stuffs, I could actually see the gums I wanted. But no sign of shopkeeper! I waitedfor a minute and left.
  6. 6. USER INTERFACE 2The stuffs in another shop nearby wasn’t pretty organized, but the shopkeeper greeted mewith big smile and while he searched through the pack of gum (which took some time) hekept his conversation.
  7. 7. USER INTERFACE 3I could have also walked few steps nearby to a shopping center where I could choose gummyself and pay at the counter.
  8. 8. WHICH ONE DO YOUPREFER?Well it depends upon the context what you are choosing, but mostly it is all about ...
  9. 9. INTERACTION... Interaction. Preference largely depends upon the interaction rather than interface alone.Same task (buying a pack of gum) can be presented through same UI but different UX ordifferent UI and UX altogether.
  10. 10. WHY DEVELOPER?But why do developer need to concern themselves over the user experience?
  11. 11. WHY NOT DESIGNER?Isn’t it the designer who are concerned about how it looks? Isn’t UI/UX a designer job?
  12. 12. UI=VIEWSWell partly yes if you are concerned on look and feel or the views of the program. If youconsider only how all products are arranged in front end. But ...
  13. 13. MODEL+VIEWS+CONTROLLERUX =Since you are talking about overall experience of the program, it goes beyond views, itconcerns with all layer of development.
  14. 14. MODEL+VIEWS+CONTROLLER+UX = USER FLOW+FEATURES+PERSONALITYBeyond that, it also concerns how user are using the program and what features are available.It defines the personality of the program in overall.
  15. 15. UX IS A SCIENCEUser Experience and User Experience design is a science, with proper processes andstandards. It is applied science.
  16. 16. UX IS (PSYCHOLOGY+ENGINEERING)It is amalgamation of study of human behavior and engineering of product or a program. It ismajor section of Human Computer Interaction study at large.
  17. 17. DEVELOPER THINKS SYSTEMDevelopers are always thinking about the system and how it works and how to make thingswork on a system, solve a problem through programming.
  18. 18. UX EXPERT THINKS USERwhereas Usability or User experience expert is concerned on how user behaves with thesystem.
  19. 19. DEVELOPER THINKS TECHNICALFLOWDeveloper designs program and it’s functional block over the technical flow of data andtasks. They optimize over best performance of the system.
  20. 20. UX EXPERT THINKS USERINTERACTIONwhile UX expert ponders over the user interaction and how user perform their task using thesystem. They present optimization for best user experience and more usable system.
  21. 21. WHY UX IS IMPORTANT?Which basically concerns over input and output, just the perspective and approach aredifferent. But why is UX so important? Why not design good program from systemperspective?
  22. 22. WE DESIGN FOR SYSTEMThat would be true if we design for the system. But ...
  23. 23. WE DESIGN FOR SYSTEMWe do not design for the system ...
  24. 24. WE DESIGN FOR USERWe design for user (not even for the client or project manager, let them know). Hence it iscrucial for user to have good experience (for retention, usability and recommendation hencemore profit)
  25. 25. WHY DEVELOPER?But why developer need to concern over user experience? Shouldn’t developer just focus oncoding?
  26. 26. DEVELOPER IS DESIGNERDeveloper need to focus over user experience because they are the designer.
  27. 27. DEVELOPER IS UX DESIGNERDeveloper is concerned over the process flow and hence user experience.
  28. 28. WITHAt the same time developers need to garner one more quality to become good UX designer.
  29. 29. EMPATHYEmpathy towards end user is necessary.
  30. 30. DOUBLY SO IN OUR CONTEXTUX orientation in developer is essential in our context.
  31. 31. Because we have limited time, resources and skilled manpower. Our startup starts withdevelopers with similar set of programming skill but little orientation in Human centricdesign.
  32. 32. TIPSHere are the few tips for developer or startup which would be useful and costs little ornothing at all to implement.
  33. 33. TURN OFFgo outside, find and interact with your userGet away from your computer and get closer to prospective user, interact with user to findtheir everyday frustration with similar product or talk about expectation from such product.Know your user.
  34. 34. STORYhow will user use the system? when? why?understand how the users intend to use your system, how that can be achieved or efficientlyand effectively managed. Don’t build upon limited perspective, try to get the bigger pictureand simplify it in everyday usages story.
  35. 35. PROTOTYPEpen and paper are enoughdraw the rough sketch of your program, how the program is intended to be used and how theservice is intended to be delivered. Review it, explain it to user and peer. Get feedback andincorporate it before actually coding.
  36. 36. TRENDSAfter some seemingly simple tips, let us talk about the future trends in UX. I will start withsimple story...
  37. 37. BRAIN PIZZAI was walking down the road on a place I was visiting for first time and suddenly I startedthinking about nearest pizza places and their price and ratings, after choosing one mentally Istarted visualizing the direction to the place ... then realized I was hungry.
  38. 38. IT’S HAPPENINGIs it possible to have such experience through computers of future? Solve the problem evenbefore we know it’s existence and directly integrated with out thought process? Wellsomething is happening now.
  39. 39. These different devices are contender to solve such complex problem and present withinteraction experience of future, they exists now but they are largely fragmented or at theirinfancy. But possibilities are there.
  40. 40. 2013Well, enough of futurism! Let’s speak about few UX trends that might prevail through 2013.
  41. 41. DATA SURGERYIntelligent Abstraction and DownsamplingFacebook is on graph search, Yahoo! bought summly, Twitter bought summify, Googlebought Wavii and other companies are working or buying companies related to dataabstraction, presentation and downsampling. It is sure that these products will shine through2013
  42. 42. STORYTELLINGFaceted media and prominent visual mediahttp://futureofcarsharing.comThis site present interesting visual navigation through horizontal scrolling, many similar siteswill go mainstream. The faceted video with annotation, advance external tag and big visualmedia across the page will appear prominently. Popcorn.js and similar service will providemultimedia storytelling exposure to user throughout 2013.
  43. 43. NATURAL UXcommunication/language augmentationMore of siri like service will prevail, gesture and non-touch interaction will also appear.Google now will vastly improve and be integral part of use. Natural communication andinteraction will prevail among program and interfaces.
  44. 44. FLAT(T)ERYdying skeuomorphism and gradientsSkeuomorphism will be slowly overtaken by more smart, usable and flat design. The designwill be content oriented and gradients, eye candy will slowly disappear. Flat but aestheticallypleasing and meaningful design will take over.
  45. 45. OMNISIVENESSbeyond responsiveness. Experience, not only interfaceNot only the interface will be responsive but the experience across the medium will be similaras well.
  46. 46. LEAN UXactive ethnography, less deliverables, on-fly amendmentsThe process of UX design will grow to be more efficient with Lean UX where more focus willbe given to actual experience design and less focus on deliverables.
  47. 47. INTERFACEdawn of interface-less interactionsThe best interface is no interface at all. 2013 will dawn an era of interface-less interactionwith more integrated design approach and more interaction oriented device with modernsensors.
  48. 48. BUT WHO KNOWS THE FUTURE?WE CAN ONLY PREDICT IT ORINVENT IT.Technology is growing exponentially, we can never predict the future correctly. These are justcalculated speculation or educated guess. The best way is to get involve in designing for thefuture.
  49. 49. DON’T JUST FOLLOW THE TRENDS,SET YOUR OWN TREND.-Swami AnkuranandIn the end I would like to thank you all for giving me opportunity to talk on these issues. Iwould like to end my session with this quote.