Christine Outram: What Starbucks Gets that Architects Don’t

Christine Outram is a former architect, MIT research fellow and currently a designer at a brand strategy agency.

She talks about how architecture has focused on form without listening to consumers, to the people inhabiting the spaces they design.

Love what she says because it applies to any job that is supposed to serve people, but has grown self-referent (i.e. marketing, Dribbble design).

Dear architects,

You’re outdated. I know this because I once was one of you. But now I’ve moved on. I moved on because despite your love of a great curve, and your experimentation with form, you don’t understand people.

I correct myself. You don’t listen to people.

In legal terms, an architect is the all seeing, all knowing, building professional….

…But the truth is, most of you don’t try. You rely on rules of thumb and pattern books, but you rarely do in-depth ethnographic research. You might sit at the building site for an hour and watch people “use space” but do you speak to them? Do you find out their motivations? Do your attempts really make their way into your design process?

This really hit home for me when I read a recent article on the design of Starbucks stores. Now you might hate Starbucks. You might believe they are a soulless commercial entity with no architectural merit at all, but do you know what they are good at? Responding to people’s needs and desires.

The article reads:

Starbucks interviewed hundreds of coffee drinkers, seeking what it was that they wanted out of a coffee shop. The overwhelming consensus actually had nothing to do with coffee; what consumers sought was a place of relaxation, a place of belonging.

My dear architects. This is why Starbucks designed round tables in their stores. They were strategically created “in an effort to protect self-esteem for those coffee drinkers flying solo”. They were not round because the architect felt it looked better that way, they were not round because they were cheaper, they were round because as the article concludes “there are no empty seats at a round table”.

No wonder architecture has become a niche vocation. You don’t connect with people any more.

The problem is that architects seem to pray at the feet of the latest hyped-up formal language. I dare you. Flip through an architectural magazine today. Find any people in the photographs? I didn’t think so. Find plenty of pictures that worship obscure angles and the place where two materials meet? You betcha.

5 Ideas I liked (since January): Pie + Creative brainstorming, Google work philosophy, Watercolor Typography, Facebook Userflow

1. One of my favorite ideas in the past year.

Pie + User Feedback or Community Involvement + Design = PieLab

2.  This PaidContent article on the insensitive coincidences of online ads and tragic news stories (e.g. shooting massacre articles and bloody novelty shirt ads).

Screencap by Evan Brown

3.  “Why Google Does Things The Way It Does“, by The Guardian.

Thought-provoking.  Because you keep hearing about how Google is revolutionary, but they’re never as suave at branding themselves as Apple, plus they have weird ideas like Google glass, and annoying decisions like killing Google Reader:

“In its behaviour and vocabulary, Google oozes scientific method. A couple of times recently I’ve heard Google executives say in public, ‘if you can’t measure it, you can’t improve it’. …engineers are trained not to act on intuition. You are allowed to have intuition, of course, but you use it to make hypotheses, which you then test. You act on the results of those tests…

When an experiment is completed, you either choose to follow up on it, or you terminate it and move on to something else. A scientist doesn’t get emotional about this; it’s the way the system works, and everyone knows that it’s all for the best.”

4.  I don’t know which I enjoyed more – the Maricor/Maricar watercolor typography exercises…

Or the Shillington Design Blog “I Love These Guys” category page, where they were featured?

Shillington Design Blog - MaricorMaricar
Shillington Design Blog – MaricorMaricar

5.  Facebook sharing its “Report Abuse” interaction flow.

Usability and User Experience: 5 articles that help clarify my job + a fun chart!

I would like to thank my twitter feed, for bringing me links that would help me explain to the clients and managers I work with, the nuances of what they’re trying to achieve.

User experience is some sort of buzzword in the web design and product development circle.  Or at least in the company I work in.

Managers talk about it, and the designers “name-drop” it.

My boss calls me a usability professional.  Sadly, it’s not what I want to be or want to be called, nor am I equipped to be one.

1.  Clarify what you’re aiming for

This piece in UX Matters, entitled More than Usability: The Four Elements of User Experience Part I helps explain my predicament.

See, I want to be a User Experience professional.  I want to be a user researcher and, hopefully, an interaction designer.

That is much more than usability.  Usability only refers to the ease with which you are able to do something.  Whether a task can be accomplished or not; whether people make errors and how easily they navigate through a device or interface.

A user’s experience (hence the phrase “user experience“) can’t be oversimplified into just how easy it is to do something (otherwise it would just be called “user ease”).

It has to be enjoyable to use, or give some sort of value.  It’s an entire package of sensations and delivery beyond “efficiency”.

As the article points out, it’s usability + value + desirability + adoptability.

Multiple frameworks have already cropped up I know, this just seems to be the most concise and memorable one I’ve seen (so it’s easy to repeat).

Frank Guo’s User Experience Framework

2.  Acknowledge that it takes a lot of humility, emotional maturity and self-restraint (not just creativity and camaraderie) to make a multi-discipline group work together

Richard Anderson writes, in depth, about the multiple perspectives on “working in silos”.

This strikes a chord because a) there’s this one particular boss in our corporation who loves using the word “silos”, in meetings, to repeatedly refer to why it’s difficult to create successful strategy.

b) Because I’ve realized that product development teams are composed of people from different educational and professional backgrounds, all required to be creative and productive together.

The really really great thing about Anderson’s entry, is that he argues for both the good and bad sides of deferring to each other’s expertise and “leaving your _____ hat at the door”.  Because, that is how complex the UX design team situation is.

On one hand, you do want to respect that the designer knows design best, the developers know code best and the researchers know social sciences best. But, yes, once you’re all discussing “UX”, everybody really tries to stir the pot and get their hands in the stew.

I also like his conclusion, regarding the collaborative process centering on delivering a “good experience” to the consumer.

I wish it were that easy, though.  When put in practice in real life.  But at least, in terms of corporate evangelization, Anderson’s articles and talks (“Borrowing from the field of child development…“) would be very helpful in explaining how team division and conflicts should be dealt with.

Richard Anderson – UX Working team objectives

3.  Dirk from Involution Studios writes about his (seemingly scathing) reaction [“Losing faith in UX”] to a Whitney Hess article, which, to be fair, did seem to put UX designers on a high horse.  Or a much higher horse than she should have.

I sympathize with Mr….. Dirk.  Despite my not having worked in or with as many start-ups.  Mostly because of humility.

I am humbled by my new-ness in this field, and by the fact that, realistically, I am primarily a market researcher and a user researcher.

Meaning: As much as I badger and hammer my digital strategist teammates to refine their strategy (or actually make a sound one), since I’m the one who “knows the user”, I respect the difficulty of what they have on their plate.

Product Strategy, particularly in my team, is differentiated from…my role – user research.  And, as much as, sometimes, I’d like to think I could create better strategy, it isn’t my job to and I honestly wouldn’t enjoy just doing that day-in and day-out.

I’ve always been the one checking how people respond to products or content, or finding out user needs, but it’s a whole other level of responsibility to put a product out there and your ass on the line, juggling business decisions and all.  This is why I particularly dream of becoming an Interaction Designer, not a Product Manager or Brand Strategist.  I’d rather work with systems, framework and evidence, more than price points and competition.

To each his own, basically.  I just hope that people had as nuanced a view about work.

4.  This is really more for me.

I like how this UX matters article articulately differentiated the disciplines behind Agile and User Experience.

Again, being new in a web design team, these are phrases I kept hearing over and over and over during my first weeks of work.

It was almost funny, sometimes.  People would get into lengthy discussions or arguments on what kind of method to use, when, if you really thought about it, it’s not as if they were mutually exclusive.

This article, Agile User Experience Design, communicates how “Agile” is a web development process and “User experience” is a design tenet and methodology.  They can actually work together.  Please read the article if you want to know more; Ms. Janet Six is much more articulate.

5.  On a lighter note, there’s also “How to annoy a UX designer“.

It’s really practical and funny at the same time.  Thank you very much, Peter Hornby, for writing this.
Worst answer—You’re kidding, right? You’re employing me as a UX designer, and you want me to code? Sure, I’ll hack something together. Perhaps we should discuss my hourly rate?

And this really fun infographic! on chart types 🙂

Link Glut (Part II): User Research

1.  I’m going to start off with a Jan Chipchase blog entry.  He’s one of the flagship user research “rockstars” that got me interested in the whole design research thing, with his global mobile interaction studies.  He now works for frog design, and used to be the most prominent researcher for Nokia.

I like this blog entry because it’s a real-world look into what goes on in a design research process, within a multinational product development agency context.

Often researchers get ahead of themselves and like to talk about the opportunities they perceived after uncovering unmet needs. The fact is in many cases needs are being met, just not particularly well.

2.  On capturing user research data, which is actually a crucial and relatively overlooked process step.

I really love the specialization of the Internet – here, I can learn about and relate to the troubles and advantages of note-taking while on field.

3.  How to tell managers they’re wrong about UX research and still get hired

User experience research isn’t about finding out what people like or dislike. And it’s not about asking users to design your interface. It’s about seeing the difficulties users face when trying to use the design you’ve invented.”

Just because you like a certain author doesn’t mean someone else will enjoy reading the book. You’ll only be able to get the right book if you know something about the person, either by spending some time with them or by asking questions.”

But this doesn’t mean Apple doesn’t do user research. In the famous ‘Playboy’ interview in 1985, Jobs said: “We’ve done studies that prove that the mouse is faster than traditional ways of moving through data or applications,”

4.  This desonance blog, which I came across in an Andy Polaine post.

I love how the author writes, in detail, about his user research and framework-creation learnings.  Really helpful to see process-centric insight like this; you don’t see that every day.

5.  Very good advice on presenting user research from Doors of Perception, also featured by Andy Polaine.

Link Glut (Part I): 10 User Experience Design Lessons from Around the Web

1.  “Design the box”, an activity supporting the importance of user experience vision, from UserFocus

  • Agree on the most important message — the key takeaway — that the box should convey.
  • Invent a name for the product that captures the winning idea.
  • Include a picture of the product being used (draw a sketch or take a photo).
  • List the main features of the product.
  • List a handful of benefits that users will get from the product.
  • List the requirements for the operating system (or the operating environment)”

2.  From Kicker Studio‘s Blog.

I love the Why Products Suck series. Wuhoo!  Clear articulation of each element that makes ideas bad. Exceedingly relevant in an “innovation”-driven corporate society.

Products need to demonstrate their differentiators clearly: I’m what you need because there is nothing else like me on the market. I do this one task better than anyone else.” – Dan Saffer, Why Products Suck #7: The Core Concept is Buried in the Features 

Do I have what it takes?

3.  I like this Core 77 article excerpt that gives a little summary of primary possible device manipulation gestures:

  • “One finger can be used to touch, tap, or double tap. One can tap and hold or rotate clockwise or counterclockwise. It can also swipe up, down, left or right. Microsoft allows the thumb to have a special meaning, something that Apple has not yet done. Google uses a long press to call up a menu, although this is seldom actually used by their developers or not even by Google itself.
  • Two fingers can be used to in the same ways as one, as well as to pinch or spread. With Microsoft’s mouse, the location of the tap matters. I suppose you could have a two-finger long press, although to my knowledge nobody yet uses this.
  • Three and four fingers can be used in a variety of ways, some involving the thumb.
  • Some gestures involve movement of the device, using the location orientation, and acceleration sensors present in portable devices. Some gestures involve tapping the case or blowing across the microphone. Some involve tilting, tapping, or rapid shaking of the entire device.
  • With video cameras watching the user, such as with Microsoft’s Kinect, the gestures can be made in three dimensions without contacting anything using fingers, hands, feet, the whole body, or just the head.”

4.  Stop Designing Pages And Start Designing Flows – Smashing Magazine

…users are coming from a low-information source (such as a banner, as opposed to an in-depth blog post), you must design a flow that fills in the gaps of information by providing the user with the data that they need to be converted.

…Use the following methods to keep the user moving down the funnel:

  • Build user confidence by clearly articulating key benefits, backed by easy-to-digest proof points.
  • Streamline the content and design to focus on a clear call to action (in this example, to sign up for an email newsletter).
  • Remove friction at every step. Ask for the minimum amount of information, and reduce the number of fields, extra clicks and page-loading time.
  • Create an enticing hook, an itch that can only be scratched by completing the registration step.

5.  Favorites from the Contrast and Intercom blogs.

Copy the Fit, Not the Features

“Throwing a few million at some big name VCs does not make a start-up hub. It forms through a series of interlinked activities and traits, not all of which can be controlled. Money is just piece of the puzzle; other equally valid pieces are the right climate, the right demographics, the right network, access to talent, and a strong education system.”

Writing an Interface

  1. Who is it for? – New users benefit from more precise instruction… most likely they don’t know where preferences is or what icon represents it.
  2. When they do see this message? – Does this appear as a reaction to a user action … Does it appear immediately? Does the user expect it?
  3. What do they need to know? 
  4. What must they do now, if anything? Often messages have a next step attached; something you’d like the user to do or decide. This should be the logical conclusion of the message.
  5. How is this communicated? Everything that’s good for something is bad for something else.
  6. What tone does this app speak in? This is driven by the brand.

Wireframing for Web Apps

On the meaning of details: “Every colour, every line, every shadow, every gradient. If your atomic unit of wireframes is a rectangle, with solid lines, a colored background and a drop shadow you’re communicating a lot, whether you intended to or not.”

On consistency: “To avoid this, I encourage students to use a limited color set (3-5 grays), 2 fonts, default HTML components, and little else. This might result in ‘dull’ wireframes, but bear in mind all wireframes end up in the trash anyway. They’re not what counts, you’re not delivering a PDF for visitors to ‘ooh’ and ‘aah’ at, you’re desigining software for them to use. A sexy wireframe is a waste of everyones time in the project.”

On speed and exploration: “If you can’t produce concepts quickly, then you’re working at the wrong fidelity. If your wire-framing serves only to deliver a grayscale version of what you’ve already decided you’re building then you’re wasting everyones time.”

On using real content: “Dummy data leads you into a world where headings never wrap, text can justify without looking absurd, photo dimensions and orientations are always convenient, and numbers always fit in their little boxes. The path to UI hell is sign posted ‘Lorem Ipsum’.

On technology “cost”: “If your design includes custom HTML components, novelty size buttons and dropdowns and ajax powered live search, it’s worth remembering that every project has a budget. If you know HTML/CSS/JS, which you should, and you’ve seen what it takes to test a page on IE6/7/8/9 Safari, Chrome and Firefox, you’ll think twice about what wizardry you’ll put in your wireframes.

On not being anal-retentive about deliverables: “If you’ve sketched something on a whiteboard that you’re confident is a good feasible solution, that has real data in it and everyone in the project knows precisely what you mean then there is zero value in re-creating your whiteboard as a wireframe. Don’t be a slave to deliverables.

Have You Tried Talking to Them?

Any question that was ever pondered out loud would make it’s way into my conversations with customers. Rather than guessing, measuring, or analysing, I was asking, every week, for a year.

Aside from getting an in-depth knowledge of our customers and product space, there were useful by-products of this exercise. Firstly people would blog/tweet to say it was great to receive a personal note (Sidenote: Nothing was automated in this process.) Secondly we had many customers offering their logos to be featured on Exceptional homepage (something that benefits both parties). Thirdly I’d regularly do “Meet our customers” blog posts on the Exceptional blog which made even more customers want to talk to us, which fed the cycle nicely.

The Language of Interfaces

Clarity is best achieved through words. Icons are a tricky beast to work with. They can be literal or metaphorical. A magnifying glass can mean zoom, or search. A down arrow can mean download, save, or simply “drop-down”. A back arrow doesn’t say for sure if changes will be saved.

Always Read The Manual

6.  Andy Rutledge’s series on the basics of design. *brain bleeds in awe*

And his reflection on attachment, as a designer/creator (because I think it applies to even only partly creative output – including research findings) and how to wean oneself:

  1. Start clinically. Begin by delving deeply into inventories and constraints—things less apt to compel emotive responses.
  2. Then, focus on users; various relevant user motivations, use cases, interaction models …all balanced against popular convention, new model exploration, and client needs and expectations. Revisit the constraints and note how they may be affected by these examinations.
  3. Move on toward information architecture for the site/app. Revisit constraints and expectations and see how they impact these exercises.
  4. Stay fairly clinical by then getting into page content hierarchies, layout concerns, and the navigation scheme(s). Revisit constraints and expectations.
  5. As elements begin to take shape and concepts begin to solidify, work to maintain a measure of objectivity by searching for ways to shoot holes in your ideas. Better yet, enlist the help of colleagues to find the flaws.
  6. Save look and feel for later portions of the process and make sure that the look/feel works to lend even more context, even more usability, even more brand articulation, rather than just eye-candy or cool factor (things you may be personally enamored of). Revisit constraints and expectations.

7. Cheeky presentation from Leisa Reichelt on Why Most UX is Shite.

8.  How to run a design critique, by Scott Berkun.

9.  15 Free E-books About User Experience and Interface Design

10.  Official Usability, User Experience and User Interface Guidelines from Companies, from Usability Geek.

5 Web Design blogs to watch: A List Apart, Trent Walton, MIX Online, Daniel Eizan and Design Staff

I am going to get buried under an avalanche of tabs.

1.  A web design classic. A List Apart. Their User Science – Information Architecture category is especially useful to me right now.

Current favorites are on:

The myth of usability testing

“Testing and evaluation is useless without context

…A good usability professional must be able to identify high-priority problems and make appropriate recommendations…

And interestingly, many of the most compelling usability test insights come not from the elements that are evaluated, but rather those not evaluated. They come from the almost unnoticeable moments when a user frowns at a button label, or obviously rates a task flow as easier than it appeared during completion, or claims to understand a concept while simultaneously misdefining it. The unintended conclusions—the peripheral insights—are often what feed a designer’s instincts most.”

On benefits and execution of a cultural probe

“…I handed out diaries to ten users and asked them to describe incidents, over the ten days that followed, when they felt that their mobile phones had let them down. I asked them to describe a solution – even a magical one – to their situation which would guarantee them a successful outcome to the problems they had.
…you can build up a pattern of how users behave: what they love and hate, what motivates them to do what they do and why. Solutions based on this knowledge can help you to give users what they need, rather than what they say they want.”

On homepage goals

“Goal 1: Answer the question, ‘What is this place?’…

Goal 2: Don’t get in the repeat visitor’s way…

Goal 3: Show what’s new…

Goal 4: Provide consistent, reliable global navigation”

And a checklist on input form usability.

2. Trent Walton’s beautifully designed blog.  Walton is one of the three smart men in Paravel, creators of Fittext.js and the Goodfoot app. Walton creates a special look for each post, highlighting the content-for-the-day’s theme, usually with fun subtle animated bits.

I love his insight in “You are what you eat“:

“…’Daft Punk got to record the Tron soundtrack because they’d already recorded the Tron soundtrack.’

If I want to get hired to do something, I should already be doing it. People can’t always see potential energy. Instead of allowing a current job description to stand in the way, turn off the Scrubs re-runs and start a side-project. Draw a picture, code a site, or write something and share it with the internet.”

"Workspace" - Trent Walton

3. MIX Online is also one of my new heroes.  Their series revolving around “the anatomy of web design” is a must-read for people who want to be part of a web design team anywhere.  It provides a comprehensive case study of each of the steps and components they had to go through redesigning their site.

MIX Online is the online platform for Microsoft’s developers and web designers to share their insights and news to the web design community.

Currently reading: A Common-Sense Content Strategy, by Tiffani Jones (now part of facebook).

I don’t even know what “favorite” or “representative” quote to put here to represent the articles, because there are too many that I found useful.

MIX Online Homepage

4.  Daniel Eizan‘s posts on Mental Models.

Helpful, since I’m struggling to find detailed discussions on how to generate insight for mental models, with actual work samples.

“A quick check of our engagement map reveals four key patterns for the “Returning Student” persona. They include: “Explore Options,” “Plan and Immerse,” “Overcome Fear,” and “Take Action.” Each pattern (engagement) is used as a “base,” which serves as the foundation to which we’ll start to build out a case for content to address user needs (“towers”).

But before I build towers, I add “support structure” to the base via “intentions.” Intentions provide context to how content should be framed for task completion. I have most often found that intentions either come up in interviews and could be considered a secondary pattern, or could be implied from verbatims that are consistent with one another. They aren’t necessary to a mental model for content work, but I find that they strengthen the strategy and are valuable to content creators.

Once we have bases and intentions we can begin to build “towers” to establish content that aids in task completion. These boxes should essentially label tasks that the user would want to complete. I leave the labels to these boxes in question form to further assist in content planning for task completion.

Below the line – living underneath the bases – I box out what I refer to as “roots.” For my work, “roots” are the content or features of existing systems that help achieve the engagements we’ve used as bases. This is where all that time you spent content auditing saves it in the long run.” – Daniel Eizan, Mental Modeling for Content Work: Creation

5.  DesignStaff.org

Straightforward advice for starting out in the UX field.

Currently reading: Hacking your brain to think like a user and How to find great participants for your user study

“Once you’re dealing with an app that has a dozen screens and hundreds of states, you can’t hold the whole product in your head like a poster. I noticed that our team was emailing around individual screens, talking about individual screens, and naming all the screens just to keep track. But we weren’t paying any attention to how the screens and features fit together.

We were thinking of the product as a set of screens. But there’s a problem with working this way: it’s not at all how people experience the product in real life. People use products in little flows that last anywhere from 30 seconds to a few minutes.”

Work inspiration and wireframe best practices: These are what I aspire to experience

What a formal title.

1.  Great, great idea.

Web Without Words. Inspired me to start my own exercise. Baby steps in the direction I want.

I can’t pinpoint why, but I think his site design is witty.  More than “mysterious”, I associate the design more with having a cheeky sense of humor. (yay! It’s been a while since I got to use the word, cheeky 🙂 )

Web Without Words by Paul Armstrong

Similar, but less entertaining: Wireframe Showcase, courtesy of Balsamiq.

These were all from this SixRevisions feature, which is, so far, the most comprehensive wireframe guide I’ve seen.  Leading me to these great articles:

Cool - "Concretizing" popularity through site stats.

FuzzyMath’s How to read a wireframe and How to evaluate a wireframe

Jason Santa Maria‘s Grey Box Methodology

Various real-life interaction design document samples from Wireframes.Linowski

Extensive discussion of grid fundamentals by Design Festival

Great and helpful portfolio by Wiseacre Digital

Think Vitamin’s 20 Steps to Better Wireframing

The InteractionDesign.org website

Henk Wihnhold’s blog on productivity and UX

 

2. Grindhouse.

They also have a helpful blog, which led me to these articles:

pay attention to how you feel before, during, and after an activity, he recommends. If you feel drawn to the activity and are looking forward to it before you start; if you are interested, in the zone, and focused during the activity and if you are satisfied with the process after it’s over, chances are it’s a ‘strength’…” – Marcus Buckingham through designtaxi

“To this end, my strategic plan features all kinds of useful lists: work that’s in process, work I’d like to do in the near future, people I’d like to work with, kinds of work I realize I hate, kinds of work that really lights me up, skills I’d love to learn. Some of this may seem intuitive, but I’ve found that it can be hard to keep track of in a busy life” – Courtney Martin through Good

 

3. Lastly, Smashing Magazine’s feature on web design inspiration drawn from earlier masters.

Basquiat's Beat Bop
Starbucks Coffee at Home