This was a highly visual presentation (as you’d expect), and so there’s only so much I could capture in notes. I suggest you check out Des Traynor’s blog: http://blog.intercom.io

Data Visualization
Des Traynor
  • hard to make visualizations better than text
  • especially hard to make them work good on mobile, desktop, etc.
  • Be clear first and clever second. If you have to throw one of those out, throw out clever. — Jason Fried
  • Lots of examples of bad graphics:
    • unemployment rate: sloping lines in the reverse direction of the data
    • gas prices: different units of time (year vs week)
    • gulf oil spill: 
  • Who’s the level?
    • CEO level: high level
    • Analysts: trends
    • Operations/logistics: Is anything going wrong? traffic going in the right direction?
  • What department?
    • Sales: leads, conversions
    • Marketing: impressions
    • Customer support: satisfaction rating, number of issues
  • These two (level and domain) together tell you what needs to be presented
  • Six Things to Communicate
    • A single figure: a bank balance, server status
    • Single figure with context: number plus sparkline
    • Analysis of a period: a good line chart
      • Never imply precision you don’t have. e.g. for four months of data, use a bar chart, not a line chart. 
    • A common error in visualization: to force the processing on the user. If we want to look at the delta between sales and target, don’t show the numbers for each, show the delta.
      • awesome example of using cycle charts to display user retention over time by cohort analysis
    • Breakdown Over Time
  • Lying with grouping
  • Lying with rotation
  • Bar charts aren’t sexy, but they rely on an innate skill: following a line
  • When picking visualizations, use innate skills
    • determining height
  • Tufte principles:
    • Chart junk: minimize anything that does change when the data changes
    • Data Ink ratio: how much of your ink is showing something useful?
    • Smallest effective difference: the least you can do to highlight
  • Ryan Singer: HTML has a strong tag, but no weak tag. As a result, we forget to think about what we need less of.
    • Remember to quiet down your less important parts
  • Visuals should say something: some narrative or point.
  • Visuals should all be created in HTML
    • Highcharts is a Javascript library is excellent and worth the money
    • Flotr2 is new, but popular
    • D3 is immense
    • Rickshaw
  • References:

Crystal Beasley (@skinny)
#wvpdx webvisions 2012
  • “I’ve got this really great idea for a site.”
    • sometimes they are, sometimes they aren’t.
    • The Post-It note: the innovation is the glue. But then design comes in and plays with it.
    • Observation of behavior: if we cut them smaller, they can be page flags. people won’t write on them, they’ll just place them in.
      • That’s not a technological innovation. it’s a design innovation.
  • “I’ve got this really great idea for a feature.”
    • For every feature you add, the UI complexity goes up (exponentially).
    • A simple cooking web site: shows one recipe, refresh to get a different recipe.
      • Very successful. Got a book out of the the deal.
  • “Let’s put a sentence under the button to explain.”
    • When you get to the point where you are trying to explain your way through a user interface, it’s time to back up.
  • “What we’re doing here is so novel.”
    • Not usually true.
    • Even when it is true, you want to make use of existing design patterns.
    • e.g. see the yahoo user experience guidelines for pagination.
  • I think the button should be on the right.”
    • Too many decisions are made on gut decisions.
    • “I think” is the least effective way to make that decision.
    • Don’t be a slave to your data either… Use data to inform decisions.
  • “I don’t want the user to do the thing they want to do.”
    • It doesn’t usually sound as simple as this, but this is what it boils down to.
    • maybe it is because it is counter to what your business wants, maybe it is because it is technically challenging. but you can solve it.
    • Maybe it is contacting support. (because it costs money)
    • But you have to help your customer. you have to help them do what they want to do, or you are alienating them.
  • “Maybe we need a FAQ”
    • better: give them bite-size bits of content where they need it, instead of a huge data-dump.
  • “Can’t we just pop up a confirm dialog?”
    • They interrupt too much. They are too harsh.
    • Instead, just support “undo” for whatever the action is.
  • “Let’s split this up into different steps so it seems smaller.”
    • The better approach: cut everything that isn’t absolutely essential out of the forms so there is less information to complex.
    • Recommended book: Web Form Design
  • “Make it red so it will really stand out.”
    • Then it becomes impossible to delineate what really needs to be paid attention to.
    • If you really must use red on your site, then you can use yellow for errors.
  • Navigation
    • Information Architecture
      • really important, takes time, taking learning vocabulary
    • Structural navigation: what does on what pages and how do we get there?
      • decisions are often made before a UX person gets involved.
      • Every single page should answer the questions: who are we? what are we about? where you are on the site.
  • Copy
    • Please don’t talk to users like they are a robot.
    • Error copy is particularly bad.
    • Read your copy out loud to a friend.
    • Does this sound like a sentence that one human being would say to another human being?
    • If you must have the dry robot speak, bury it under an a “more info” link.
    • Data
      • Plugins vs Extensions: Users don’t know the difference, and by dividing them into those two terms, if just confuses users.
      • Research technique: “card sorting”.
        • Put topics on cards, ask users to sort into categories and name those categories.
      • If your website organization mirrors your organization chart, then your navigation is definitely not working.
    • Jakob Nielsen Eye tracking chart: http://www.useit.com/eyetracking/
      • it’s an F pattern normally.
      • So keywords must be toward the top and to the left.
      • If the first few words of every page are the same or not useful, then you are forcing the user to have to read further, and they will miss the keywords.
  • Login
    • Did survey of top 100 sites: 
      • 90 out of top 100 sites: you can use all of the meaningful content and features of site without login
    • Make everything you can open on your site.
    • Login only when it is essential.
    • Otherwise, they will bounce away.
    • Don’t be greedy.
    • Gradual engagement is the term for this. http://www.lukew.com/ff/entry.asp?1128
    • “Remember me” checkbox
      • Login is not about security, it is about recognizing the face of your friend.
      • Do everything you can to remember your users.
      • Are you going to be like a bank and timeout after 20 minutes?
        • a 15 minute cookie does help protect the user against internet cafe type intrusions.
      • Are you going to have a 24 hour timeout?
      • Having a 24-hour session cookie vs. a 4 week session cookie doesn’t really buy you any security.
      • So either do a 15 minute timeout (if you are bank level security), or do a 4 week or forever cookie.
      • Amazon remembers you forever. But for the critical stuff (e.g. to change shipping address), you have to re-auth.
      • Facebook remembers forever. Google remembers for many weeks.
      • Best practice:
        • Remember forever/long time
        • Re-authenticate for anything critical.
    • Question:
      • Q: Does using Facebook authentication reduce friction?
        • Yes, reducing friction.
        • But, huge variability in user populations.
          • Some people love it, use it for everything.
          • Some aren’t crazy about it, would rather have their own login.
          • Then there’s the tin-foil hat crowd.
      • Q: Example of a perfect site?
        • Mint.com is really good.
        • BankSimple is doing some good UI stuff
        • OKCupid: gets the subtles of the UI right. Really good polish. The way they engineer interacts on the site so get value on both sites: the user gets value and the site gets value.
  • Q: Are carousels useful?
    • Not really
  • Q: Favorite UX/design trend?
    • Save as you go. e.g. No need to submit, no worry about losing a page of stuff.
    • Save as draft.
    • e.g. shoebox (receipt tracking, OCRs photos of receipts), evernote, 
  • Q: How do you convince a boss who says a lot of these things?
    • Data, data, data.
    • That boss will love spreadsheets.
  • Q: Information architecture / card sorting. Are there documented best practices? e.g. “For industry A, these are the results…”
    • Don’t know of anything existing. Because it is as unique as your content. If your content is different, then your information architecture is different. utility navigation may be pretty much the same.

    Discussing Design:
    The Art of Critique
    #wvpdx webvisions 2012


    Slides: http://t.co/u9mMXXBl 
    • What is critique?
      • critique and feedback are not the same thing.
      • feedback: gut response. instance reaction to something.
      • critique is an ongoing process: built on refining to create a better product.
      • it needs to be presented in such a way that it is actionable.
    • critique is about critical thinking
    • there are two facets to critique
      • giving and receiving
      • at their foundation is intent. the “why?”
      • why am i asking for feedback? why am i giving feedback?
    • giving critique with the wrong intent is selfish.
      • “I’m smart, this is wrong, I want to be validated that I’m smart.”
    • it’s about approach as well: “hey, congratulations on your launch. that’s awesome. i love the product. when you get a chance, i want to give you some feedback. can i buy you lunch or a beer or send you an email?”
    • Tips for giving critique
      • Use a filter: Gather initial thoughts and reactions. Revisit them in the right context.
      • Don’t assume: Find out the reason behind thinking, constraints or other variables.
        • Odds are, they had many constraints.
      • Don’t invite yourself: Get in touch and ask to chat about the design.
      • Lead with questions: Show an interest in their process?
        • What were your goals?
        • What were you trying to do with that?
      • Talk about strengths. Critiques are not just about things that aren’t working. It’s also about understanding what is working well: to maintain or to build on.
    • Receiving critique with the right intent takes humility and meekness
      • Remove yourself from the setting. It’s about the product.
      • Don’t ask for feedback if you aren’t ready to receive and act on and think about.
      • Remember the purpose: critique is about understanding and improvement, not judgement.
      • Listen and think before you talk back. Do you understand what the critics are saying?
        • Don’t be thinking about your rebuttal while they are talking.
      • Refer to the goals. Is what you’re hearing pertinent to the goals you’re trying to achieve?
      • Participate. Analyze your proposed solution along with everyone else.
    • Critique is a life skill, it is not a design skill.
      • It applies to sports, cooking, anything that you can do.
    • Making critique part of your process
    • Design Reviews
      • This is not part of design review. You can have 30 people in a design review. Half the people there don’t care.
      • design review is not a critique
      • critique is impromptu, or scheduled, but it comes before design review.
    • Critique is a skill. You only get better with practice.
    • Start small.
    • Think before you speak.
    • Choose who you critique with carefully.
    • Rules of Critique
      • Avoid problem solving and design decisions.
      • The designer is responsible for follow up and decisions.
      • Everyone is equal.
      • Everyone is a critic.
        • Don’t let people be silent…because they’ll come back two months later with feedback, and it’ll be too late to address it then.
    • Goals are critical for successful critique
      • Scope the critique session: “today i want to talk about flow”, “today i want to talk about this one UI component”.
    • Who should you invite?
      • 4-6 people.
    • Tools and techniques
      • Active Listening, question for clarity
      • Round robin
      • direct inquiry
      • quotas
      • six thinking hats: emotional perspective, behavioral perspective, etc. 
      • Facilitators
        • Helpful in the beginning, but as you get more experienced, you will want to take control of your conversation yourself.
    • Handling difficult people
      • Set expectations at the beginning. “We’re not here to talk about the color. We’re here to discuss this UI component.”
      • Make sure everyone understand critique.
      • Ask quiet people for feedback directly.
      • Refer back to personas, goals and principles.
      • Use laddering (the 5 whys).
      • Critique with people individually ahead of time.
        • Get them out of a group session. It’ll be more civil. They won’t flare their peacock feathers.

      content specialist on the UX team at AKQA
      (Sorry, again came 15 minutes late to session, so notes are incomplete.)
      • Dolphins use ecolocation to form a 3D projection of the world
        • Can also transmit the 3D representation to other dolphins
        • There’s no word for “tuna”. There’s a compressed 3D representation of a tuna.
        • Two dolphins from different parts of the world can come together and communicate a plan using 3D representations of the world, without having to use vocabulary or symbolism.
      • Scale of Context Dependency
        • an in-joke is an example of a highly context dependent communication
        • other end
      • Resolution
        • Project high, design low
        • We don’t know what resolution things will be consumed at. So we want to project at high fidelity, but design for low.
      • Speed
        • We don’t know what kind of frame rate an alien would receive.
        • So we again want to project for highest possible, but design for slowest.
          • e.g. we don’t design a website that requires the transfer of 3 mb of video data before getting to the point, for a user on a smartphone. 
        • Play at several speeds at once.
      • Strength
        • Build up the signal from a very low strength and give it a stop button.
        • Don’t send anything that, if returned, could kill you.
      • Channel
        • The frequency of visual spectrum, audio range. For humans, we know we can smell roses, hear certain range of sounds. With alien users, we can’t know. All of the animals we know can receive more than one channel.
        • So we want to use many parallel channels
      • Devices
        • Devices we’re born with: native devices. eyes, ears. signals being experiences as raw, direct.
        • Non-native devices: picks up channels we can’t physically receive and translates them into channels we can. We can’t receive radio waves, but we can translate it into audio signals that we can listen to. We can’t receive IP packets, but we can render a twitter stream visually in the shapes of letters.
        • Design for the native device:
          • The best way to represent a water bottle is with a video or a photo of it.
      • Assume the user has the ability to project a tool as an extension of itself
      • If you know nothing about your user, you have to do a lot of work. The more you know, the less work you have to do.
      • Don’t let the what ifs stop you.

      Trust Me, I’m a Designer
      #wvpdx webvisions 2012
      (Came 15 minutes late to session, so I am missing the notes for the first three principles.)
      • First: Keep Promises
      • Second: Show Results
      • Third: Know Your Voice
      • Fourth: Respect Context
        • if we give the user the wrong interface for their context, they aren’t going to trust us. e.g. giving them the full website experience when they are on their smartphone, or the smartphone experience on their desktop computer.
          • Context Prevents Confusion
      • Fifth: Transition Changes
        • Change Blindness:
          • If we go from one picture to black to a modified version of the picture, we can’t see it. We have change blindness. 
          • By comparison, if we transition directly from one photo to the other without anything in between, then we can easily see the change.
          • By default, web page loads are more like the former: you click a link, the page goes away, and a new page comes in. It may not be obvious what happened.
          • If we use transitions, it preserves context and makes the user feel more comfortable.
      • Sixth principle: Guide, Don’t Dictate
        • Our natural tendency is to tell people what to do. And we tell them the way we would do it.
        • But we don’t like being told what to do.
        • Showed version of gorilla video: people passing ball, count the passes.
          • except a player leaves the team and the curtain changes color.
          • no one sees that.
        • When I tell you what to do, then you’re going to focus on it. 
          • They’re going to worry that you’re trying to do a sleight of hand on them.
          • Don’t fall for the sleight of hand.
        • If you guide someone, if you give them choices, then they are going to trust you.
      • Seventh principle: Show, Then Tell
        • We seek patterns
        • Example website:
          • Each page has a very large photo that identifies the page: e.g. an image of a building he built, a photo of a person for the bio.
          • the image sets the tone for the page.
          • then give the text
      • Eighth principle: Make it simple, not simplistic.
        • Steve Krugue: Don’t make me think – http://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758
          • But he’s not saying “Don’t let me think”
          • Simple: Don’t make me think
          • Simplistic: Don’t let me think
        • Example: netflix
          • interfaces are context specific and very simple
          • interface is simple: just photos and titles
          • but I roll over titles to see the details, drill in and get more details, search on attributes
          • unveil the information when people need it
      • Ninth Principle: Always Leave Them Wanting More
        • To be persuasive we must be believable; to be believable we must be credible, to be credible, we must be truthful. — Edward R. Murrow

      Jason Grigsby spoke at Hewlett-Packard today on Mobile, in a talk called Casting Off The Desktop Shackles. Here are my notes:
      Casting Off The Desktop Shackles
      Jason Grigsby
      @grigs | cloudfour.com
      • Basics
        • Don’t skip core functionality.
          • Example: there’s no way to add RSS feeds into certain RSS readers
        • URLs should go to content, not mobile home
          • really poor implementations of separate sites
        • Why go to the desktop web?
          • The NYT does this… gives you the mobile site, unless you know to change the url. Even though they have a great mobile site.
      • People will do anything on mobile if they have the need
        • complex tasks
        • write long emails
      • Our vision of mobile context is often wrong
        • We think that all mobile cases are people walking down the street
        • Actual
          • 80% during misc downtime
          • 76% while waiting in lines
          • 62% while watching TV
          • 69% for point of sale research
          • 39% use on the toilet (61% are lying)
        • We can’t know the mobile context
          • We can’t know where they are, or what they are doing.
        • Mobile is the 7th mass media
          • printing press
          • radio
          • recordings
          • tv
          • internet
          • mobile
      • 8 unique abilities of mobile
        • 1) incredible personal (not shared, even with spouses)
        • 2) always carried (within arms reach, slept with, etc.)
        • 3) always on
        • 4) builtin payment channel (itunes or google wallet, or using carrier billing to buy groceries)
        • 5) available at moment of creative impulse
          • the best camera is the one you have with you
          • the best notetaking app is the one you have with you
        • 6) accurate measurement
          • a phone is likely to be 1 person
          • groundtruth has logs from most carriers, will give you analytics for sites compared to competitors
          • one ID always (as opposed to many different browsers/cookies on desktop browsers)
        • 7) social context
          • your phone knows where you are, who you are supposed to meet, and when. It can do really powerful things with that knowledge: automatically detect you are going to be late to an appointment, txt the person you’re meeting, and pop open directions to the location.
        • 8) augmented reality
          • ability to hold up your phone and see augmented information in real time.
      • mobile is the most borg-like technology we’ve ever seen
        • in 2005, more phones with cameras were sold than all the digital cameras up until that point.
        • garmin ruled the GPS market, and now they are a drop in the bucket.
        • mp3 players went by the wayside
        • lesson: If you are making a product that has some kind of mobile use case and/or sensor, you have to think about what happens if phones adopt that sensor. Where would that leave you?
      • Check out John Allsopp, Dao of Web Design
        • “When a new medium borrows from an existing one, some of what it borrows makes sense, but much of the borrowing is thoughtless, ‘ritual’, and often constrains the new medium. Over time, the new medium develops its own conventions, throwing off…”
      • What are we borrowing from the previous internet – the desktop internet – and what do we need to get rid of?
        • Why do we need to look at phones to get directions? One vibration to turn left, two to turn right.
        • Old saying: Asia is two years ahead of Europe, and Europe is two years ahead of the U.S.
      • Digital Divide
        • In Asia and Africa
          • ~20% of ecommerce / mobile banking occuring through the web
          • compared to 2.5% in the U.S.
        • Blacks and Latinos ~60% likely to use phones for internet connectivity, compared to ~40% for whites. For most, it is their only access to the internet.
          • So anything that is going to be done online(applying for jobs, banking, purchasing) must be possible via mobile
        • Used for purposes we wouldn’t imagine here…
          • cellscope: a microscope attached to an old nokia phone used to MMS send bloodwork photos to cities for analysis when working in remote villages.
          • farmers using mobile access to figure out where to get the best prices for their goods.
        • textually.org: stories about people interacting with mobile tech
        • mobileactive.org: supports people doing this kind of stuff
        • StatCounter Global Stats: Mobile vs. Desktop in Nigeria
        • Africa is the Silicon Valley of banking. The future of banking is being defined here…It’s going to change the world.” — Carol Realini, executive chairman of Obopay
        • If it works in Africa, it will work anywhere
        • 25% of internet users in the U.S. access it only via mobile
        • (and it goes way up from there… 70% in Egypt.)
      • Polar Rose. Bought by Apple.
        • Recognizr app: Uses facial recognition and then displays social network information for that person.
        • Google Goggles can do the same thing, but Google has decided not to release it yet for fear of the backlash.
      • Luke Wroblewski’s First Person User Experience Presentation at http://www.likew.com/presos/preso.asp?21
        • Dozens of sensors in a phone. What can be done with them all? We’ve only scratched the surface.
      • Is mobile a new mass media?
        • (Yes)
        • Is mobile web part of that new mass media?
          • Mobile web is a bit of a half-breed – it is part mobile medium and part internet medium so it inherits traits from both. — Tim Kadlec
          • This is discouraging.
          • This would make me hang up my HTML and go learn objective C.
        • Tim Kadlec also said that mobile phones are the closest thing we have to those futurist science fiction always-on-always-there devices that do everything.
      • Mobile Apps Must Die
        • Upcoming zombie apocalypse of devices
          • android is in everything.
          • price of everything is coming down.
        • Lots of just-in-time interactions. Getting a restaurant menu, get bus locations, unlocking a car: You dont want to install an app for every possible thing to do. The only thing that can scale this way is web technology.
      • Questions
        • Security and the lack thereof: enabler or disabler?
          • Every app is at some point jailbroken and cracked and put there out on the web.
          • You can never trust the client, whether it is javascript validation, or a mobile app. Relying on server security.
        • Do you see mobile replacing a lot of print?
          • It’s inevitable that a large percentage of things that are printed won’t be printed in the future.
          • I buy everything on the iPad. I don’t want books anymore.
          • I get the newspaper because I believe in supporting local news coverage. But if I could pay for it electronically, I would.
          • No medium has replaced any other medium. There will always be things that are printed.
          • I’m as mobile as you get, and I still have two printers in my house

      Pig-Faced Orcs: Design lessons from Old-School Roleplaying Games
      James Reffell
      @jreffell
      designcult.org
      Slides:
      • This is not a gamification talk
      • photos: first convention badge at age 11, awesome map he drew of a dungeon as a kid.
      • Old School Roleplaying Games
        • Chainmail – 1981
        • D & D – 1974
      • There were army games before, but you played an army. The twist was that then you played an individual.
      • D4 version:
        • Give them something to manipulate.
        • Use randomness to generate a story.
        • Use sandboxes and railroads.
        • Enable risk-taking.
      • Give them something to manipulate
        • if you’ve ever done pen and paper rpg, people fiddle with the dice. They are there for randomness, but people play with them, build towers with them.
        • random number generator: you have to move the mouse around a whole bunch to generate a random string.
        • ipad app: for etch-a-sketch. you shake it to clear the screen.
        • Having things to fidget with helps you concentrate without distracting you
        • But we need more things..
          • Texture
      • Use randomness to build story
        • dice/randomness are used, in a very exposed way, to build narrative and build tension. you worry if you will win the fight.
        • Example: rumor table – from d&d adventure. rumors are given out to players at random.
        • One of the classic examples in social media is asking people to contribute content. what should they write about? they often don’t know. sometimes they use a “topic of the day”. but what is that is randomly generated?
      • Use sandboxes and railroads
        • In a sandbox game, players can explore a world. But you really don’t know what is going to happen next.
        • A railroad game has a plot. You don’t know exactly how it is going to go, but it’s got good guys and bad guys and you know who they are.
        • Amazon 
          • A sandbox world. From a product page, you can do anything:
            • you can buy it, you can see other objects like that, you can see stuff that other people who liked that thing liked, you can read reviews, you can go to forums or to wiki, you can see stuff you bought. 
          • A railroad world. From the shopping cart page, there are no distractions, no navigation links. You are heading toward purchasing the product.
      • Enable risk-taking. (Carefully.)
        • In RPG, sometimes characters die. You become even more attached to the characters who don’t die. Characters who die create memories.
        • We don’t want to risk user data, or risking their privacy exposed.
        • Good examples:
          • Bidding on eBay. You have the risk of losing – not winning the bid.
        • Fun failure is a way to prolong the game experience.

      Mapping A Unified Experience Across Multiple Devices
      Erin Jo Richey
      @erinjo
      • Maintaining a core vision
      • Working across..
        • Televisions, Cars, Kiosks, ATMs, table surfaces, displays refrigerators, mirrors. 
      • Habits of online newspaper readers, by device and time of day…
        • 97% of views on computer, 2% views on smartphone, <1% on tablets.
        • In early morning, more likely to use smartphones and tablets. During the day, people more likely to use computer. In the evening, phone and tablet skyrockets, and computers fall off.
      • Marketing strategies…
        • multichannel marketing: Sending out messages to multiple places. Just because you are communicating to all these channels doesn’t mean you have a strong campaign.
        • Cross channel marketing: You are sending out to multiple places, but you are targeting messages and collateral to the platforms where it works best, reaching them where they are with the right message at the right time. 
      • A continuous system, until it breaks.
        • Example: You bought a product on Thursday, and on Saturday you get a message about a discount for buying it. The communication strategy should be integrated so that the mailing list suppresses the addresses of the people who just bought it. 
      • Need information architecture strategy
        • Top down: user needs > company needs
        • Bottom up: where are customers now>
        • Push and pull marketing
      • So we’ve got all this activity, all these pressures from all different directions.
        • It’s a spider web, a messy bunch of interconnections
      • We’ve got to build bridges across experiences.
      • Environmental design…
      • http://bit.ly/kCTBLz / http://bit.ly/bundles/erinjo/3
        • Worksheet available as Omnigraffle or PDF
      • Worksheet goes through
        • External Forces (the nest) — influence
        • The design your company creates (the egg) — control
        • The internal Forces (the egg) — influence
        • You can influence some of the external forces and the internal forces. But you can control the design.
      • The Egg
        • Message – the campaign, marketing message, or brand slogan
        • Content Item – the unique content item
        • Task – what task is associated with the content
        • Frequency – how frequently are these tasks performed?
        • Urgency – how urgently is the information needed or tasks get completed?
        • Privacy – is this content intended for one person, multiple people…
        • Intimacy
        • How to Track – How do we track usage
        • What to Measure

      The Best is the Enemy of the Good:
      Similarities in Perfection Between Magic and Design
      Jared Spool @jmspool
      Reed Spool
      • demo: magic show by reed spool, manipulation tricks
      • Thurston – World’s Famous Magician
        • first person to do large stage magic
        • would travel with nine rail cars
      • Early magicians and the world of magic have a lot of parallels with experience design
      • Magicians focused on
        • Creative aspects of work
        • But also on business – how to make it into a career
        • Community of Practice – magic conferences
      • Mastery
        • Pattern
          • Beginning
            • starting out in magic is really hard.
            • unless you are a surgeon or a watchmaker, this is probably the hardest thing you’ve ever done.
            • magic is inherently deceptive. the most advanced magicians do the hardest tricks and make it look simple
            • as a beginner, you might see dove magic, and be inspired by it, and want to do it, yet it turns out that working with live animals is one of the hardest things to do it.
            • to learn, it’s hard to know how to do it, what it is supposed to look like.
            • starting learning with coin magic. duller than doves, but easier to learn
          • Mimic
            • say one coin magician, and was so inspired by his mastering, that he set out to mimic everything this guy had done. to be able to do all of his tricks, the way he did them.
          • Innovate
            • a new innovation is the picture frame idea: you want the magic to fit in the picture frame if someone takes a picture. you also want the magic to be near your face, because it adds emotion.
            • when studying classical magic, the thimble routine, for example, you are studying someone else and trying to understand why they did it the way they did it: are they concealing something, or do they need their hand in a position.
        • Word processing
          • Wang 2200
            • first word processor
            • cost $14,000. 
            • in a one week training class, you would learn how to save a file, open a file, and change the ribbon. in the week two advanced class, you learned bold and italics.
            • people would pay for this! it was an advantage over where existed before.
          • Then came WordPerfect. It wasn’t about the technology, it was about the features. They added more and more features. They gave you cardboard cutouts to remember all the commands… you’d put the cutouts on the keyboard or monitor.
          • Then came Microsoft Word. Now it wasn’t about the features, it was about the experience. You didn’t need training or cardboard cutouts.
        • This pattern repeats itself: technology to features to experience. 
          • Similar to magic: beginners, to mimic, to innovate.
        • Beginner Example: Lingscars.com
          • Web site sucks. But she’s just a beginner. She doesn’t know.
        • Mimic Example:
          • AOL website – copied the design of Yahoo, which came out 6 months earlier.
        • Books too…
          • Beginning: …
          • Mimic: Information Architecture (polar bear book)
          • Innovation: Designing Interactions
        • Are we plotting the path of mastery?
      • Renaissance Man (or Woman)
        • Knowledge of every aspect
          • Did a performance in a middle school.
            • the light setup was pale yellow lights. he asked for a spotlight. he wanted something big that didn’t move.
              • what he got was a tiny spotlight that followed his hands.
              • he asked the lighting guy… what I wanted was this… the guy described, and gave him the words to describe what he wanted. now he can communicate with a lightning guy to the extent of saying what he needs,
            • these things aren’t magic. but they are part of performing. he needs to know a little bit of everything to be able to put on a good show.
          • What do you do when there is an emergency
            • decide whether it can be salvaged or thrown away
            • do that
            • forget about it until the routine is done
            • after the show is over, when you’ve gone home, pick apart what led up to that mistake, what happened during the mistake, and how you recovered. could it have been avoided? or did you just need an out? someway to get to a better place.
          • Yearn to learn
            • be in a constantly learning, constantly observing state. if there is a magic show, i will go, even if i expect it to be crap. 
            • pick up a kid’s book about a topic. some of the best stuff is in these kid’s books
        • Experience Design
          • Many basic skills to experience design. 
            • information architecture, usability practices, visual design, interaction design, copy writing, editing and curating, information design.
          • There are many other skills…
            • social networks, agile methods, analytics, use cases, marketing, technology, roi, business knowledge, domain knowledge
          • And soft skills
            • critiquing, facilitating, sketching, storytelling, presenting
          • And yet the teams that are doing this stuff are getting smaller. The notion that someone could specialized in just one of these skill areas just isn’t workable.
          • T-shaped man vs. Dripping Paint Model
            • T-shaped man says there is breadth, and one area of deep expertise.
            • Dripping paint model says there is breadth, and there is expertise in many areas, of varying depth.
          • magic trick by jared spool: 
      • Practice
        • Practice is not the work. Practice to maintain and improve skills.
        • Practice solidifies things. Perfect practice makes perfect.
        • When you don’t know how things are supposed to look, it’s hard to practice. Practice comes from reading the book over and over again with the props in hand. Or watching the youtube video over and over again.
        • Since some moves, even difficult moves, require talking at the same time, it means the move must be done with the back of your brain. So you have to practice the move over and over again without even thinking about it.
        • Practice never becomes fun. You have to make it fun.
      • In the design realm, we have a lot of skills we need, but we rarely get to practice them. 
        • We do one group exercise in which teams of 5 have 90 minutes to come up with a paper prototype. Then we have users come in and try to use them. Teams compete to see whose users can do the job best. In 90 minutes, they are practicing prototyping, sketching, usability, interaction, etc.
      • The Best is the Enemy of the Good
        • In the engineering world, we hear “we just need to be good enough. we’ve reached the point of diminishing returns.” the best is the enemy, because it is a waste of effort.
        • In the magicians viewpoint, good is not satisfactory. It is the enemy… it is not enough to be good enough. You have to be the best at what you do.
        • Perhaps magicians have the benefit of experience. 
      • The Best
        • Are we plotting the path of mastery?
        • Are we building renaissance people?
        • When do we allow ourselves the time, space, or budget to practice?

      I attended Lean Buley’s virtual seminar on lean UX methods – lean as in lean production. A core tenant of lean production is to avoid producing waste. If you are a UX team of one person, then you don’t have to time to generate anything that isn’t of value.

      It was a great talk, and I love the high-value tools that she suggests for lean UX. Below you’ll find my raw notes for her talk, and her slides are available.

      Lean Methods for a UX Team of One
      Leah Buley
      From Adaptive Path
      • Jared Spool: Activity centered design is the most expensive form of design. But it gets results.
      • How can we streamline the work we’re doing to make it leaner?
      • Taiichi Ohno created the Toyota Production System – first Lean Production System.
      • Lean comes from production systems. Fine-tuned to eliminate waste.
      • When Toyota came to U.S. to observe auto production systems, they saw that there was a ton of waste: stuff sitting around. On the other hand, they were really impressed by grocery stores, where stuff was only ordered after it had been sold. Inventory levels managed really tightly.
      • James Womach, wrote The Machine That Changed the World and coined the term “lean”. Patron saint of Agile.
      • Getting to value as directly as possible by eliminating waste whenever possible.
      • Eric Ries – you should test your hypotheses against reality as early as possible. Learn, evolve, and repeat. “lean startups”.
      • Janice Fraser, founder of adaptive path, says early stage companies need design skills in house, and the best way to get that is to train principles into the company to get people to have design principles.
      • Lean wondered: can lean concepts be applied to UX so that things can be sped up, more efficient. It’s not just to avoid being wasteful, but to also ensure that useful, valid designs come out of the process.
      • How to Be a UX Team of One
        • A 2008 presentation
        • Suggestions are focused on frustrations and dreams to accomplish UX on your own.
        • How to do brainstorming techniques, how to assemble an ad-hoc team, and techniques for selecting ideas.
        • Feedback suggested that lots of people in this same situation.
      • What are the challenges for UX Teams of One
        • From 300 respondants in survey, open ended question.
          • Building a basic understanding of UX (17%)
          • Getting permission to do the workd (13%)
          • Communicating/selling ideas (12%)
          • The daily grind – 12%
          • Time – 8%
          • Politics – 7%
          • No strategy – 7%
          • Creative Isolation – 6%
          • Status quo – 5%
          • Terrority disputes – 5%
        • Building a basic understanding of UX – in depth
          • Confusion about ux vs marketing or visual design
          • Weak commitment to the findings of UX
          • Uncertainty about where ux should fit into preexisting processes
          • No trust that ux will have meaningful improvements on the outcome
          • Misbelieve that we know/are our users
        • Getting permission to do our work
          • Problem:
            “Right now I know our interface is clunky but I have to wait until a sufficient number of users experience difficulty to change it.”
          • Success stories:
            “I’ve been working on earning the confidence of others to trust my judgement and apply my design / ‘suggestions’ the confidence was gained over time as my input continually improved product development. It is/was a difficult path that has proved to be rewarding.
          • It’s not enough to do one project successfully. Trust has to be built over time.
        • Communicating / selling ideas
        • Challenges feed into each other, build a system:
          • Lack of understanding/support for ux leads to:
          • No permission to do user research / ux, which leads to:
          • You just try to do what you can, but…
          • There’s too much to do, not enough time, plus…
          • The politics, leads to…
          • Fear of change, little strategy, territory disputes, fighting
        • The foundation, or lack thereof, undermines all the rest.
        • Things UX people love:
          • Doing good design – 20%
          • Helping people – 19%
          • Solving problems/puzzles – 17%
          • Seeing your work live – 10%
          • Listening to real people – 7%
          • Empowering others – 6%
          • Learning – 6%
          • Creative freedom – 5%
        • The Result is that:
          • We spend a lot of time on Methods and Deliverables (we what love, and where there is no conflict)
          • And not so much time on Relationships (which is where the contention is).
          • (but relationships are what build understanding.)
        • Why…
          • “I’m good at making stuff”
          • “Hard conversations are hard”
          • “Helping users is the right thing to do”
        • If you let these things drive you, then you won’t actually make inroads into UX and helping the users because you won’t be effective.
        • A Different Approach: Less time making things. More time for people.
      • The Roles of Methods and Documents
        • Method as a Trojan Horse: not everyone agreed that they need UX, but they do agree that they need wireframes.
        • We want the UX people not just to develop a document, but to guide the whole process.
        • To Build a Basic understanding of UX à convey goals and processes
        • To get permission to do the work à convey summaries and rationale
        • To communicate ideas à make them as bite-size as possible
        • To Save Time à create a self-documenting process
        • To deal with politics à use open questions. Invite people in to discuss their agenda and concerns.
        • To set a strategy à convey the priorities
      • The Lean Methods
        • Core Concepts
          • Eliminate waste.
          • Understand what parts provide value. (Lean values anything that customers will pay for.)
          • Less time making things. More time for people.
        • Value Mapping + UX
          • Assessment: identify issues with existing design or make the case for a new design
          • Planning: establish a plan and goals for UX work
          • User research: learn what users want and need
          • Strategy: create a vision and priorities to help achieve goals
          • Design: specify what we’re going to make. How it should look, feel, work
          • Testing/Usability: Confirm that we’re making actually does what it needs to
          • Maintain: see how the design holds up to actual use, make incremental improvements
        • The problem is all this is that it doesn’t make sense to people, so we need to communicate the value of what we’re doing, not just execute a process.
        • Assessment Methods:
          • Methods: current state analysis, heuristic analysis, usability test, content audit, etc…
          • If you don’t have clear business goals as a foundation, it’s common for this case to be built upon subjective goals. For example, “our customers are complaining” or “we know it sucks”.
          • Heuristic method:
            • How: Start at the beginning of the site or service. At each step, take screenshots or pictures. Write directly on the image what’s confusing.
            • Creates a very visual document that you can send around to raise awareness of design issues.
            • What it can answer: basic awareness questions? What kinds of issues does UX address? What opportunities do we have for improvement?
          • Survey
            • How: Send around a survey to internal stakeholders. Ask them about their goals for the web site, what parts need improvement, and their understanding of users.
            • Invites others to share their expertise and vision. Creates a starting point for further conversations. People will want to hear what you find. It’s self-documenting.
            • What it can answer: How much support for change is there? What business goals do people have?
        • Planning Methods
          • It’s common to jump into feature enhancements without a clear articulation of the goals of the work. The specific business and user value that the work is intended to bring.
          • Typical methods: stakeholder meetings, use cases, task flows, agile backlog, roi analysis, product roadmapping, system modeling, design principles, content strategy.
          • Project Brief:
            • How: Create a one page overview of the project. Include vision, functional requirements, and design principles or user goals. Setup a meeting to review and “redline” with others.
            • Puts the goals of a UX project in an appealing summary and invites people to think about what you’re trying to accomplish.
            • What it can answer: do we all agree on the goals of what we’re trying to accomplish?
          • Experience Poster:
            • How: create a poster-sized view of the core experience you’re designing. Include the “mantra”, how it relates to personas,inspiration, core features. Hang it up where people can see it. It’s like an experience mood board.
            • Large format invites others to walk by and engage with it. Hang it in the team workspace for a constant reminder of the experience you’re creating.
            • What it can answer: What’s the design vision? What’s the coherent vision? What’s the feeling?
            • You can do this as a workshop: make a template, then invite others in to help build it.
        • User Research Methods
          • Learn what users want and need.
          • This phase often lacks clear goals. Anything that could help establish go-no-go decisions. Heavily reliant on interpretation of researcher. Depends on trust of researcher.
          • Typical methods: product survey, manual intercept surveys, contextual inquiry, bespoke research study, secondary research, mental model diagrams.
          • Proto-Personas
            • How: Schedule a meeting. Divide people into groups and give each group a user type. Ask them to envision their user’s state of mind, motivations, environment, and key needs. Let them pick out a picture to match.
            • Invites the whole team to envision users’ state of mind.
            • What it can answer: How much do we think we know about our users. What questions do we have? What do we need to confirm?
            • It’s easier to build support for actual user research once people have tried to envision these personas, and personally felt the absence of information where they need it.
          • Surrogate Test
            • How: If you can’t meet with users, find someone who knows about the users: e.g. a call center agent. Meet with them. Look at the site or service with them. Ask them to explain where it breaks down for the user.
        • Design Methods
          • Typical methods: wireframes, etc.
          • Storycard
            • How:  Pick a concrete user need and make it granular. Write it on a card. It it helps, use “as a…” I want…” “so I can…”. Start designing.
            • Have meetings to make and review these cards. Keep passing the cards around to remind people of what you’re working on.
            • What it can answer: what are we priotizing next? What specific outcome are we trying to make possible?
          • Co-design workshop
            • How:
              1. schedule a meeting.
              2. Everyone draws their vision for the design.
              3. everyone talks about their design.
              4. everyone throws away their drawings and draws again.
              5. everyone talks about what they drew.
              6. repeat steps 4 and 5.
              7. final designs should be closely aligned toward shared group goals.
            • Everyone gets to share their vision for design and has to listen to others
            • What it answers: what are outlying ideas for the design vs. common, shared, core ideas.
        • Testing / Usability Methods
          • 5 second test:
            • How:
              • Show users a design for 5 seconds
              • Take it away
              • Ask them some questions about the design
              • See what they can remember
            • Invites team members to watch, participate. Best if you can get users involved too.
            • What it answers: do we all agree on the goals of what we’re trying to accomplish?
          • Paper Prototype
            • How: Print out in progress designs. Find someone to test with. Give them a task and ask them to show how they’d do it using the designs in front of them.
            • What it can answer: Is the design working as expected? Are we on the right track?
        • Maintenance Methods
          • Typical: analytics, search logs, etc.
          • UX Health Check
            • How:
              1. schedule a recurring meeting
              2. make a spreadsheet
              3. break the site into sections
              4. for each section, choose relevant comparators
              5. for each section, decide how good it needs to be vs. its comparators
              6. for each section, grade how grade it is vs. comparators
          • UX 18-month plan
            • How: Make a list of UX achievements you want to accomplish in 18 months. Working backwards, think about where you need to be in a year, and then in 6 months. Make it a part of your goals.
      • A Lean Toolkit
        • Tactics:
          • Simple artifacts: posters, and one sheets, and cards.
          • Meeting and activities: reviews and co-creation
          • Lo-fi: screenshots, drawings
          • Gather data as you go: surveys, annotations
          • Don’t be a purist: proxies, provisionals
          • Time constraints: timed tests, short surveys
        • How to Plan a Method:
          • What are the goals of the method?
          • What pieces and parts need to be there?
          • How can they be combined?
          • How can be it self-documenting?
          • How can we invite co-creation?
          • In what ways are you willing to compromise?
        • Mantra:
          • Less time making things. More time for people.
      • Questions:
        • Q: I’m a product manager. Do I have to be a designer to be good at UX?
          • A: UX is a philosophy, anyone can be good at it. Being able to balance user needs. To make a product that has relevance in people’s lives, to empower them, rather than frustrate them.
        • Q: How do you work UX into a process that is being driven by an outside design firm that isn’t that UX centric?
          • A: UX isn’t an activity that you insert into someone’s process. UX is a perspective that you can bring into every conversation you have. People who are good at it are people who can bring gently into every conversation a reminder to look at it from a user-centric balance, without being challenging or confrontation.
        • Take small, experimental steps towards UX. If you don’t have permission to do a longitudinal study, you can do something smaller that you don’t need permission for.
        • Q: If you are an independent UX consultant, how can you really be effective, if you come in and then go away?
          • A: It’s about the power to teach people to fish. They can not just do a little work, but teach the people there what they’ve done, and how to do it. You are helping to bring the knowledge in house. Then it always gives you an opportunity to check back in, provide more help.
        • Q: What are good ways to discover when we have wrong beliefs about our customers?
          • A: There’s nothing like seeing the real thing. There’s nothing more powerful than a video of a user saying “I’m confused now”, and on the screen you can see they are looking at your web page.