Interaction11 – Saturday

So I realized as I was putting together a guest post for IxDA Lansing that I had completely forgotten to post this. I don’t know where my brain has been recently. I hope it’s warm and sunny wherever it is.

So… Saturday at Interaction11. Here we go…

The Neuroscience of Usability

For Saturday we didn’t start out the day with a keynote, but instead with two tracks of Lightning Talks. I stuck to my location in the main room and caught Charles Hannon talking about how neuroscience affects usability. While some earlier in the conference challenged design patterns, Hannon talked about how and why they work. When the patterns disappear emotions such as panic and anxiety edge their way into the picture keeping people from being able to focus on the big picture.

Up with Complexity! Challenging Users for Fun & Profit

In this talk, which Josh Clark said could also be ‘Make Me Think’, he contended that complexity and challenges are not the same thing. For instance, the Wenger Giant has every tool you can think of, but you can’t really use it. While complexity is not evil, it does need to be managed. Clark outlined focus, conversation, touch and exploration as ways of doing this.

Applying Film Making Tools to Interaction Design

For Adam Connor’s talk he introduced us to a number of film methods that can either be put to use in our development processes or taken advantage of for use in design. An example of the first would be the use of beat sheets to convey the emotional states of the system and user for various stages in a process, while an example of the second would be the use of rack focus or shifting the depth of field.

One piece of movie trivia – which side does the bad guy enter from?

Marketing is not a 4 Letter Word

I’ve done a lot of marketing related things in various jobs and so this was not a tlak I originally planned to attend, but I am glad I did. Megan Grocki did an awesome job talking about modern marketing and how Marketing methods of 10 and 20 years ago are, to large extent, no longer relevant. Instead, marketing needs to be approached from the view that anything a company does to engage their customer is marketing. Also, the best marketing is done when both company and customer are aware of what is going on and are satisfied.

Fun With Non-Digital Solutions

Scott Geoffrey Newson stepped beyond the digital world to the physical by sharing about the impact of real life interaction using references to Undercover Bosses, UBC’s Sprouts program, UK Waste Strategy Awareness Managers and the building men of Glasgow.

Keynote: Authorship in Interactive Media: Reflections on 35 Years of Change

Brenda Laurel kicked off the afternoon with an analysis of the changes that have occurred in the last 35 years through the eyes of one who was there through those changes. She reference 6 keys that brought these changes about – technology, action, senses, culture, nature & emergence. A few examples would include Atari (tech, culture), Hole in Space by Electronic Café (emergence) and the Girl Gamer Revolution (action, culture, nature, emergence).

Making Mistakes Fun: Game Mechanics are Not a Panacea, but They are Kind of Useful

Engagement is success and gamification is a hot field. Paris Buttfield-Addison denies neither of those statements, but did caution us that gamification needs to be done correctly. Pasting badges on top of a site is not the key to customer interaction. Instead, gaming aspects should be interested in achieving a higher goal and started with a vision – not just bolted on top. Think beyond fun to compelling interactions that will engage customers in a series of interesting decisions that are not too hard to be frustrating and not too simple to be boring.

To see gamification put to use for higher purposes, check out

Pass it Back! Kid Apps on Grown Up Devices

This is another one that I didn’t necessarily think I would get a lot from, but as Nina Walia shared the findings from user research that she had been a part of for kids ages 2-5 and iPhone apps, I realized that a lot of these can be applied to adults as well. We are just grown up kids after all. We’ve just learned to compensate for the deficiencies of most devices like the difficulty of tapping and accidentally hitting the home button instead of back. Also, the videos that she shared of a few of the tests were super cute as well as informative.

Long After the Thrill: Sustaining Passionate Users

Stephen Anderson built on the base set up earlier in the day by Clark and Butterfield-Addison by encouraging looking deeper at the reasons that customers stay. Pasting a game on top isn’t enough. Its just sugar coating. It does need to be deeper, so he encouraged us to find the principles already at work in our products and use those to build engagement with our users. That may or may not involve elements of play. As he said, it takes more than delightful experiences to keep users. Long term they are more interested in whether it works and whether work is getting done to improve it.

Final Keynote

“This is a crisis. I really need a guy or a gal with a whiteboard and post-it notes.”
-Bruce Sterling on words we desire that are doomed for unfulfillment

Bruce Sterling is an entertaining speaker. He’s also not afraid of giving critique. So, laced with humor and supported by the immediately preceding happy hour, he combined his observations from throughout the conference with his previous knowledge of interaction design to give a good critical look at the community. He encourage user sympathy but cautioned against getting so caught up with users that we start suffering from User Stockholm Syndrome. He also cautioned us against getting so caught up in the design that we forget the less sophisticated user. Thus his final thought to us – How do you treat people who just don’t get it… that’s the real question.

So closed out the speaking portion of the conference. Afterwards, Microsoft sponsored quite the bash at the Absinthe House with an open bar, dancing, a photo booth and even a Kinect to play with.

It was a great event that I am very glad I had the opportunity to attend. Now to start plotting for Interaction12 in Dublin, Ireland.

Recommended Resources from the Day:
How We Decide by Jonah Lehrer
Mental Note Cards
A Theory of Fun by Raph Koster
The Art of Game Design by Jesse Schell
Fundamentals of Game Design by Ernest Adams
The Escapist Magazine
Drive by Dan Pink

Angry Birds: A Visual Field Case Study

Earlier this month I came upon Charles Mauro’s lovely and entertaining cognitive study of Angry Birds. As a player of the game and UX practitioner with an interest in the design of games, the article had great appeal. So this past week when we, the UX team, started a monthly design workshop for our company and visual field was chosen as our first topic, Angry Birds immediately came to mind. Our manager went along with the idea – it was a nice balance to the more dire examples of the Challenger explosion and Cholera epidemic of 1854 – so I read up on Mauro’s findings and turned them along with my own playing experiences to the idea of visual fields.

Here is the handout that my co-workers received on the subject:

In the Angry Birds game experience the designers used visual field not to solve a puzzle but to increase the complexity of one. The gamescape is designed to be wider than the actual screen on which the game is played, so one side of the screen is always out of the visual field.

The constraints of the visual field make players engage their short-term memory by panning across the gamescape at the beginning of each level to show them the structure that they are seeking to take out then bouncing back leaving that structure beyond the visual field. Since short-term memory is both finite and volatile, the visual and auditory engagement of the birds bouncing and chirping in the visual field distracts from remembering the structure that was just seen. This taxing of the player’s short-term memory ups the complexity of the game and therefore makes it even more rewarding when a level is completed.

While this combination of limited visual field and reliance upon short-term memory has the potential to be frustrating, the game is designed to easily adjust the view of the gamescape thus refreshing the player’s short-term memory. It also follows the flight of the bird across the gamescape to its destructive end, hopefully changing the actual structure being aimed at and so refreshing the player’s short-term memory with a new version of the target.

Another tool that the game uses to help the player adjust to the limited visual field is the bird’s flight path. When a bird is shot, it leaves behind a trail of clouds which will remain on the screen for the next shot giving the player visual clues for their launching angle while still keeping the end goal out of the visual field. Only the immediately previous bird’s flight path is visible so the player must set their short-term memory of the structure against the previous bird’s flight to decide their next move.

On the iPad, players can pinch in the zoom to bring the entire gamescape into the player’s view, which prevents short-term memory loss thus decreasing the complexity of the game. This decrease allows the game to be completed more quickly and proficiently but the decrease in challenge makes it less interesting to play and therefore less fun over time. From this we see that what is hidden from the visual field can be just as important was what we include in it.

Drawn in part from Charles L Mauro’s article ‘Why Angry Birds is so successful’

If you’d like a PDF version of the handout for your personal use, grab it here.

Interaction11 – Friday

Yes, yes. I had intended to get this up sooner. Saturday as well. It is coming and soon. I promise.

Opening Keynote

It was obvious that Richard Buchanan had been paying attention to Thursday’s session when he started out his keynote with the three questions that had created a theme for the previous day: Who are we? Where are we? Where are we going?

His talk spoke a lot about how we design, those things which influence our design and the power of design.

“Design has no subject matter. That’s what makes this such a powerful discipline – we make our own subject matter.”

As designers, we bring a different perception. One of his examples was how a chair instead of just being a chair is a place of interaction or activity – interaction being defined as how people relate to other people through the mediatory influence of products (like a chair).

As a framework for the design Buchanan shared with us a philosophy labeled by his students to be the Triangle of Doom. The sides of the triangle represent the qualities of being useful, usable and desirable. The balance of these qualities has determines the voice of the product and the design, which falls into the center of the triangle, needs to reflect that.

It is also important to keep in mind that all three qualities are necessary. Something can be useful and usable, but if there is no desirability then it will not be adopted into people’s lives.

He also spoke about how interaction is not thing to thing, it’s person to person. Thing to person is interfacing. There is a difference.

It’s more than just designing environments for interactions to take place though. There needs to be something accomplished through this. With that in mind content needs to drive design not try to be squished in after the fact for if there is no content then will the artifacts we leave behind have a voice and will we be able to hear what they are trying to say?

In closing, Buchanan gave his answer to the final question. Where are we going? To support the dignity of our users and that should be the principle behind all of our designs.

Macro vs. Micro

The gents from Smudgeproof shared with us the differences between small team development and design versus working in a large company (like Yahoo).

The things that really stuck out to me were the sheer amount of management, which we’ve all seen, involved in the larger corporation and several of the changes in terminology. The one that actually made it into my notes was the use of ‘triage’ instead of ‘revisions’. To me it seems much more accurate.

Also, these guys were the ones who put together the app for the conference, which was awesome of them to do.

Design for Evil: Ethical Design

Is that not a cool title for a talk? It is also one of the most grumbled about talks of the conference from what I heard during and afterwards.

What I think Kaleem Khan was trying to say, though this is just my interpretation, is that because design is not neutral we need to think about the choices that we make in both the jobs we take on and how we actually design.

As Buchanan said, design is a powerful discipline and the choices we make can be a part of great good or evil. We need to be cognizant of this and choose with care the things that we do and do not do.

IxD & the New Media Pedagogy

Entrepreneurial journalism isn’t a term that I ever heard of while an editor for our college paper, but a lot has happened in the last five years and Steven Johnson is a professor preparing students for joining the workforce in this new age of digital media teaching just that.

Johnson teaches them beyond the journalism to the basic web developer skills that they will need along with interaction design, information architecture and user experience tenants. For example, he teaches them about site mapping by referencing the difference between a family tree and crabgrass (site mapping is the latter).

As a longtime Dilbert reader, one of my favorite sound bites of the day came from this talk.

“It’s Dilbert’s world and we just ideate in it.”

Many days that is exactly how it feels.

The Intersection of Physical & Digital Design

The last talk of the morning came from Lindsay Moore & Austin Brown of EffectiveUI. They shared with us ideas and examples of how digital interfaces could be developed to improve the interactions between people and the physical devices that they use.

One example they gave was of potential improvements to a thermostat that would not only give the consumers more system feedback like amount of time to heat and such, but also encourage community collaboration by tying into local energy challenges with neighbors. The idea being, of course, that community can provide collaboration and positive reinforcement that improve people’s habits.

Lunch and Beyond

Friday afternoon was our out and about day where we all headed off to different lunch locations and activities that we had signed up for ahead of time.

I was signed up for the design tour, so we went off to have lunch at Centro Latin Kitchen before hitting the sidewalks. Let me tell you, it was fabulous. If you’re in Boulder I recommend trying it.

Disney Online Kerpoof Studio

Our first stop was Disney Online’s studio in Boulder. They produce Kerpoof Studio, which focuses mostly on education as well as Disney Online’s Create section.

By no means do I fall into their core demographic of pre/young teen girls, but after seeing the work that they do on the create page I wanted to go and pretend that I was again. It was also interesting to hear how they handled things like innovation and development with a very artistic development environment.

Wall Street on Demand

Our second stop took us from art and children to graphs and money with Wall Street on Demand, a company which provides tools for financial services. They welcomed us with exercise balls for seating and a large bowl of chocolate then introduced us to their way of work through a presentation to the group.

Afterwards, we were invited to take the last few minutes to explore their space, check out their work on iPads and chat with their employees. It was obvious that they loved their jobs and they found something which many people might consider boring both interesting and exciting. It was great to see.

Crispin Porter + Bogusky

Our last stop was CP+B. A little further out of town than the other, they took what used to be an indoor soccer arena and transformed it into a really cool workspace. I may have gaped/drooled a little.

Here we did the reverse of the stop before by dividing up into two tour groups and then coming back together for a presentation about the company at the end. While I hadn’t been familiar with CP+B’s name, I have seen their ad campaigns and so it was interesting to hear how they came up with those ideas.

Each of the sites had a different product and energy, but what was interesting at the close was to think about how their processes were similar despite their differences (though not exactly alike by any means) and the ways that their company culture showed through whether it be in the architecture, work stations or the differences that did show through their work processes. It was definitely a great and thought provoking experience, especially with all the discussion of those subjects in the future of our office.

As for the evening, wow. There was a Coroflot recruiting/networking event already in motion when we got back which was the first event of the evening. Starting just a bit later were gatherings sponsored by Pivotal Labs, SapientNitro, Hot Studio & CP+B. At least, those are the ones that I was aware of. Needless to say, some folks were a bit, ehm, bleary-eyed the next morning. It was a great chance to meet people and connect further with those already met previously.

Recommended Reading from the Day:
Designing Interactionsby Bill Moggridge
Interaction Ritual – Essays on Face-to-Face Behavior by Erving Goffman

Interaction11 – Thursday

Thursday morning started out with coffee, banana bread, Bill Verplank and his conte crayon. A pretty good start to the day in my world.

Keynote: Interaction Design Metaphors

Bill started out with three questions that every interaction designer has to answer: How do you do? How do you feel? How do you know?

Within this he also discussed the difference between hot media, which is set without much room for interpretation, and cool media, which is much more open like jazz and cartoons, as well as how this plays into the matching of mediums and messages. The message needs to match the medium in which it is presented aka the medium is the message.

Another area that he covered was the difference between a path and a map. A path is more direct, but a map is more engaging and thought provoking.

The example he used was of the closed vs. open vending machines. The closed vending machine offers a few options, choose and go. It is a path. The open vending machine lays out all of your options where you can see them and choose that way. It is a map.

The last section of his talk had to do with mentalities and interfaces.

According to Piaget & Bruner, there are three different mentalities or forms of knowledge. The first we are born with, which is motor/kinesthetic/enactive knowledge or ‘do’ thinking. At about the age of 5 we develop ‘see’ thinking where the image is what matters. Then, as an adult, we develop symbolic or ‘know’ thinking. According to Bruner we suppress each type of thought as we develop the next.

This ties into interaction and computing with the manner in which interfaces developed. The first computers were teletype computer which were all about symbols thusly ‘know’ thinking. From there we moved on to ‘see’ thinking with the birth of the GUI (Graphic User Interface) and interactive design.

So what next? If we continue in this progression we will be moving to ‘do’ thinking and have already started to see the entry of tangible user interfaces.

Obviously this has just been and overview, but my understanding is that the talks will be made live eventually if you’d like to learn more on this or any of the other speakers’ talks.

Proximus Maximus

What gives designers the confidence to say they can create something never before credited? What gives those they’re talking to confidence to believe them?

To address this Michael Meyer spoke on the 3 Design Imperatives. The first is empathy as we designers must develop and show for our tools. The second imperative is core, which is the essential material available to craft the products, services, etc. The last imperative is proxy or the things that represent the sum of you knowledge and communicate understanding and ability.

It is the combination of these three things – empathy, core & proxy – which answer the questions that began the talk in the first place for it’s those that determine the final arbitrators in design decisions.

What do you do anyway?

Carl Alviani brought to a point a recurring theme of the morning – how do we define ourselves as interaction designers? As probably comes as no surprise to anyone who has asked before, our field doesn’t have a really good answer to that question.

As Carl pointed out, internal stories do not equal external stories and the importance of a right story is that it turns skeptics into evangelists. He gave several definitions that people have of the field with my favorite being that it’s magic. Not that this lack of understanding is a good thing, but I appreciated the comment anyway.

In closing, he gave all those listening 5 To Dos:

1. An example would be useful – Examples ALWAYS beat abstracts
2. Tell an IxD at work story – w/ pics!
3. Don’t sweat the edge case, dialogs are protables
4. It is… don’t worry about the titles unless it’s vital
5. Start where the listener is

Consume, Consume, Consume

Peter Knoche came next reminding us that there is more to life than just consuming and, in fact, that consumption has never won an Emmy or written the Great American Novel.

With that he encouraged us to seek balance in our lives between the curation, creation and consumption that fill them and not only that, but to help our users find balance in theirs as well with the reminder that free cultures get what they celebrate.

Scandalous Interaction

Tim Wood started out his lightning talk with quite the scandalous slide – Usability is overrated! This was followed up with the question of whether usability really is overrated when it’s just one of many factors which drive us.

He ruffled a good many feathers in the twitto-sphere challenging the traditions, conventions and the continuing applicableness of these things. He asked us to truly consider before using these things for convenience and look beyond the model details to define the underlying structure and logic so that we understand the abstraction of the behavior.

After a scheduled lunch break…

Keynote: Designing at the Edge of the World

Erik Hersman kicked off the afternoon by sharing with us how technology is impacting Africa and the differences between there and other parts of the world.

One of the largest differences is that mobile rules. While we take for granted in many places that that people will have email addresses this is simply not true of Africa. Instead the phone number trumps the email address and so the technological culture there has adapted to this.

The power of the phone number does not, however, mean that people are loading their phones full of data and minutes each month. Instead they are only loading them just often enough to keep the number active. This has led to site like facebook allowing access to certain portions of their site at no cost to the user.

The biggest thing that can be seen is how this is making a shift from societies that have always been top down in their structure to working on building from the ground up.

He also cited a number of African sites/developers/organizations of interest including MXit,,,, NairoBits and Ushahidi.

Obviously this is just a very brief overview of his talk. You can find his thoughts after speaking here at his blog.

Design for the Developing World

Susan Wyche followed up on Erik’s experiences with her own much shorter exploration of the internet and Africa from when she did a short term study of how Africans who theoretically could afford to get internet in their homes interact with it.

What I find interesting is that those she spoke with chose not to add the expense of internet. To them the possible benefit did not outweigh the cost and they did not wish to have their lives consumed with this tool (as we Americans do). Instead they plan deliberate interactions with the internet using offline preparation to maximize their time online in the office or at internet cafes.

GrowBot Gardens

The next speaker, Carl DiSalvo of the Georgia Institute of Technology, switched stateside as he talked about working collaboratively with small farmers on building and designing robots that would benefit them in their work.

Bringing back the earlier topic of empathy, he spoke about cultural imaginaries and moving towards co-design and with that greater empathy for those we are working with.

He also talked about public design. That is the construction of publics, especially with the thought in mind of bringing together all kinds of people to interact and engage with each other.

It wasn’t a session I had initially thought I would find interesting, but working with the Mainstreet program I could see a lot of application for my area if not as much my paid job.

Technobrega: Tacky Techno

The last session ended up being a favorite of mine. Ana Domb brought us an inside look at the techno brega phenomena from Brazil. It is an interesting study in how a community took a system that was not working for them (i.e. the licensed music system) and through collaborative innovation developed a new system that used both social and physical currency supporting both the artists and the audience.

Because it is a true collaboration there is not bottom up because there is not bottom. The relationship is lateral so that instead of the audience being at the receiving end of the network it’s a node in the greater network.

“The history of art deals with innovators and innovations that won organizational systems.” – Howard Becker


To close out the afternoon there was a Q&A with the speakers. Here are a few bits I found interesting from it

What is the role of designer in these environments?
Guide & translator, yet without trying to force our own cultural perceptions upon a place and people who are different from us.

What about cultural intrusiveness?
Balance expertise with crushing your own ego. Work with the culture not against it and, most of all, listen.

“We build stuff to make things change. That’s what we do.” – Erik Hersman

Effective UI/Adobe Opening Party

We closed out the evening with a bash hosted by Effective UI & Adobe at the Boulder Theatre which featured the wonderful taste creations of a top chef (the brussel sprouts were amazing) and two bands.

I’ll close out this post with a video of Itchy-O.

Interaction11 – Wednesday

This past week I had the pleasure of attending the Interaction11 conference in Boulder, CO, with my co-worker Caitlin. Instead of trying to cover it all in one or even two posts I’ve decided to break it out by day lest the sheer amount of notes I’m seeking to parse into this becomes overwhelming.

On to Wednesday.

We actually set out to Boulder for the conference on Tuesday, which turned from a nice 8 hour travel day to something around 14 hours with a flight delay leading to a missed flight and then sub-zero whiteness in Denver on our arrival correlating to a late bus. I can now tell you from experience that walking 4 blocks with luggage in the slush and sub-zero temps with a Manhattener in the lead is really not the best way to go. Should I ever again face this situation I’m getting a cab. Anyway, we made it. I’ll leave Tuesday at that.

After a nice, full night of sleep we headed downstairs to acquire our badges (accompanied with some lovely swag) and headed over to the first workshop of the day – ‘Self-Ethnography, Collaboration & Play’ with Sara Summers of Microsoft. Of course, the first thing she asked was why we chose that workshop of our options for the morning, which falls into the data set known as ‘details I’ve ceased recalling’.

So what is self-ethnography? With Sara at the helm we boiled it down into 5 things:
– Empathy
– Observation of ourselves using things
– Emotional Intelligence
– Self-awareness
– Self-regulation

One example given of this was Shigeru Miyamoto, the creator of Super Mario Bros, who took inspiration from his own childhood memories to create the most lucrative and game-changing video game to date. His whole philosophy was to recreate the wonderment of being a child. Obviously that resonated and still resonates with his users.

As we continued with a discussion on the balance of creativity and our work lives a couple of notes that jumped out at me were the idea that creative work should be like traveling to a foreign country and that while planning is good we should remain open to those unplanned experiences as they are often the most interesting.

I also really enjoyed her analogy of describing bad UX as a bug to developers; a concept which we plan to start implementing in our workplace now that we’re back.

Our session was closed out with a collaborative thinking project. We were asked to write down the best business idea and worst start-up idea that we could think of. As I’m sure you can see coming, she tore off the good ones and had each table grouping choose (without looking) a bad one which we had a ½ hour to develop a business plan for presentation to a group of venture capitalists otherwise known as our peers.

Our business idea – an interface you interact with via smell.

Thusly Analyscent was born.

Here’s our new friend Phillip presenting our business:

Yes, I realize that the video is sideways. I haven’t yet had a chance to convert and flip it.

Caitlin was also kind enough to grab photos of some of our presentation materials and share them.

After grabbing lunch with several of our new friends, I headed back to Boulder Digital Works for an afternoon session with other IxDA local leaders. While I picked up a lot of great information and ideas for our local IxDA group as well as learning a good bit more about local groups globally (and the amazing rate at which they are growing), the best part of the afternoon session was the opportunity to connect with other people involved with leading local groups including one person from my own state I hadn’t met yet. I’m really looking forward to the collaboration efforts that are already starting to come from that relationship building.

After a relatively short trip to the bar with the group, several of us split off to enjoy some Cheesecake Factory for dinner (we don’t have one in Michigan) where we learned a little more about the local wildlife, perhaps more than made some of the group comfortable. Thankfully, I don’t think Justin had to try out his cat calming skills with any of the local mountain lions while in the area.

The evening closed out with karaoke at Juanita’s. For all of you who were there an didn’t go – you missed out on a lot of fun.

Looking back over the conference as a whole, one of the things I find interesting is that the people that we met on Wednesday ended up being a good portion of those who we bonded with and spent a good amount of time with as the week progressed. That is not to say that we didn’t meet or hang out with more people, just that many of those who I really see myself remaining in touch with were in that group and I am glad that we took part in those optional workshops and activities of the day.

Recommended Reading from the Day:

Cognitive Surplus: Creativity and Generosity in a Connective Age by Clay Shirky

The Shallows: What the Internet is Doing to Our Brains by Nick Carr
Drive: The Surprising Truth About What Motivates Us by Daniel Pink
Picture This: The Near-Sighted Monkey Book by Linda Barry

World Usability Day 2010 – Part Two

World Usability Day logo

If you haven’t read Part One of this post, find it here.

I apologize. I failed at the whole not taking as long to get this post up. It’s been 90% done for several weeks just waiting for me to go back and finalize it – taunting me the whole while.

So, picking up where we left off there are three presentations remaining starting with a surprisingly interesting one from a government employee.

Government on the Move

When I saw that there was someone from our state government there it was not necessarily surprising considering how close we were to the Capital Building and my knowledge of’s existence, but I wasn’t sure if I’d be sleeping by the end.

As it turns out, Chuck Baird was an entertaining speaker and even started out joking about the bad rap speakers from the government get. He shared with us about how usability came to his attention and grew from there as well as the ways that the state had started to look at usability in their development.

While anyone can tell you that there is a lot work to be done on the state’s site, Baird was able to share about the Mi Drive site, MDOT’s twitter account and the mobile version of the state’s site.

Best Practices for Mobile Application Design

This presentation, by Jason Withrow of Washtenaw Community Colleg and Usable Development, LLC, mostly discussed the basics of how to think of and work in the mobile space.

Withrow started with the range of mobile devices – screen sizes, software, supported devices, storage and microbrowsers. All of these elements can vary across a wide range. For example the average cellphone has a screen size of 100-320 pixels while an iPhone is 480 in width and PDAs can range from 320-640 pixels.

From there he moved on to specific design constraints focusing mostly on hardware like the keyboards on mobile devices, touchscreens and potential bandwidth (both connection speed & data use).

For the sake of space I’m going to breakdown the main best of practice points into an outline.

Low-end device implementation
– best done in (x)html + css with either a handheld stylesheet, .mobl address or m.domain address.
– functionality should be focused on the key task the app is meant to do
– same amount of bandwidth is consumed when elements are hidden but not removed from mobile visibility/functionality.

High-end device implementation
– Option 1: (x)html +css combined with javascript using a css media query based on device characteristics
– Option 2: write the app in a programming language supported by the device.

– Streamline task completion: keep a consistent theme in mpbile design and focus on doing 1-2 things well
– Design for preferences and patterns: remember the users frequent selections & most recent actions
– Design for single-hand use: can the user operate it with one finger? Limit the need for keyboard & multi-touch.
– Keep Fitt’s law in mind: size is critical, it needs to be big enough to acquire easily without clutter to hit accidentally around it
– Use mobility to your advantage: incorporate the users geographic location in consideration

– transition between portrait/landscape modes requires bigger adjustments than on PDA/smartphones
– drop & drag is possible

Creating Beautiful Android & Apple Mobile Applications Easily

When we first saw this topic on the docket, we really weren’t sure if we’d get anything out of it because when it comes to coding… well, that’s what the devs are for (and we appreciate it greatly). I am so glad we decided to stay anyway.

Nick Kwiatkowski (@quetwo) started out with a few stats to keep in mind –

– 4.6 billion cellular subscriptions worldwide
– 3.5 billion are capable of text messaging
– 257 million data plan holders within the USA (over 1 billion world wide)

It is not all HTML5 and people are expecting an app but the fragmentation of mobile devices makes very few things compatible across the board. Because of this creating apps for use across the board can be very expensive in development hours.

Adobe has published an application framework that allows developers to create applications that run across mac, windows and linux

AIR is either compatible or soon to be compatible for iPhone, Android, Windows & blackberry and allows you to re-use code to create an app over multiple platforms. This is not a miracle tool. The toolsets will never be as powerful as an app targeted at a specific device and the context (phone vs desktop vs other) does need to be considered before sharing the code blindly.

I’m including my notes from the talk, but if you really want to get a good grasp of how this works I suggest going to Kwiatkowski’s blog for his notes, powerpoint, etc.

Start by selecting your chosen device in Device Central

Create a new document in Photoshop
– since it is exported from device central it is already set to the correct specifications
– make sure each element is on it’s own layer because the prototype will lose it’s taxonomy
– elements should also be divided into folders
– Do not rasterize labels and fonts, this breaks accessibility

Adobe Catalyst
– create a new project from a psd.
– It will import with an options screen (choose a color other than white so people don’t take it as something being wrong)
– Ctrl/enter will run the project in internet explorer
– Use shift to select multiple
– With a click change to types of functionality (Photoshop box -> text box)
– Specify as needed (parts, repeated elements, etc.)
– Create multiple views in the pages/states sections
– Create interactions from the data list

Now into Adobe Flash Builder (can also use Flash Professional)
– rt click on project explorer, Flex mobile AIR project
– list target platforms, blank to import project in progress
– multiple Photoshop files for real life re-orientation
– App id usually domain name backwards
– Automatically imports code with the catalyst final design file
– Debug file for errors
– Can export to code or the internet
– Professional is a little more advanced with iPhone

There you go. I hope you’ve enjoyed this overview even if it has taken me far too long to post it.

World Usability Day 2010 – Part One

World Usability Day logo

It has a taken a couple of weeks to get to writing this, but back on Nov. 11th @caitlinpotts and I had the opportunity to head out to Lansing for the day and soak in some mobile devices information at World Usability Day (#wud2010). I’ve realized in pulling together my notes that this would be awfully long as one post, so this’ll be a two parter.

We started off our day with a quick stop at Panera bread for breakfast and coffee before heading over to the Kellogg Center on Michigan State’s campus. Once there we met up with our friend Mike (@UXmikebeasley) and settled in for the day.

On to the presentations…

Talking Points

While our first speaker’s topic had absolutely nothing to do with the mobile apps we’re currently considering at work, Mark Newman of the University of Michigan gave a fascinating presentation.

‘I can get where I need to be and if I get lost I can find my way out.”
-Talking Points Test Participant

Talking Points is a research project they’re working on to use smartphone technology with gesture-based interactions to help visually impaired people learn about their surroundings.

Basically, the project uses GPS outside and, eventually, wi-fi tri-lateration inside to provide visually impaired people with information on their surroundings with community gathered GPS/wi-fi tags. These tags would be for paths, areas, points of interest, path intersections/decision points and functional elements like entrances or restrooms.

The goal of this project is to not only foster spatial awareness in navigation, but also comfort, security, exploration, improvisation and the discovery of new resources (aka independence). You can find out more information on the project at

The Art of Mobile User Experience Research

The second presentation was by Kris Mihalic (@suikris) from Nokia. He started out talking about the division in understanding humans that occurs in the technological workplace between market research and UX research.

Market research tends to focus on opinions and quantitative data gathered from focus groups, surveys and ideation sessions while UX research is usually more interested in behaviors and qualitative analyzing behaviors and anthropological studies for insights into why people do what they do. UX is also usually closer to product & design than market research.

There are three pillars that Mihalic focused on for Mobile UX – speed, flexibility and context.

Speed refers to all of the things involved in having a high speed of execution including fast prototyping, recruiting and delivering results, which includes involving stakeholders early.

One quick prototyping method that I’ve not used but sounded fun was sharpie movies, which is sketching in sharpie then compiling it into a movie. Being imbedded with a development team, his suggestion to become BFFs with the developers to gain their investment in prototyping was amusing. Cookies are generally a great form of bribery ;)

Flexibility referred in large part to platforms (focus on the important ones), interaction and hardware. He specifically mentioned being prepared and informed about the situation you’re working in and making sure that your stakeholders understand the constraints of what you are and are not able to do.

The last pillar of context stressed the timing within the development cycle, use vs. research, support/vendors and being contextually aware of your team, business, users and research partners. One suggestion he made was using video diaries from testers which put the device into a real life context and also powerful with stakeholders.

Milahic’s last point was that the greatest return on investment (ROI) of UX research is to take the information gathered and optimize your product’s ‘sweet spot’. You can’t do everything, but optimize that which you do well.

Building Mobile Experiences

The next presentation was by Frank Bentley of Motorola Mobility. He had some great visual examples that I unfortunately do not have to share with you, but there are some great points event without them.

The first and very important point is that while there is a good bit of similarity phones and computers, especially smartphones, but they are used very differently.

This point is so important because it goes back to the context that Mihalic mentioned and that testing in a lab alone won’t give you the whole story. You get the basic data from lab tests, but it doesn’t answer the question of how it’s really used and misses all of the creative ways that people use their devices in real life.

Because of the shortfalls of lab testing, their goal is to have a functional prototype that they can put out for field evaluations with beta testers in 1-2 weeks.

With these prototypes he emphasized building only what you need (!!!!!), focus on the experience instead of the technology and make sure that your prototype is sturdy enough to survive testing

He also emphasized the importance of recruiting according to your goals for testing and that the device needs to be their primary device to truly understand the context and how they are used. With the recruiting, it is best to recruit a diverse testing population so that similarities are less likely to be coincidental.

Lastly, the first prototype doesn’t need to be complete or fancy. The faster that a prototype exists – even if it doesn’t have all the polish – the sooner you can get real feedback to see if the project is going in the right direction.

That’s it for World Usability Day – Part One. Keep watch for Part Two. I promise it won’t take as long to get out as this first one did. I failed at that one… but Part Two is now up!

Icons and Technology

I recently did a lunch and learn presentation to my co-workers on the subject of iconography and, after the excessive ragging I got last time for not recording a presentation, I caught it on Silverback. I’ve included a copy of the powerpoint and the quotes which I used below.

One note – I did realize in going back over my notes that the article is not “Realism in UX Design” but “Realism in UI Design” from UX Magazine. This has been corrected in the Powerpoint version.

Iconography Powerpoint

“Noobs in the digital space don’t understand things holistically. They barely understand the basics. They lack any cognitive surplus to provide themselves with an overview of the environment they interact with.”
Thomas Peterson, “Anatomy of a Noob

“It’s pretty rare in the real world that we rely on iconography alone to represent ideas. Bathroom doors generally have an icon of a man and the word “Men.” Stop signs have the word “Stop” on them.”
Jensen Harris, “The Importance of Labels

“Part of the user experience effort around Outlook 98 was improving the menu and toolbar structure. One of the problems noticed again and again among non-expert users was that people didn’t use the toolbar at all! …In the end, one change caused a total turnaround: labeling the important toolbar buttons. Almost immediately, the toolbars were a big hit and everyone at all skill levels starting using them.”
Jensen Harris, “The Importance of Labels”

“Web iconography instantly denotes certain site elements… it’s important to appeal to the viewer’s sense of familiarity here. A custom set of icons has a certain cachet, but if your ideogram is too obscure, it will fail to communicate the desired message.”
Jessica Neuman Beck, “Does Your Copy Hold Up To A Quick Glance?

“Ever notice how many iPhone icons use analog objects? Phone, envelope, etc. We are wedded to the comforts of familiar objects.”
“Yet how many kids growing up these days will know why an icon for a phone is shaped like that?”
Brenden Dawes tweets, “Iconography: Where are we headed?

“Images are the main content of our thoughts regardless of the sensory modality in which they are generated and regardless of whether they are about a thing or a process involving things or about words or other symbols.”
Antonio Damasio

Also referenced are these articles and books-

Realism in UI Design
The Humane Interface
Designing Web Navigation

Say What? Learning to Speak Dev

When I started my current job back in February one of the first things I noticed was that I didn’t speak the language. It wasn’t that I was a stranger to acronyms – the Boy Scouts are quite fond of them – but these were new and strange letter combinations accompanied by words I was not accustomed to hearing. So I decided to start a little dictionary and felt this would be a great place to share it.


This is actually the model of software development we work off of, so it’ll get more detail than Waterfall. It was actually developed as a reaction to the Waterfall model and is based on the Agile Manifesto. Instead of trying to approach the entire project as one large piece of work it is divided into smaller chunks of work. The larger project is put into the format of a vision and these smaller pieces are put through the entire requirements/design/coding/testing gamut in a boxed period of time called an iteration. Sometimes these smaller pieces of work can be released on their own, whereas other times they are released as a whole when the vision is concluded.

This method has something of a cyclic nature. More like a rapid than a waterfall. Instead of each section being completed then not touched again as it goes the process things like testing and design are incorporated all the way through so that problems can be discovered and addressed early and quickly.

Command Line

Plain text interface is where interactions with the computer occur through written lines of text – no graphics. This term was not entirely new as I used to play in DOS as a child, but it disappeared from my vocabulary until I began working with Linux loving developers.


When most girls talk about committing they’re referring to marriage, but here to commit is to add completed code work back into the main project’s code base. While this is a common occurrence it can occasionally lead to being hosed. Thank goodness for the ability to revert to a previous state.

GUI (Graphic User Interface)

Pronounced ‘gooey’, this always makes me think of warm chocolate chip cookies. In reality, it’s what you’re used to seeing on the screen of your computer if you’re not a Linux user. Unlike command line which is totally text based, GUI uses a graphical interface to let you communicate with your computer.

HCI (Human Computer Interaction)

This is actually the field of work which preceded User Experience Design and studies the interaction between, you guessed it, humans and computers.


Basically, you’re out of luck. If something is ‘hosed’ it is completely and utterly broken down. Good luck if you need anything from it in the near future. The term does exist in Urban Dictionary if you’d like further examples.

IA (Information Architecture)

The underlying structure and organization of a website. This has close ties to library science and shares a lot of similarities since its all about organizing information so that it can be found and understood.


In the greater world and according to Webster’s this is usually used in relation to something like a speech impediment, but here is it is more closely tied to the verb ‘impede’ which is ‘to interfere with or slow the progress of’ so an impediment is anything that gets in the way of work being completed.


A measurement used to represent a pre-determined period of time during which work is done and reviewed. The goal is to have a working piece of software at the close of a sprint.

NUI (Natural User Interface)

The most recent development in interfaces, this is supposed to mimic the natural world closely enough so that it becomes intuitive. Examples of this can be seen in the various touch screens out there which allow you to interact with them via ‘gestures’ like ‘dragging’ something across the face of an iPad or iPhone.


So this particular entry is a bit of a joke for my co-workers. I’ve long been familiar with this typeface, but due to it’s recent rise in importance it was felt this should be included in this list. To the developers delight it is the bane of Lisa’s existence and has become and ongoing source of joking and pranking in the office. If you ask the devs, it is all that is right and glorious in the world even if there are occasionally consequences to this sentiment.


Originally this stood for ‘personal home page’ when it appeared on the scene in 1995 and is a general scripting language. In essence it’s a way to write web pages that do things. Now that I know it exists I see it pop up all over the place, but it seems to garner mixed responses around here. It may not be PHP’s fault though. It could just be getting a bad rap due to some old code the guys have to clean up.


Is not only a snake after all. It is another programming language that is supposed to be highly readable and has caused much excitement amongst the guys I work with. It was originally developed in the 80s and has had updates in 2000 and 2008. Apparently it makes you fly as well.


According to Wikipedia, it ‘is an iterative, incremental framework for project management and agile software development.’ Basically it’s a development team who have a Product Owner to represent the stakeholder and a ScrumMaster to maintain the processes. In our office those two roles are mostly combined.

The biggest thing (to me) with scrum is the three forms of review incorporated in it. Daily Scrum is within the team every morning reviewing the previous days work, plans for the current day and work impediments. Scrum review is presenting work completed in a sprint to the company at large. Then there’s the retrospective that is again within the team.


A model of software design that is sequential starting with requirements and ending with installation and maintenance. Each piece of the process is completed in its entirety before moving onto the next one.


Letting the code out in the great wild world. A release is when all the project work is done tested and shared with those who use the program it was intended for. In terms of software there is usually a ‘beta’ release which goes out to some folks who are will to test it to see how it functions beyond our walls and then, assuming all remains well, a general release which includes anyone else with the software.

In other words, whenever you get a notification to update your web browser (like Firefox or Chrome) or an app on your iPhone/iPod touch that means that the folks who are working on the software for that product have put out a new release for it.

Retrospective (Retro)

A regularly held meeting (usually at the end of a sprint) where the team discusses what was good, bad and needs to change since the last retro. At the close of the retro items are starred and assigned to be completed as well as there being a review of the previous retro’s stars to see if all of that work was completed.

UX (User Experience)

I have tried to find a simple explanation for my job and failed, but I will come back with a better description in a post just on this subject. My friend Zach says that UX is about ending suffering in regards to technology. I usually describe it as that I work with the development team to make sure that the things we make can be used by actual people.

UI (User Interface)

Tied in with the field of HCI, the user interface is the place where the actual interaction between human and computer occur.


The overall goal of the current development project which contains the key points of what is to be achieved by the completion of the project.

War Room

This is a communal work area, also sometimes known as a Bull Pen, which is common practice in Agile to increase face to face communication. Communication, of course, can include many varied and entertaining things. In our case it is a communal cubicle and we do call it the War Room. It even has its own twitter feed – @InTheWarRoom – which documents some of these entertaining communiques.

I’ve hit that point now where I don’t even realize how much I’ve learned by immersion so I’m sure there are terms I’ve missed. Feel free to include terms that probably should have been included in the comments below (or ask about ones you’re curious about).

Life Online: Humor in the Hated Error Message

Error messages. We love to hate them. They’re like that whack-a-mole game we played as kids. You hit them to make them disappear only to have another show up mocking you from a nearby location. On and on they seem to go, only unlike the game the errors don’t stop coming after a certain number of encounters.

As one in the field of User Experience (UX) one of our major goals is to prevent those pesky little messages from ever appearing, but despite our best intentions errors still happen. Because of this in Jakob Nielsen’s ‘Ten Usability Heuristics’ Error prevention has a friend known as Help users recognize, diagnose and recover from errors. Here is his recommendation on how to accomplish that:

Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

It’s good right? None of us like getting the messages that say some random line of letters and numbers is having an issue with port 80 and needs your attention. Well, developers probably like those, but for the rest of the world it tells us nothing other than that our computers hate us in that moment in time. Plain language is a very good thing.

So, earlier this afternoon I got an IM from the Product Owner (lead) for the team I work with asking me to write an error message. It turns out that people who have cookies turned off in their browser couldn’t get past the first page of our sign-up process. I asked a couple questions then quickly mocked up samples for them. They were narrowed down to these two potential options.

Option 1

We know cookies can be hard to share, but we need them in order to proceed. Please check your privacy settings to make sure they are not disabled.

Option 2

Please check your privacy setting and makes sure cookies are enabled in order to proceed.

These were read by a fellow UXer, the Product Owner and myself. We all had the same reaction and I found it fascinating. Personally we all liked ‘Option 1’ better, but felt that we should use ‘Option 2’ in the actual message users read. We even agreed that we prefer a sense of humor when we encounter error messages, but that was not (as far as I am aware) the message that was chosen.

Why? Because convention, standards and even our heuristics tell us that that’s what we’re supposed to do. In fact the heuristic previous to the one previously quoted says that ‘dialogues should not contain information which is irrelevant or rarely needed’. In other words, no joking about cookies.

Now, I know I have a bit of a quirky sense of humor. I’ve even got a category in my blog known as ‘Shenanigans’. What I’m curious about is what the actual users of the internet think.

Which option would you rather see if you got that error?

Previous Older Entries