[music playing] nazmul idris: i'm nazmul idris. i'm a developer advocate onthe android team at google. this is "uxd fordevelopers," the show where you can learn how tocreate better user experiences.
Android ui design, today we're going to talkabout what ux actually means. with me i have a specialguest, izabel idris, who is a mobileinteraction designer that works for [? good ?] technology.
thanks for joining us. izabel idris: thanks. nazmul idris: so, izabel. i hear the words ux designget thrown around a lot, and especially in manydifferent contexts. people say, if you dois, you have a good ux. if you do that,you're going to have a bad experience and yourusers will have a bad time. so what is ux?
izabel idris: welluser experience design is really an emergentproperty of design that includes visualdesign, interaction design, and engineering. so you can see the slidehow all of these things really need to come together,and the whole must be greater than the sum of its parts. so if any one of thesethings aren't great, they're going to let downthe overall user experience.
so user experiencereally involves you focusing on allthe details, as well as being able to reallyzoom out and make sure that what you're delivering hasan overall really great user experience. nazmul idris: that makes sense. so you mentioned thewords "visual design" and "interaction design." can you describe thedifferences between the two.
izabel idris: so i'm aninteraction designer, so i'll start withinteraction design. it really involves designinga sequence of screens, are sequence ofsteps, that the user has to go through inyour application, which is what we call "flow,"in order for your user to accomplish certain tasks. so those tasksdepend on whatever it is that yourapplication actually does.
so interaction designtakes into account how a user interacts withthe data and the ui elements on each one of yourscreens, as well as how they interact with allof the screens together. so the data andthe ui really has to be strong together in a waythat makes sense for the user. izabel idris: so ifyou look at the slide, this is an example of a flowthat an interaction designer might give to a developer.
so the next slide hereis annotated wire frame. so this is something else that iwould also give to a developer. so the differentannotations show what each one of thoseui elements mean. so right here we'reshowing the action bar. so we have the app icon,a spinner, some icons, and an overflow. so a visual designer,what they do is they really specify thecolor palette, the iconography,
the typography, and allthe visual personality of your application. so they would specifythe exact spacing for all the layouts ofevery single screen. so if you look atthe slide here, this is what we wouldcall a "red line." so you can see it's avery detailed layout of that particular screen. so visual designers wouldprovide the engineers
all the graphics,assets, and the icons, and make sure that eachscreen is just perfect. so there's one otherexample of a visual design. these are some things that avisual designer would actually deliver to an engineer. these are like thedifferent sizes for your icons, all thedifferent font sizes, and icon set for your entire application. nazmul idris: soessentially you're
skinning the application. you're creating thatwonderful experience-- i mean the visual aspectof that experience that is going to immediatelybe striking to someone. izabel idris: yeah. izabel idris: sointeraction design, you can kind of think ofit that they would provide more of a low-res wire frame,and then a visual design would give you a high-resmock that's really detailed.
so i get it. so basically ux design has totake into account interaction design, on visualdesign, and engineering, and put them alltogether in the way that delivers the lightat the end of day. right? izabel idris: yep. nazmul idris: so from adeveloper's perspective, the way i'd like to think aboutit is that i write code that
might-- there's avisual code i write, the non-visual code i write. and both of those come togetherto deliver the overall user experience, but the visual codespecifically delivers the ui. is that a good way tothink about it as well. and i think that google nowis a really great example of a product that delivers areally great user experience. and it really embodiesawesomeness at every level-- the interaction, thevisual, and the engineering.
nazmul idris: right. izabel idris: so ithink it's something that we can talk abouta little bit more. do you have any examples of howan application or experience like google nowcould hypothetically have gone terribly wrong? nazmul idris: definitely. so we were talking aboutvisual design for quite a bit. so google now, one of themost striking things about it
is that the cards arereally, really easy to read. the typography is great. it's very easy to digesta lot of information without thinking much at all. so if google now delivered thesame quality of information, it was accurate and relevant,but if it looked really bad, like if the margins areoff and the padding was off and the images areall ugly, then i think it wouldmake the user think
that it was a veryunprofessional application. i think that things liketypography and spacing and that polishthat's in google now is one of the things thatmakes it so successful. of course, the relevant datasurfacing just when you needed is crucially important. but what i reallylove about google now is how i can just glanceat a card in just a second, i can get a lot ofinformation from it.
if there's really lowcognitive load to those cards, i can just glanceat it and that's it. nazmul idris:that makes sense. so visual designis very important. nazmul idris: so kind ofswitching gears a little bit. so let's say thevisuals for google now-- since we aretalking hypothetically about how the uxcould go hardly wrong. so let's say google now hadjust amazing data was surfacing,
the content wastotally-- i'm sorry. if the cards lookedreally great, as they do today, but let'ssay the data was lacking, like it didn't knowyour current location, or it surfaced a cardabout some upcoming flight that you have to be onand the details wrong. so in that situation, that wouldbe really bad user experience. right. izabel idris: yes.
nazmul idris: because one thingthat i would feel at that point as a user is that i can'ttrust the information that i'm getting, even though itlooks visually striking. izabel idris:yeah. trust is a really importantpart of user experience. i'm glad you brought that up. because trust is one ofthose emergent properties that has to do with reallygreat design and really great engineering.
so i think trust is somethingthat as developers we should all really focus on. because when someonetrusts your application, that's what's going toget your users to give you these five-star reviewsin the app store. and these reviewsare what's going to make youultimately successful. nazmul idris: that's true. and then you get toshare your application
as well, and then thesocial proof in what you're doing and so on, izabel idris: exactly. nazmul idris: absolutely. trust is one of those very, veryimportant emergent properties i think that everybodyshould aspire to accomplish. so let's use a differentexample than google now. so i think we've highlighted howbad visual design could wreck a user experience, how badengineering could wreck it.
so let's talk about how badinteraction design could also wreck it. so we've all usedandroid phones. and if you think back atthe first minute experience you had with anew android phone, the first thingandroid asks you to do is sign into your gmail account. once you've donethat, it basically automatically signs you intoall the other google apps
that you have, likeplay, maps, and youtube. so imagine an alternateuniverse where, instead of this wonderfulflow, we add a lot of friction. where, let's say, you'veinitially signed in with gmail, but then for every other googleapplication that you go to run, you now have to sign into itover and over and over again. what would the userthink in that situation? i would be almost discouragedfrom using my phone in the ways that i want to use it becauseof the tremendous amount
of friction that had beencreated in the interaction that i'm having with thesedifferent applications. so it's a higher-levelflow, if you will, of how a user interactswith your phone that's being impacted byindividual decisions that are being made at theapplication level. that's one of those aspects ofbeing able to get the details right and then actuallyzooming out and looking at how all those details, and inthis case, how the first minute
experience of using allthese applications really affects the overalluser experience, which is the android userexperience of the phone. nazmul idris: exactly. exactly. so it's almost asif you'd have to be a good citizen as anapplication developer. your applications have to bea good citizen on the device, and not only delivera good experience
inside of thatapplication, but also in the context of the largerphone or operating system that it's actually living in. nazmul idris: it also impactsthings like battery life and so on. ok. so it's clear that manythings need to come together to make a userexperience truly great. and clearly that design iseveryone's responsibility.
designers alone cannot creategreat user experiences. so i want to say that one time,that designers alone cannot create a great user experience,and are not responsible alone for creating a user experience. it takes an entire team. so great user experiencereally involves equal amounts of amazing design andamazing engineering effort, and really amazingis across the board by all the membersof the product team.
so just to give a shout outto all these other people that are not engineers or designers. these include techwriters, product managers, project managers, anddirectors, managers. so you really needexcellence at every level. and also i think weshould also shout out to user researchers,prototypers and so who are also part of the designteam that contribute in a big way to making surethe experience actually works.
nazmul idris: i mean,works for users. and designers can workto create and prototype really amazing designs. but in the end of theday, these designs still have to getbuilt by engineers. so an example,let's say a designer creates a really amazingand elegant and functional mobile news reader application. and they test it with users.
it has really greatuser feedback. and they say, ok. this design is perfect. so they give itto the engineers. but when the engineersbuild it, they don't put inprefetching, caching, and they don't doefficient data transfers, and they drain the battery. nazmul idris:[inaudible] tells us
we should always doefficient data transfers. izabel idris: always doefficient data transfers. so these amazingdesigns are never going to be fullyrealized or appreciated due to these badengineering practices. and this is something thatdesigners have no control over. they can't control if youuse prefetching, caching, and if you do datatransfers inefficiently. so overall this is goingto result in a bad user
you're usually going to feelimpatient and frustrated and overall have a bad time. izabel idris: so ux designis really important. it's everyone's responsibility. and it's really importantthat everyone in the team comes together to makea great experience. nazmul idris: awesome. well thank you so muchfor joining us today. this has been a great show.
do you want to plugthe ux community? oh yeah. free to join our google+design community. the link will be inthe description below. and we're going to put alink to the episode on here. and if you have any questionsor comments about our episodes, or just any questionsabout ux in general, or if you havesuggestions about topics you want us to coverfor upcoming shows,
please feel free toleave us a post on there.
and we also curate a tremendousamount of really good user experience-related information,especially for developers. so please check that outfor that reason as well. i think you again,and see you next time.
