User Interface Engineering

Duration: 34m | 18 MB
Recorded: February, 2010
Brian Christiansen, UIE Podcast Producer
[ Subscribe to our podcast via ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]
[ Transcript Available ]

Podcast: Play in new window | Download

Julie Zhuo

When Facebook tweaks anything, it gets coverage across the IT and design realms, and sometimes the Wall Street Journal and New York Times. If the users don’t like the changes, they form protest groups… how can a team operate under such a public microscope?

Julie Zhuo knows. She is the Product Design Manager at Facebook. As the principal designer behind the Facebook Platform and Facebook Connect experiences, she’s contributed to the last two major site redesigns. She also leads the front-end user interface engineering team. On her watch the site grew from 8 million college kids to 350 million people across the globe.

Jared Spool had a chance to chat with Julie recently. The stories she shared, from behind the scenes, are fascinating. When was the last time a throng of people gathered outside your office because you changed a feature on your site? Julie tells that story in the podcast, plus touches upon:

• The early years of innovation and launching features fast, and without testing
• Taking major design risks in front of a large, passionate audience
• How they moved to a strong routine of metrics, A/B tests, usability testing and staged rollouts
• …and much more

Julie talks about the transition from the run-and-gun design strategy that Facebook once used to roll out new features fast, and how it evolved to a more measured approach, while still moving quickly:

We are cognizant of the fact that every time we make a change, the initial user reaction is going to be a little bit negative. That’s why listening to feedback really matters. If all of the feedback is basically, “I don’t like this change because it’s different,” then maybe that’s a sentiment that will go away once people use it regularly.

But if the feedback is, “I don’t like this change because now I can’t find my applications,” or “I can’t find chat,” or “I can’t find messages.” Then that’s a real wake-up call for us that we really need to examine this change and see if we’ve regressed in making it easier and better for users.

They progressed to a test first, launch second strategy, that in some sensitive cases involved a lot of testing.

Last December we launched a change to privacy, and so when you logged into Facebook one day, you got a little privacy dialogue that said, “Hey Facebook is making some changes to privacy. Please revisit your privacy settings.”

That is not going to take that long to build. Right? It doesn’t take that long to design, it’s just one little dialog. But the process for us getting to that final point was months and months, because we knew privacy is such a sensitive topic for people that we wanted to be absolutely sure that what we were doing people would be comfortable with. It was the right thing to do.

Maybe four or five months prior to our launch, we were already bringing people in. We hadn’t even started building the pod. It wasn’t really even designed. We were just showing them a little text dialog with the language that we were going to use and with a lot of different options for how we would present this messaging to them.

These are like paper, low-fi prototypes, nowhere near what the final product will be. But prior to us even building and getting nice mocks from everyone, we already had at least five sessions with a bunch of users testing about 30 different versions of the language and the messaging for this dialog.

So many companies struggle with building the proper amounts of user research into their design process, but so few do it with so many users and so much public attention. Julie’s stories are fascinating case studies that should prove valuable to your own organization.

Julie has many more stories from behind the scenes at Facebook which she’ll share with us in San Diego at the UIE Web App Masters Tour. Join us for her Design Lessons from 350 Million session.

Are you struggling to balance the need to launch features fast with the necessary user research? Let us know in the comments.

Tagging has been around for more than 8 years. The technique, also called folksonomy, is simple: users apply their own words or phrases to content they uncover, leaving a trail back for themselves and for future content seekers. Each tag conveys meaning, giving a path to discovering new content that traditional navigation can’t.

Since their inception, we’ve seen some excellent implementations and some disastrous ones. The excellent implementations quickly lead users to the content they seek, and help discover items they didn’t know existed or wouldn’t have found otherwise. When implemented poorly, the tags just confuse the users and clutter the interface, not adding any value or meaning.

In this issue of UIEtips, Stephanie Lemieux explores what tagging might look like inside of the enterprise firewall. How does it work when we’re applying tags to serious business content? If you’re wondered whether there are benefits to a folksonomy on an intranet, you’ll want to read her article.

Read the article Social Tagging and the Enterprise—Does Tagging Work at Work?

Stephanie is taking tagging further, exploring the implementation patterns for both public-facing sites and enterprise content, in her upcoming UIE Virtual Seminar, Tagging with Folksonomies in a Taxonomy World. Learn more about the March 10 webinar and Stephanie’s insights and ideas for successful implementations.

Get the details on Tagging with Folksonomies in a Taxonomy World.

Have you explored tagging within your organization? What have you found that works? What should others avoid? We’d love to hear your experiences below.

When folksonomies showed up almost 10 years ago, they promised to make information on our sites easier to use. After all, if users apply their own tags to every piece of content, everything will be easier to find, right? Maybe yes, maybe no.

Our favorite taxonomy and category expert, Stephanie Lemieux, has spent the last few years integrating folksonomies into several large-scale web sites. In our next UIE Virtual Seminar—Tagging with Folksonomies in a Taxonomy World—she’ll share her experiences, showing us what works and what to avoid, when you integrate folksonomies into your taxonomy and category design process.

Implementing tagging won’t replace your site’s taxonomy. Instead, a well-integrated folksonomy can create a synergy that makes a site’s vast content more findable. Stephanie will walk you through several proven implementation strategies for public-facing web sites, behind-the-firewall enterprise systems, and intranets.

Did you miss the webinar on Taxonomy that Stephanie did with Seth Early in 2009? Register for our next webinar with the promotion code BRAINSPARKS, and we’ll send you the link to that recording.

How do you classify your information? When your users have added their tags, what challenges did that create for you? We’d love to hear what you’ve learned and what questions you still have.

Duration: 36m | 17 MB
Recorded: January, 2010
Brian Christiansen, UIE Podcast Producer
[ Subscribe to our podcast via ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]
[ Transcript Available ]

Podcast: Play in new window | Download

Bill Scott

If you’re using advanced, or “rich” interactions in your web applications, then it’s likely you have Bill Scott and Theresa Neil’s Designing Web Interfaces on your desk, if not your bedstand. Published in 2009, it is perhaps the definitive tome on rich interactive design patterns for the web. Bill has dedicated a significant portion of his career to dissecting such interactions, creating the Rico JavaScript library, curating the Yahoo! Pattern Library and now overseeing UI engineering at Netflix—one of the first companies you think of when you think of Ajax-y web interfaces.

It’s hard for us to picture talking about web apps without talking about Bill and his research into design patterns. His new book is full of examples where he slows down time to explore each micro-stage of an interaction. Our Jared Spool got together with Bill to discuss his ideas about the nuances of Interesting Moments.

Jared and Bill discussed,

• Bill’s experience of aggregating successful interactions in the Rico JavaScript and Yahoo Patterns Libraries
• How his challenges at work lead to him writing Designing Web Interfaces
• How his interface research lead to better ways to capture interactions for documents and prototypes.
• Dancing Hamsters
• …and more

Bill speaks about both patterns—successful interaction models for common interactions—and anti-patterns. By showing what not to do, anti-patterns often provide insight on the right way to do something.

A good example [of an anti-pattern is from] the old Yahoo Photos site[…] dragging several photos into an album, there’s no indication that the photos actually dropped into the album folder, and there’s no feedback that says, “Oh, there was three, but now there’s six items in the folder.”

The designers had dropped in two extra “idiot boxes”, which is a great anti-pattern. The first idiot box says, “Do you really want me to drop these items into the folder that you so carefully managed to use your mouse dexterity to get to?” Not quite that message, but that’s gist of it.

Then there’s another pop-up that says, “Hey! Guess what? We did what we said we would do. We actually put those items in the folder.” It’s sort of, as Alan Cooper calls it, “stopping the proceedings with idiocy.” The missed moments were just those little, subtle feedbacks that could have been done, instead of the hammer approach, by having those boxes pop up and interrupt the user.

The take away for our work is that this interaction was backwards. It gave no indication that you were doing something successfully while you were doing it, and then penalized your time after completion with dialog boxes to confirm your success: “You did it!” After dismissing the dialog, you were left with an interface that didn’t reflect any of your changes.

By adding clues that the move was happening during the action, and then reflecting the changes with interface cues afterwards, we can make the experience smoother while avoiding “idiot boxes” altogether. (This interaction is detailed in chapter 5, “Overlays” of Designing Web Interfaces)

There are many more pearls of Bill’s wisdom available in the podcast, please tune in!

Don’t miss Bill’s full presentation, “Designing for Interesting Moments“, at our Web App Masters Tour. He’ll be with us in San Diego, Minneapolis, Philadelphia and Seattle.

Let us hear your questions about interesting moments in the comments below…

When our applications grow large and complex, how do we help users find the right commands and functions? If we were talking about large data sets, we’d build in a search capability. Would search also work for finding commands?

Our good friend, Hagan Rivers, explores that question in this issue of UIEtips. Inspired by our recent UIE Virtual Seminar on Search & Discovery Patterns with Peter Morville and Mark Burrell, Hagan started thinking about her own area of expertise: making complex navigation simple. That’s when her article, Browse vs. Search in Application Navigation, was born. We know you’ll enjoy it.

Read today’s UIEtips article.

At our upcoming UIE Web App Masters Tour, Hagan will be sharing with us her secrets for dealing with gnarly, complex web app navigation issues. She’s just one of the great designers we’re featuring in this four city tour, which starts in San Diego next month. Details for the tour are at www.UIEtour.com.

Are you building large applications where users need help finding commands? What techniques have you tried? We’d love to hear your experiences below.

Robert Hoekman, Jr and I are teaming forces once again, to do our best to answer your UX questions.

If you’re not familiar with it, Robert and I do a little podcast show we call Userability. You ask us a question. We give you an answer. Occasionally, we give you a good answer. Sometimes, we (and by “we” I mean Robert) gives you the right answer.

It’s time to get more questions. If you’d like to be on our show, just enter your question here or send us an email to userability@uie.com. We’ll select the most entertaining and interesting questions, then set up a time to record the answers.

Personas have been part of the UX toolbox for a while. Yet we’ve always wondered why teams don’t use them more often. A few years back, we set off to answer that question.

We discovered a variety of ways to create personas — each valuable in their own right. With our clients, we’ve been using a field-research-based technique. This method creates robust, data-based persona characters and scenarios.

Tamara Adlin has a fabulous workshop technique, one she calls Ad-Hoc Personas, which builds the characters out of information that the organization already knows.

Steve Mulder has some great techniques for using analytics and market research to gather and validate persona characteristics.

From our research, we’ve found all of these are useful methods and, when done well, deliver value.

When we analyzed the results, the initial findings show teams that approach personas the right way get great benefits from them. Unfortunately, many teams don’t realize what makes a persona project successful. They focus on the wrong aspects, dooming their project
to failure.

In this issue of UIEtips, I share the essence of successful persona projects — the key factors teams should understand. It turns out that once you know the right way to approach the project, it’s straightforward to make it successful.

Read the article, The Essence of a Successful Persona Project.

In the article, I talk about how impressed we are with Tamara Adlin’s Ad-Hoc Personas technique. We think this is an essential tool for getting everyone in the organization on the same page. Don’t miss the UIE Virtual Seminar on Thursday, February18, where Tamara walks us through the method. Read all about it.

Have you been successful at creating and using personas in your design work? Which factors do you think helped the most? Share your thoughts below.

Duration: 35m | 16 MB
Recorded: January, 2010
Brian Christiansen, UIE Podcast Producer
[ Subscribe to our podcast via ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]
[ Transcript Available ]

Podcast: Play in new window | Download

Luke Wroblewski

Web forms are the mouth that feeds most web apps. There’s no way around that. Yet, few people are thinking about how to make one of the more unpleasant parts of the web more pleasant. The world’s foremost authority on web forms is Luke Wroblewski, author of the heralded book, Web Form Design. It’s no coincidence that we lean on Luke often to join us at events like our upcoming Web App Masters Tour.

Jared Spool sat down with Luke to discuss what’s been happening with web forms since his book came out. It winds up there have been some interesting developments recently.

The first trend Jared and Luke discuss is new ways of styling forms to make them less intimidating. Perhaps the most popular form to employ a friendly and unusual form design comes from our good friend Jeremy Keith and his innovative site for finding and listening to MP3 files, HuffDuffer. Jeremy’s Huffduffer signup form is unusual to say the least. If you’ve been a parent or child in the U.S. since the 1960s, you may think the form’s design strongly resembles that of a Mad Lib.

In general, anything that reduces the stress of filling in a web form, Luke likes:

Even though Jeremy’s form on Huffduffer looks like a piece of narrative, Mad Libs-style prose, underneath the surface it’s all real input fields. It uses what they call progressive enhancement, which is the JavaScript technique where you do this baseline HTML and then gradually layer more advanced functionality.

So his form will work on a real old browser. It’ll allow people to tab between the fields like they do on a regular form. It’ll allow them to put their cursor into every field and type in there. It’s coded in a way so that it actually has labels so screen readers can use it. It has a kind of primary action at the moment, that once you get through the whole thing you can submit. It does actual error checking, and so on and so forth.

So even though it’s this example of rethinking the format of a web forum, it’s still keeping true to things that keep web forms work online. It’s not breaking them, it’s not forcing people to really shift their mindset.

And I think that’s a very interesting direction I’m seeing across the web and in many places. It’s people building on what makes web forms tick, but using new rich technologies, new more interactive format, kind of maybe persuasive design, if you will, to make filling in those important web forms less painful.

However, the visual affordances can make or break the success of the form. Since most web forms haven’t changed since 1996, people have expectations. People succeed with Jeremy’s form because it’s obvious. But poor visual design can ruin a form, as well.

Luke recounts an experience he had at Yahoo! that exemplifies this point:

We had a directory page for the podcasts, and […] at the top of the page we had this input field that was open, which allowed people to tag that podcast episode with whatever terms they wanted.

And because people saw that input field and it was towards the top of the page, they immediately thought “search field,” and they would run search queries in there.

[…] it’s that sort of muscle memory aspect of, “This looks like a search field because it’s up at the top of the page and it looks like an input field. I know what that is. Let me just go ahead and start using it.”

There a number of ways that you can validate information that someone enters into your web form, on the fly. When done correctly, this really helps people get through long forms with less frustration. However, if you’re too clever with your validation, you can make the experience even more frustrating than it would have been without your “help”. Luke provides us with several examples in the podcast. Tune in to hear his advice on how to help and not hinder your users.

Clearly you can see we’re excited to have Luke join us for our 2010 Web App Masters Tour, with his presentation, Input: Moving Beyond Static Web Forms. We’re pleased that you’ll be able to see Luke in all four tour cities, San Diego, Minneapolis, Philadelphia and Seattle. He’ll have all sorts of concrete advice you can act on immediately.

Treat your team to a conference-quality seminar right from your own office. Join us for the next UIE Virtual Seminar, The Power of Ad Hoc Personas: Truly Practical Methods to Get Your Organization On the Same Page, with Tamara Adlin, Thursday, February 18.

When you kick off a project right, everything is much easier. When that doesn’t happen, the team pays the price. We’ve all seen projects where, part way in, a well-intentioned executive derailed the team by changing the direction. To prevent this, we want to put everyone with the power to take the project off course, on to the same course.

Tamara Adlin has developed a great technique to make that alignment happen, which she calls Ad Hoc Personas. Her method, borrowed from research-based personas, creates characters out of information the organization already has at their fingertips. They’re inexpensive and easy to create, ensuring a customer focus from the very start of the project.

Register for this seminar before February 11, and we’ll automatically send you another great webinar recording, Making Personas Work for Your Web Site, with Steve Mulder. (Look for it in your confirmation email.)

Ever had a project de-railed after you’ve already started? How do you get everyone customer-focused and on the same page before you begin? Share you stories below.

Duration: 36m | 21 MB
Recorded: January, 2010
Brian Christiansen, UIE Podcast Producer
[ Subscribe to our podcast via ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]

Podcast: Play in new window | Download

Peter Morville is the co-presenter of one of our most popular UIE Virtual Seminars of all time, Leverage Search and Discovery Patterns. As is often the case, our audience came up with a heap of thoughtful questions, which we decided to break up into two podcasts. This is the first, and the second will feature Peter’s co-presenter Mark Burrell answering even more of your questions. Even if you did not attend, there’s a lot of great information in these podcasts.

In this episode, Jared Spool sits down with Peter to address many issues, including an interesting notion that Peter mentioned in the seminar;

“Browsing doesn’t scale.”

This came up in discussion about whether a site needs to be optimized towards search or towards browsing. Peter said that the two are all-but inseparable. The idea was that for very large sites, there comes a limit to how deep you can patiently navigate to reach the information you’re looking for. In these cases, many users would start their journey with a search, and then navigate from the results. An example of this use case can be seen with how many people use Amazon.com. Their visit to the immense site may start with a search for a particular product, author or artist, and then begin to navigate from their initial search results.

Best Result First Pattern

Another topic that proved popular was Peter’s Best Result First pattern. It may seem obvious that you want the best search result for a query to appear first in the results, but achieving that is not particularly easy. Peter suggests that it takes iterative tuning and testing while tweaking relevance algorithms, but then also pulling in other factors like popularity, date, and format data.

Advanced Search

Several attendees had questions about “advanced search.” Should it be built into sites to assist novice users sort through results better or to help sophisticated users dig more deeply? Others questioned if the notion of “advanced search” was dead altogether.

Peter replied that advanced search wasn’t dead, though many might wish it so. He observed that advanced search often causes confusion among users and many of these interfaces and options overwhelm them. He says you should design your search as if there would be no advanced search at all. One innovative way to give more control to searchers is to present search results with faceted navigation. This way advanced and novices users alike can have an understandable tool to filter through their results.

Faceted Navigation within Search Results

Not all sites work well with facets. If you have your doubts, you need to measure the use of the facets and see if they’re leading to success. However, it’s difficult to determine the success of the facets because trouble could mean either their implementation was done poorly, or that facets simply aren’t a good match for your site.

There was much more in this interview, and I invite you to tune in to get more great insight from Peter and Jared. And check back shortly for the second podcast interview for this seminar, with Mark Burrell. And don’t forget, you can still access the recording of the Leveraging Search & Discovery Patterns seminar if you haven’t yet seen it.

What challenges are you facing with search on your site?