I stepped away from my computer and paused Pandora. When I returned, I noticed that they had updated the interface to include a large pause icon over the current track. This struck me for two reasons

1)It made it immediately apparent that the system was paused. In previous sessions, I had struggled with the play / pause toggle (largely due to delays in pumping sound into my headphones). However, I was also confused by the toggle itself. Was the grey triangle for play representing that it was "pressed" and therefore playing music? Or did the orange color indicate the state? In the new version, I have no questions, I clearly know when the system is paused.

2)The area to get the music playing again is MUCH larger than the small play button. Now I can click anywhere on the album cover to resume my listening session.

On May 9th, IxDA-DC and DCIA held a conference RedUX of the 2009 IA Summit and Interaction conferences at CDIA in Georgetown. The event had 13 world-class speakers, 5 hours of presentations, over 100 attendees, and cost less than $500 to organize. You can watch video of all the presentations at the ux workshop

My big take aways from this event:

Your career is what you make it.
Find a way to explain why you are important in only 1 sentence without hesitation. Believe it. You can take charge of your career by sharing your message / knowledge. You are an expert. Share your knowledge. Grow your network. If you are not blogging, start. Read as much as you can and share your thoughts. Use twitter. Use your REAL name. Stay positive.

Your job is your business school. Learn from your organization: what does it do well? What does it do not so well? Collect samples: documentation, contracts, etc. What makes a bad client? What methodologies didn’t work? Why? What makes a bad boss? What makes a bad employee?

Strategy is very much dependent upon themes.
For a storyteller, theme is used as a compass. Themes can inform strategy. On the web, a theme is an overarching statement or phrase that encapsulates the value and focus of the experience that we intend to deliver. For the tech team, themes can define functional and content requirements. Examine every element in terms of the theme. The theme coordinates the elements of a story / direct message of your site.
In this way, themes help us design for pleasure, emotion and meaning.

Guiding principles for prototyping:
1. Know your audience and their goals
2. Don't plan too much. Prototype a lot.
3. Set expectations.
4. You CAN sketch.
5. It’s not the Mona Lisa.
6. If you can’t make it, fake it. (simulate AJAX with keynote, .ppt, even paper)
7. Prototype only what you need. Don’t do the whole entire system

Managing people is different than managing face-to-face
1.Enrich your communication skills
2.Be sensitive to what going on in other locales: Don’t schedule a meeting with team members in New Orleans on Mardi Gras
3.Email: Avoid sarcasm, terseness, and contractions
4.Telephone: Be clear and direct. Speak up. Sometimes you NEED dialogue. Don't be afraid to use the phone because you are used to email.

The UX Community is passionate.
The UX community is passionate about the work that they do. Thanks again to all who pitched in to make this happen; especially those that traveled great distances.


Thanks to Matt, Sophie, & Courtney for contributing their notes / feedback on this post.

I attended Eightshapes first Monthly Workshop Series. Dan Brown hosted the event and discussed concept models. The big take away from this session is that concept models illustrate relationships by connecting nouns with verbs. The nouns are concepts. The relationships are verbs. During the workshop it occurred to me that focusing on nouns and verbs could be a good listening technique when having conversations with clients.

Dan's full presentation is on Slideshare. I've included my notes from the session below.

What & Why

1) Highlights buried concepts
2) Shifts conversation
3) Draws connections / Conveys relationships
4) Contextualizes concepts
5) Establishes the problem space / Domain: (inputs, requirements)
6) Sets the direction of the design: describes the product in some way
7) Helps prioritize the needs of different groups
8 ) Allows team to engage in conversation about strategy, requirements, etc.
9) Provides a common vocabulary
10) Clarification of ideas, what did I get wrong? Presents ideas / direction for approval

How do concept models compare to other types of documentation?

Sitemaps: show hierarchy of site
Flows: Have clear start and end points. They show transformation
Concept Maps:Do not show hierarchy of the site, but illustrate the underlying strategy.
Mindmaps:is a subset of concept maps.

The Basics

Concepts models make explicit links between concepts (verbs) Note: these links can have directionality.The concepts are nouns. Ideally, a concept model will have few than two dozen concepts.

Variations of Concept Models

Value Proposition: Boil everything down to a central concept

Duo, Triad, or Quad: Focus on relationships. The relationships are more important than the nodes.

When to Use

1) Early in process
2) Think about big picture
3) Have an opportunity to iterate
4) When thinking about operational model

What to consider when planning your model?

Audience
Who is sitting across the table from you?
1) Person who likes to go through the nitty gritty? They are good at providing feedback
2) Person who likes to help?
3) Person who is good at think abstractly?

Beyond considering your audience for this document, consider how you will communicate the following and why you want to communication these to the client. Dan pointed out that sometimes the best audience for a concept model is himself and he doesn't show them to clients.

Core Message
1) You've got too much going on here
2) What concepts (nouns) are talking to each other?
3) This is what I think the site should be
4) There are meaningful relationships here.

Collaboration
1) Sharing for feedback
2) Requires some planning

Purpose
1) Describes the structure
2) Shows the big picture

So What?
Be prepared to speak to why you are having the client review this document. Be as specific as you can when communicating the results with them. It is often better to have the Concept Model in your back pocket and tell a story to the client while drawing the concept model, piece by piece, with them.

The role of concept models in various project stages

Concept Models in Discovery
1) Creating relationships between users and users needs
2) States the domain
3) Identifies what is missing
4) May have simple visual language
5) May have too many relationships included
6) May create a visual distinction between known and unknown

Concept Models in Strategy
1) Context setting: Where does it fit in the big picture?
2) May highlight one aspect of a product
3) Vision setting: Defines the end goal.
4) May skimp on detail
5) May choose relationships to demonstrate improvement area

Concept Models in Design
1) Conveys underlying structure by describing the content
2) Be careful about the number of concepts
3) What do the relationships say? Typically, they are navigation points
4) May make it look like page thumbnails

Many of our clients include e-newsletters as part of their content strategy. As such, the website typically requires some sort of newsletter registration form. Knowing that disseminating information through multiple channels is core to many of our clients content delivery strategies, I wanted to do a little research and determine what are some of the best ways to design for e-newsletter registration. Here are some guidelines for newsletter registration.

Demonstrate the Value
Most users that I’ve interviewed are wary of what information is delivered to their inboxes (note: we guard our mobile phones even more closely). People are busy and they want to make sure that if they sign up for a newsletter, it will provide them value; not just clutter their inbox.

The first step in demonstrating the value of your newsletter is to inform your users of exactly what they will receive by registering and how often they will receive those updates. By signing up for your newsletter, will they receive periodic updates with interesting topical news, how-to tips, links to resources? Or will they receive promotional emails that alert them of special offers and new products? Or are they receiving short messages that alert them of upcoming events, recent community activity, or organizational news.

Congressional Quarterly provides a link to view a sample newsletter adjacent to the Sign Up button. When the user clicks on the sample newsletter link they are able to view the full sample newsletter in another browser window.


Another way to demonstrate the value is by allowing users to visit the newsletter archives prior to registering. This allows users to view all of the newsletters online prior to registration. We take this approach with our newsletter registration

Inform Users of Publication Frequency
Another factor that users consider when registering for your e-newsletter is frequency of publication. They want to know if they can expect communication from you on a monthly, weekly, or daily basis. Jakob Nielsen Alertbox Email Newsletter is a good example of how to do this.


Make It Easy to Sign Up
Technically, the basic requirement for e-newsletter registration is that the user provides you an email address; however, organizations often see this as an opportunity to gather information about their target audiences and ask more questions than those that fulfill the user’s primary goal. As with every web form it is important for you to consider what information you actually require from your users.

The context of registration is an important aspect when considering what information you should collect from users during registration. Users typically sign up for users in one of two contexts: 1) when registering for access to your website, or 2) by using a newsletter registration form. During site registration, your organization can provide the user an opportunity to sign up for your e-newsletter along with registering for the site. When the user signs up through the newsletter registration form, the primary intent is to receive the newsletter and may not want to provide your organization any more information that email address. If you do decide to request additional information during newsletter registration, be sure to inform the user what you intend to do with that information. Your organization should also consider what you are going to do with the information once you collect it. If you do not have a clear need / plan for the information request, it doesn’t belong in the registration form.

Other Resources
http://julianpowers.net/2009/03/newsletter-previews/
http://www.90percentofeverything.com/2007/10/26/newsletter-subscription-on-iwantsandycom/
http://www.ids.ac.uk/go/ks/how-we-guide

Yesterday, I attended my first Barcamp, called Mobile Tech 4 Social Change. The event was organized by Katrin Verclas of MobileActive.org , co-hosted by Google and sponsored by Forum One and Mobile Commons.

Mobile for List Building

One of the sessions that I attended was about how the Obama Campaign used mobile technology to grow their membership lists. The speaker, Jeff Lee, Distributive Networks, shared some of the best practices that he learned from working on that mobile campaign. I've also tried to weave in some of the themes and advice from other presentations below as appropriate.

Place Call to Action Button Everywhere
Jeff, and others throughout the day, said that the best thing that you can do with your mobile campaign is to have a clear call to action. Something like “Text: [xXxX] for Hope.” Once you have the clear call to action, piggy-back it on all of your other communication channels: website, radio, television, direct mail, twitter, yard signs, posters, email, etc.

Once a user responds to your call of action, there is standard language that has to be included in the response that allows the user to opt-in, opt-out, etc. When the user confirms that they are opting in, use this as an opportunity to gather additional information about your user. For example, the Obama campaign asked users to text their zip code to [xXxX]. More on Mobile Marketing Association Guidelines

One of the interesting statistics that was shared is that once a user answered the Obama campaign’s call to action, there was only about a 3% opt-out rate. There was some discussion around the Obama Campaign and later about the Humane Society campaign that suggested that the opt-out rates were so low because users guard their mobile numbers and is only likely to give them out to organizations that they strongly support. In other words, your mobile campaign may only be reaching your hard-core activists.

Provide Incentive
Another theme for list building was to get users to opt-in to your mobile campaign you need to provide them with incentive to do so. In the case of the Obama Campaign, they offered the chance to get VIP seating, a chance to meet the candidate, a free bumper sticker. They consistently offered incentive to grow their list and to gather more information from existing list members.

Use Palor Tricks
During the Obama campaign, the number one reason that users opt-in to the list was to find out who the vice presidential candidate was going to before the news media. Basically, the Obama Campaign said, if you text Hope to [XxXx] we will send you a text message that will tell you who the vice presidential candidate will be, before we tell anyone else. This is a great example of incentive.

Another classic example of this was used during the 2008 Democratic National Convention. A speaker (I think it was the Gov. of Colorado) pulled out a mobile phone and he addresses the crowd that they had set up a competition between the states to see which state has more support for Presidential Candidate Obama. His call to action is Text your zip code to [XxXx] to show your support. Then the jumbo-trons in the stadium show a US map with stars exploding to demonstrate when someone from that state sends in a text message. The response is overwhelming. Turning texting into this type of competition was extremely helpful to the Obama campaign because it provided them the user’s phone number and zip code which allowed them to target their messaging to those users.

Consider the medium:
When sending text messages to your users, remember that they may be paying to receive those messages. That means that you should be judicious with the amount of messages that you send. You can also gauge your frequency of messaging based on what you know about the group. For example, the # of messages in Obama campaign went up significantly as they approached election day.

Empower Along the Way
Think about how you can empower you activists to support your cause. During the Obama campaign Paul Notzold visited 10 cities in 10 days and projected text messages he received about why people were voting for Obama on public buildings. This was a bit of a missed opportunity for the Obama campaign because the text messages went to the artists phone and not directly to the campaign. Perhaps, the campaign could have coordinated with the artist to expand the distribution list.

The work that Paul Notzold is doing with mobile technology is really interesting and it is definitely worth a trip to his site.

Share Your Success and Disasters
Another theme throughout the day was to share your successes and disasters. People want to learn from your mistakes. They want to embrace your successes and follow your lead. Present at barcamps and conferences and share knowledge on your blog.

Other Tid-bits:

Gathering Honest Feeback
When chatting between sessions about how to get honest feedback from surveys / interviews we came up with the following tactics to get honest feedback from participants:

Ask indirectly, “what would your ‘friend’ / ‘co-worker’ say about [topic x]
Follow up with: “Other participants provided these responses to the same question, rate how true you believe them to be.

Fundraising
The Humane society ran and A/B test of mobile subscribers. Half of the list received an email that asked them to donate. The other half received an email and text message asking them to donate. Subscribers that received the text message were 77% more likely to donate than those who did not receive the text message.

Random Stats
70% of people are still not on smartphones. Yes techies, not everyone owns a iPhone

Final Thoughts

While this was my first exposure to mobile technologies, it seems that the strategies and tactics of a good communication plan apply here as well: know your audience, design for engagement, target your message, provide them clear calls to action. While attending the sessions, I also consider how similar the advice that was provided here was to advice provided for designing for social media engagement.

Great event and I hope to learn more about mobile technology soon. Who knows maybe I will even get a smart phone soon.

I was recently working on a site map and I wanted to show a secondary relationship between two pages. Up to this point, I had been creating fairly strict hierarchal representations and the connector tool worked well for my needs. In other tools that I am more familiar with, I'd reach for the pen tool and draw a dotted line connecting the two boxes.


I assumed that Visio would have basic drawing functionality because it is a pretty good diagramming tool; however, I didn't notice it in the tool bars that I had opened. I was looking for either a fountain pen icon or pencil because that is how this functionality is represented in other applications. When I could not locate those icons, I turned to search. I tried "Draw" and "Pen" and "Drawing" but I didn't notice anything that seemed appropriate in the first 10-15 results. Hmmmm. Clearly, I am not thinking about this functionality the same way as the application wants me to.

A few days later, by accident, I clicked on the icon that looks like green circle overlayed on a blue square. Aha! The drawing toolbar popped up in my canvas and it contained the pencil tool and a freeform line tool! I am still getting used to the way that I have to draw in Visio; however, at least now I know where to find the tools.




A few key take-aways that can be applied when designing web applications.

Icon development is definitely challenging; however, you can achieve better success if you consider how your users think about the functionality that you are attempting to represent. For example, when users think about the activity of drawing; are they more likely to think about shapes or the tools (pen, pencil, eraser) that allow them to draw? Activities that you may want to perform when considering how to represent functionality/idea with an icon include: brainstorming, word association, exploring other icons that represent the same thing, and, of course, testing with users.

If your application's help documentation is a searchable database, make sure that most relevant content to a user appears in the first 10 results. When I search for "Drawing" in Visio Help, the drawing toolbar did not appear in the first 25 results. Also keep in mind that if the user has turned to the help documentation, he is not necessarily using the vocabulary used in your system.

Disclaimer: if I search "Drawing Tools," the toolbar is the first result.
A second disclaimer: When preparing this post, I noticed that the 5 result when I search drawing is "Draw a line
Help > Creating diagrams". When I clicked on this it did have the information I needed; however, when I required the information to complete my task, I did not notice this result. Perhaps, the fact that the breadcrumbs indicated that it was about creating diagrams made me ignore this result. Nevertheless, the result was there but I did not notice it.

Twitter is buzzing this morning about the upcoming release of EightShapes' Unify. EightShapes describes Unify as a "suite of templates and libraries for creating better, more consistent design deliverables, faster." Be sure to check out the What You Get and Benefits & Challenges sections

I saw a demonstration of this system last summer and started experimenting with the principles behind the system but without the templates. Once I was able to get some libraries created, I was able to move from sketch to documentation MUCH more quickly. I am really excited about this upcoming release and I hope to have some time to experiment with it further.

Recently, I've come across a number of User Experience reading lists like the one created by School of Visual Arts in NYC, and this one created by Jackson Fox. I find lists like these to be very useful because I find books that I have not read like Tog on Interface and Designing for People. In the spirit of sharing, I thought that I would recommend a few books that I have found to be incredibly useful:

Reading Images: Grammar of Visual Design
by Gunther Kress (Author), Theo Van Leeuwen
Honestly, I have not seen this book discussed in UX circles; however, it provides a framework for reading images and visual compositions. The authors argue, that visual compositions, like verbal and oral forms of language can be deconstructed in to a visual grammar. As designers, if we understand the culturally based grammar of reading images, we can leverage the principles when design. It's a great read for anyone interested in visual communication.


Communicating Design: Developing Web Site Documentation for Design and Planning
by Dan Brown
I often find myself referencing this book as a create a piece of UX documentation that I haven't created in a while, or as I prepare for a client meeting. Dan provides excellent examples and ideas to consider prior to presenting your materials to clients. If you don't have it yet, it's a great resource.



Information Architecture: Blueprints for the Web
by by Christina Wodtke (Author), Austin Govella (Author)
I haven't read the 2nd addition; however, my copy of the 1st addition is well used. This is a very practical book about information architecture and it uses language that people who are not IAs can understand. This is the book I find myself lending to people who want to find out more about IA.

What are you reading that I should check out?