[ session description ]

Presenter(s)

Sara Summers

Date

14 March 2010

Tag(s)

#designprocesskillingyou

Dr. Stuart Brown – Institute of Play. A strict no play no friend upbringing removes the ability to have empathy, trust, health, joy and mastery. Instead it brings depression, rigidity, disassociation. Play prepares us for the unknowns in a changing world. It helps us to adapt quickly. It’s intuitive. Play helps us to master something new while driving novelty and newness.

Tina Seelig – Standford Technology Ventures Program.

Exercise: What’s the best business idea you can think of? Worst start-up idea?

Robert Epstein’s Shifting. Period of individual ideation, followed by group building and generation produces significant improvements in ideas. People react to draft ideas with more passion than coming up with an idea as a group where it is more about challenging and shooting down an idea.

Kaycie Kinzer. Tweenbots. People want to help each other if nothing else gets in the way.

Antonio Damasio. Gambling test. Emotions play a critical role in social cognition and decision making. To create rational design, you must feel.

Nancy Marguiles, Mapping Inner Space.

[ session description ]

Presenter(s)

Raina Van Cleave @rainaterror

Nick Finck @nickf

Date

13 March 2010

Tag(s)

#10commandmentsofux

#uxsxsw

Books

Rosenfeld Media: discount code NICKFINCK

Sites

What is UX?

Ten Commandments

1. The user is always right. Companies do tend to focus on their own needs rather than the user. Approach UI design from the user’s perspective. What is the sweet spot between business objectives, technical requirements, and the customer/client/user’s needs?
2. Understand the user. Use personas to get at the information that drives user needs/actions/behavior. A persona needs to be advocated throughout an organization.
3. Avoid solutioneering. Don’t put the solution before the problem.
4. Form follows function. “Form must play within the general realm of the familiar for easily understood functions.” ~ Thomas Vander Wal. Every project has a primary function that should drive the core shape of the product.
5. Content is king. Design is about communication (and it takes more than pixels to communicate). Users scan quickly, this makes your content more important than anything else. It makes heading choices more critical.
6. Innovate, do not imitate. Making things more efficient is valuable, but there is a ceiling. Seek to create a new value, a new service that wasn’t possible before. The most advanced type of portlet, for example, is one that aggregates data from two or more sources to allow the user to take action on things they never could before.
7. Access is for everyone. From the beginning, create tools that are universally inclusive by different ages, abilities, cultures, and devices.
8. Plan before you design. Information Architecture, Interaction Design, and Content Strategy. “With our users in mind and the right vision we can plan, and develop successful applications.” ~ Aaron Irizarry.
9. Understand the goal. “Executives can no longer afford to formulate strategy without embracing user experience.” ~ Peter Morville. How easy is a tool to use the first time a user visits, and how does that change on a return visit? How do you handle errors? If a user is only going to have the opportunity to do one thing on your site, what would that be? (May be different for different personas.)
10. Learn from failure. Set yourself up to learn from unexpected failures, as the only way to recover value from the effort. “Failure is success if we learn from it.” ~ Malcolm Forbes. Don’t walk away. Try another approach. Use the beta model to allow space for failure.

If you are arguing about the differences between wireframes and prototypes or the best tools (OmniGraffle, Visio, Fireworks, Balsamiq Mockups, Axure), you are missing the point. The best tool / model is the one you are most comfortable with and the one you can produce the best output with. The idea is to communicate your concept to someone else, period.

Requirements. Research. Audience. [Content Strategy?]. Concepts (sketch). Wireframe/Prototype. Visual Design.
[ session description ]

Presenter(s)

Todd Zaki Warfel @zakiwarfel

Russ Unger @russu

Date

13 March 2010

Tag(s)

#rightwaytowireframe1

#rwtw

Books

Prototyping (Zaki Warfel)

Project Guide to UX Design (Unger)

Videos

Will Evans

Russ Unger

Todd Zaki Warfel

Playlist from ixd10

1 problem. 4 guys. No talking. 4 tools.

The problem

Tori Tuncan and lend4health.com. Very small nonprofit. Tori started making microloans to people who have children with health issues. She needed a platform/method to handle a larger volume of lenders/borrowers.

Persona to Wireframe

Requirements analysis. Personas. IA (sitemap–”He who owns the sitemap owns the project.”). How are things connected? Typed (not font). User paths through sitemap as sketches. Sketching before using any tool is cruicial. Sketch sketch sketch.

Turn user path sketches into wireframes for locations on sitemap (used balsamiq mockups tool). Hand off to designer (who you have involved in the conversation throughout the process).

Research to Prototype

Existing research. Guerilla remote observation. Put research into a framework package to tag data points and then output onto post-its. Start with major themes and sort data points around themes. Personas based on data. Explore concepts with sketches (6-up adaptive path, 8-up). Pitch concepts and get critiques: re-sketch/repeat. HTML/CSS Prototyping [ round 1/2 in greyscale, round 3/4 full by visual designer ].

Self-centered Design

Well, the rumor mill certainly helped frame our expectations. But remember, Apple designers aren’t concerned with our expectations. They don’t do user testing. They don’t think about the faceless “us” when designing. They design for themselves, the only people whose opinions they can really know. Until we develop telepathy, this approach to design can be pretty powerful. And risky. So here we see the risk in self-centered innovation: you are not going to meet other people’s expectations, and likely not meet them in a big way.

But that’s not what makes Apple tic. I know that Apple is doing the right thing when people describe the experience of using their products not as “it does everything I want it to do”, but rather that when they pick it up and start using it–to do the stuff it was designed to do–”it just works”. If I pick up an iPad and I don’t have that experience, then I’ll call Apple out on that. But I don’t think this is the case from what I’ve seen so far.

The touch screen revolution crystallized this intuitive experience for me. The first time I got my fingers on an iPhone, I didn’t read user manuals, I didn’t watch video tutorials. I just started trying to make it do stuff. I downloaded enough apps from the app store to fill up my home screen. No one told me I could organize my apps on multiple screens. It just made sense for me to flick my fingers in a gesture that meant “slide this thing out of the way”, and I got to the thing underneath (a new, blank screen). Then, I wondered how I could move my apps around. When I pressed and held my finger on an app, it started dancing around, as if saying “Ok, I’m ready to be moved!” I knew exactly what to do next to get my apps onto their new screen. When that kind of symbiosis between user and interface happens–when I try something and it just works–it is so satisfying that I wonder why everyone doesn’t design stuff like this. I had no conscious expectation, it was all unconscious intuition.

I think we should judge the iPad not on our conscious expectations, but on whether or not it is a useful device with a great experience. With that in mind, here are some thoughts on the initial criticisms of this device.

No multi-tasking.

The mobile environment on the iPhone, iPod Touch, and iPad can only run one app at a time. On Mac OS X, I can leave many apps open and doing things in the background while I flick back and forth and complete other tasks while tasks that take a long time complete. But multi-tasking isn’t needed all the time. There are certain things that by their very nature are not useful when running in the background. Those are the tasks that these mobile devices designed by Apple are meant to target.

There’s no need to keep my email app running when I’m not using it. It isn’t going to do anything unless I’m actively interacting with it. The same goes for a web browser. Am I sad that the interwebs can’t be doing fun stuff in the background without me? Not really. Unless I am actively browsing web pages, there’s absolutely no reason to leave the browser running. If I’m watching a video, I certainly don’t want it to continue to run while I go check my email. I’d miss the video, so I always pause it. Yes, I could run it in a tiny window on my laptop to the right of my email window, and flick my eyes back and forth. But with screen sizes in the mobile/handheld market, that kind of experience would be disappointing.

On a regular computer, yes, it seems more efficient to leave all of your apps running so you don’t have to wait for them to start up each time you want to use them. But notice how the makers of these new smart/mobile devices have made each thing start up immediately without delay. They did that to remove the one reason why people leave tasks running that do not require multi-tasking.

If you examine the list of tasks that Apple targeted with the iPad, you’ll see that all of them fail to require a multi-tasking environment.

No Flash support

HTML5 native video support is going to make this moot for viewing videos on the web, and Flash graphical objects (e.g., games) are either A) used in places that they shouldn’t be (navigation), or B) not well-suited to a touch-based interface since they often rely on the mouse “hover” coordinates, which do not exist for a touch screen (it can only react if you have made contact with the screen). Give me the screen that I don’t have to touch to interact with, and we’ll talk.

No phone or camera

If I wanted a phone that big, I would have stuck with my mom’s bagphone. And there’s no way I’d be making all of my calls on speakerphone, or holding an iPad up to my ear. So the obvious choice is a Bluetooth headset and VoIP apps like Skype. However, if Apple’s relationship with AT&T prevents them from letting me use VoIP telephony on the iPad, I will be ticked off.

I’ll admit at first glance the lack of a camera is astounding. But not because I want to take pictures with something that big. I love the idea of me holding this thing in my hand and video conferencing with someone over the internet. However, its size and weight doesn’t seem like it would be a very steady video feed–what with my shaky hands–so perhaps I am not that surprised at the lack of a camera. But lo! the docking station turns this into a steady screen. The iPad seems like it could have been the coolest video conferencing appliance ever made. I mean, I’m sitting there looking at it, it’s looking at me. But I’m thinking Apple couldn’t hit their $499 target with a video camera, not with a first-gen product. I hope to see the addition of a video camera on the next version of the iPad.

Will I buy one?

I don’t know yet. I’m a pretty heavy computer user, so my “sweet spot” is likely going to remain in the laptop world. But the moment that Apple gives me a version of their MacBook where the screen rotates around and folds down backwards (with full touch-screen capability), you’d better believe I’d buy that tablet.

If I were a business person who traveled a lot, or someone who only used the internet for email and browsing, or a professional musician/photographer/videographer who wanted to review/organize their work on location, then I expect the iPad to be the absolute best product for me. Since I’m not one of those, I’m not going to be a first-in-line buyer for this. However, the moment I find myself with enough spare money to finally jump into the eBook community, I would definitely go for an iPad over a Kindle or nook because I feel like I’d be getting so much more than an eBook reader. It would be the best place to spend my dollars. And who knows what kind of new features and experiences app developers are going to discover in this new medium?

All that said, even I have to admit the latest Hitler reacts to…” video is pretty damn hilarious.

For those who can’t get past 1998, universal design is about building things that everyone can use, no matter their level of capability. It is this simple:

“In terms of curriculum, universal design implies a design of instructional materials and activities that allows learning goals to be attainable by individuals with wide differences in their abilities to see, hear, speak, move, read, write, understand English, attend, organize, engage, and remember. Such a flexible, yet challenging, curriculum gives teachers the ability to provide each student access to the subject area without having to adapt the curriculum repeatedly to meet special needs.” ~ Curriculum Access and Universal Design for Learning

For goodness sake, universal design is trying to reduce the workload and number of special requests. That has to be positive, right?

The same goes for web sites. Good web designers/developers make an effort to create very well formed, semantic and progressively enhanced web sites. Not only does this approach help organize content in a cleaner, more reusable fashion, but paying attention to standards up front means that my web site is usable by everyone. I don’t have to go back and create a segregate site that is specifically accessible to certain people. Instead, I get to manage a single site that provides complete content to all users. With progressive enhancement (rooted in universal design principles), that content can be experienced by users with a broad range of capabilities.

People who don’t get UD feel that if they can’t have their Flash-only website, they are limited in some manner. I’ve found that web sites that follow a progressive enhancement model (build it first so it works for everyone, then add layers of the “whizz-bang” so you get the final product you want) end up more powerful and more robust. You have to work smarter on the front end, but there’s a kind of gestalt that happens when you do it well instead of just doing it with the latest/greatest technology (or the way you’ve always done it).

UD is meant to be an approach that takes the segregation out of accessibility efforts. Instead of accommodating after the fact, we are simply designing better content. If you do it right, you are not creating curriculum for the lowest common denominator. You are creating curriculum that can be consumed by the widest range of students possible. You are creating web sites that reach the widest possible audience. To attempt otherwise is to stick with the idea that all students (and web site visitors) are alike. We know they are not, and we know their learning/interaction styles are not the same (disability or no). Even if disabilities were not at issue here, universal design would still be the best way to create curricula, web sites, buildings, sidewalks, etc., because universal design recognizes that worthwhile learning and interaction cannot be homogeneous.

Pony up your stale curricula and inaccessible web sites, academia, and build something that works for each unique student or site visitor instead of something that works only for people with the same capabilities as you.

The curb cuts (ramps) on sidewalks or roads are probably the best examples of universal design. Think about how many non-disabled people use those ramps for pushing strollers/prams, riding bikes or skateboards. This was a solution that helped everyone.

Presenter

James Craig, Apple Inc

Date

Tuesday, March 17

Site

cookiecrook

Accessibility is more like a design process (judgment) than a technical coding process (validation). Universal access tools can help augment the interactive/sensory experience. Standardistas and technogeeks are getting into accessibility as another tool in the toolkit, but universal design is a more integrated approach. It has to be more than a patch with a new tool.

Accessiblity: tty machines
Universal design: Text messaging

Sound icon: the sound of trash being emptied. Unobtrusive.

James went on to talk about the creator of the segway and the IBOT, who is working on cybernetic replacements.

Gesture Recognition

A game called Copycat to teach sign language to deaf children. Johnny Lee and turning a Wii remote into a gesture recognition program. Minority Report. If there is gesture recognition productivity apps, the movements will likely be more reserved and finger-oriented.

Haptic/BCI Examples

Feedback related to a sense of touch (output from the computer). Braille-on-the-back. Haptic Radar headband (University of Tokyo)–”meta-perception”. JORDY (Joint Optical Reflective DisplaY). F-35 haptic sensor body suit and helmet. Jim Jatich (spinal injury; implanted electrodes into his hand–first cybernetic human) had his brain signals recorded while thinking about moving his muscles, then were mapped to the electrodes in his hands so he built new muscle memory to regain movement. Brain-computer Interface (BCI). Matthew Nagel (spinal column injury)–Brain Gate: record patterns of brain activity and uses that muscle memory to communicate to a computer.

• When designers push their vision out to “version 10″, it can cause tension with developers who are usually starting from the other end (i.e., Agile). Developers want to start small (and efficient/elegant) and progressively build toward a design. Balance is key.
• The best possible thing a designer can do for a developer is to share the problem and challenges, not just ask for a composed feature. That way the designer is asking to partner on the solution with the developer. Happiness ensues.
• The best possible thing a developer can do for a designer is to communicate principles and needs to designers to create a more common ground. For example, talking to designers about considering both real-time interactivity and asynchronous actions.
• The best possible thing both can do is hang out with each other outside the office.
• Build trust.

For the rest of the notes, I depend on my trusty Michigan friend, daniel slaughter. He takes amazing notes.

These are notes from a session at sxsw interactive. My own take on topics are mixed in with what the presenters were actually saying, so do not assume all of this content is my own.

Presenters

Nick Finck (Principal / Director of User Experience, Blue Flavor)

Donna Spencer (Maadmob)

Michael Angeles (Dir of User Experience, Traction Software)

Date

Monday, March 16

Sites

The Slides! The Slides!

Balsamiq Studios

OmniGraffle

iplotz

Books

Sketching User Experience

Iterate from sketches to a wireframe.

Types

• Reference Zones – ???
• Low Fidelity/Sketch – sketch-city! whiteboard heaven! lets you stay focused on one aspect of the tool, not be flooded with all of the later detail. “stencil library” (good idea!)
• High Fidelity – show lots of a detail, as much as you would need for the final product. should show the levels of interaction. toward the end of a design process. focus people on things you need to talk about.
• Storyboards – a set of wireframes that shows the screen flow (steps through the interaction). describe entry and exit points. demonstrate core tasks with a storyboard, not necessarily edge cases.
• Standalone – a wireframe with every piece of information that a developer would need to create an app exactly the way you intended
• Specification – insanely detailed to provide the information for developers as well as testers. Adds information about triggers, content source/target, actions and what happens. Basically a set of metadata about the objects that will be on the screen.

Where do you stop with wireframe detail? Once you’ve decided where something should really go and how it should work, you can usually stop. How close to a prototype do you need to get (37signals–just build it)? It usually depends on how much module-interaction and decision-making that needs to occur.

Where/how do you include edge cases? High fidelity wireframes after you know the core way the app will work, they are just the final details to make sure you have a complete spec. Sometimes needs to be limited to the top 3-5 edge cases.

These are notes from a session at sxsw interactive. My own take on topics are mixed in with what the presenters were actually saying, so do not assume all of this content is my own.

Presenter

dan willis, sapient

@uxcranks

Date

Friday, March 13

Site

podcast

ux crank

the pdf

Books Mentioned

the experience economy. pine, gilmore.

• cross-discipline teams. exploit and protect the expertise.
• design for specific users and their specific needs.
• embrace your ignorance.
• the business model should begin and end with the user.
• it’s not meant to be easy, so fail quickly and learn.

Design solves problems. Design is what the product does. The visual design is just a means to an end. Just another dead tree: good web is not just print in disguise. “Take a print mag and just do the same thing but with video in it != good web.” Print assumes a linear order and relies on a headline format. taking a brochure and adding some web native tools is not really web design. We haven’t gone past print design; the web hasn’t become a medium in its own right and it should be. Headlines/stories are commodities. Good for the homepage (where there is a judgement of priority) but not great inside the site. once you have the content, chunk it and dice it into nuggets and use metadata to connect (visual thesarus) to other nuggets. In this way, the judgement is the user’s, not the editors. it’s alpha and omega.

1. first, technologists are doing the content.
2. then, slowly, artists get involved to use the technologist tools to build the content. next step.
3. then, even more slowly, you place the content in the hands of content experts/consumers. next step.

Web design needs a grammar. “the grammar of transcendent web design”

• random voyeurism. we like to watch other people at their most honest and raw. so any time content is being created and presented publicly, we don’t just interact with the content, we start to learn about the people who are uploading the content. (e.g., flickrvision)
• self-aware (but uncontrollable) content. data knows data about itself (metadata; xml is self-describing). and the meta data is often created by the reader/viewer/consumer, not the author. the power is shifting from the content creator to the content consumer (from authority to popularity). find content that can be used to support and prove your product from other sources/communities on the web that may not ever interact with your product (pillow research for the benjamen hotel).
• user-created context. online publishers try to control the context of content. you can’t online because each single user makes different choices and controls the context; and if they are forced, they tend to rebel. fighting the user for control will continue to fail. best step: assume you don’t have control of the data you are putting out there. how can you take advantage of that?
• ambient awareness. microblogging. small bits of data (140 characters or less) by themselves are usually useless; but collectively (e.g., body language cues, pointilism) we start learning a lot about what is going on.
• experiential content. something more than chunks of type is the content. the total experience is the content you are creating. start there. EXPERIENCE IS THE CONTENT. the designer shares space with the user because the user is also a designer since the user is the one having the experience.

These are notes from a session at sxsw interactive. My own take on topics are mixed in with what the presenters were actually saying, so do not assume all of this content is my own.