DesignCaffeine Rotating Header Image

Design Patterns for Mobile Faceted Search: Part II

Originally Published on UXMatters.com May 3, 2010 ⇒

In Part I of “Design Patterns for Mobile Faceted Search,” I looked at the challenges and opportunities of mobile faceted search. To address the well-known challenge of limited screen real estate on mobile devices, I covered the Four Corners, Modal Overlay, Watermark, and Full-Page Refinement Options design patterns, which maximize the real estate available for search results on a mobile device. This month’s column covers strategies for making people more aware of the filtering options that are available to them, as well as methods of improving transitions between the various states a user encounters in a search user interface.
Continue reading →

Design Patterns for Mobile Faceted Search: Part I

Originally Published on UXMatters.com April 5, 2010 ⇒

In my previous Search Matters column, “Mobile Finding: Turning Limitations into Opportunity,” I discussed how mobile search user experiences differ from those on the Web. In this and my next column, I’ll look specifically at the challenges and opportunities of mobile faceted search. This column covers design patterns for maximizing the real estate available for search results, while the next will cover strategies for making people aware of filtering options.

Faceted search is extremely helpful for certain kinds of finding—particularly for ecommerce apps. Unfortunately, the designers of mobile applications do not have established user interface paradigms they can follow or abundant screen real estate for presenting facets and filters in a separate area on the left or at the top of a screen. To implement faceted search on mobile devices, we need to get creative rather than following established Web design patterns. Join me in exploring the Four Corners, Modal Overlay, Watermark, and Refinement Options design patterns for mobile devices. Following these patterns can move us one step closer to making faceted search a usable reality on mobile devices.
Continue reading →

Designing Mobile Search: Turning Limitations into Opportunities

Originally Published on UXmatters.com March 8, 2010 ⇒

Thinking of porting your Web finding experience to iPhone, Android, or Windows Mobile? Just forget about the fact that these devices are basically full-featured computers with tiny screens. Having gone through this design exercise a few times, I have realized that designing a great mobile finding experience requires a way of thinking that is quite different from our typical approach to designing search for Web or desktop applications. To put it simply, designing a mobile finding experience requires thinking in terms of turning limitations into opportunities. In this column, I’ll discuss some of the limitations of mobile platforms, as well as the opportunities they afford, and share a few design ideas that might come in handy for your own projects.
Continue reading →

Notes from Whitney’s Amazing talk “Evangelizing Yourself”

Notes from Whitney’s Amazing talk “Evangelizing Yourself” http://www.slideshare.net/whitneyhess/evangelizing-yourself-1184852

by Whitney Hess http://www.WhitneyHess.com
Continue reading →

Numeric Filters: Issues and Best Practices

Originally published on UXMatters.com February 8, 2010 ⇒

Faceted search has been around for a long time and has become the de facto standard for search on most ecommerce sites. However, filters with numeric values remain among the most confusing, because many sites have not able to design usable numeric filters that people can use in an intuitive manner. Recently, powerful user interface controls called sliders have become all the rage for specifying numeric attributes in finding user interfaces. Unfortunately, in their rush to implement this latest, greatest feature, many companies have not designed easy-to-use sliders. Rather than solving usability problems, poorly designed sliders create even more issues around numeric filter usability. In my experience, the following three usability issues surface most often with numeric filters:

  • representing discrete values for aspects as sets of ranges
  • inadvertently emphasizing overly constrained filter states
  • being parsimonious with inventory information

In this column, I’ll examine each of these issues and present the best practices that solve these problems. 
Continue reading →

Design Caffeine for Search and Browse UI

Presented at the IA Summit 2010 in Phoenix, AZ

http://uxrnd.files.wordpress.com/2009/12/ia-summit-logo.jpg

Presentation Slides on SlideShare.net ⇒

This presentation on the IA Summit 2010 website ⇒

Search and browse interfaces are some of the most visited pages on typical
e-commerce sites—to say nothing of a search engine like Google. However, few
resources focus on improving the search experience from the customer’s
perspective. I aim to fill this gap by presenting the best content from my
monthly UXMatters column, Search Matters and my upcoming book, “Design Caffeine
for Search and Browse: Practical Strategies for Creating the Ultimate
e-Commerce Finding Experience on the Web and iPhone”:

1) Optimizing images, content, and actions in search UI
2) The best ways to approach no search results conditions
3) Understanding the value of a good layout and how to calculate the right
vertical spacing for your site
4) How to design aspects and filters with judicious use of Ajax
5) Understanding the differences between iPhone and Web search
6) How to create dynamic landing pages, brand catalogs and category pages
7) Best practices and common pitfalls of search and browse user interface
design

This is a straight-forward, practical talk about search and browse UI design,
so there will be lots of before-and-after picture slides (and very few bullet
points). After each section of slides (about every 10 minutes) I will pause
and have a short 5 minute Q&A segment to address specific design questions and
take questions from the audience.

Experience Design for a Viral Mobile Community

Presented at the Net Squared Conference May 2009, in San Jose, CA

See the presentation on Slideshare ⇒

ThirstyPocket used iPhone application design to foster social change by creating a platform for viral neighborhood commerce, which brings people together and encourages community interaction.  We will demonstrate buying and selling flows and discuss specific user experience design strategies and insights that were used to improve upon existing e-commerce offerings.

How to set up and run participatory design sessions, analyze data and present results effectively

Presented April 2008 at the IA Summit 2008

See the presentation at the IA Summit 2008 (Opens in a New Window)

Download the presentation proposal in PDF (3 MB)
See the presentation page on the IA Summit 2008 Website ⇒

This workshop will provide user experience professionals with practical guidance on how to successfully set up and run participatory design sessions, analyze data and present results effectively to project stake-holders. Lab set-up with a range of budgets, appropriate methodologies like PICTIVE, group and individual design sessions will be discussed. After attending the course, attendees should be able to:

  1. Set up and run a successful participatory design session.
  2. Determine the right methods and tools to fit specific projects.
  3. Analyze and interpret participatory design session data.
  4. Create an effective presentation and deliver clear recommendations to project stakeholders.
  5. Understand how participatory design can fit into your company’s user-centered research and design strategy.

US Patent #6677343: Substituted Piperazine Compounds

Novel compounds of the general formula: ##STR1## and pharmaceutically acceptable acid addition salts thereof, wherein the compounds are useful in therapy to protect skeletal muscles against damage resulting from trauma or to protect skeletal muscles subsequent to muscle or systemic diseases such as intermittent claudication, to treat shock conditions, to preserve donor tissue and organs used in transplants, in the treatment of cardiovascular diseases including atrial and ventricular arrhythmias, Prinzmetal’s (variant) angina, stable angina, and exercise induced angina, congestive heart disease, and myocardial infarction.

Granted by the US Patent Office February 22, 2001 ⇒

US Patent #6180615: Propargyl Phenyl Ether A2A Receptor Agonists

2-adenosine propargyl phenyl ether compositions having the following formula: ##STR1## and methods for using the compositions as A.sub.2A receptor agonists to stimulate mammalian coronary vasodilatation for therapeutic purposes and for purposes of imaging the heart.

Granted by the US Patent Office June 22, 1999 ⇒

US Patent #6677336: Substituted Piperazine Compounds

Novel compounds of the general formula: ##STR1## and pharmaceutically acceptable acid addition salts thereof, wherein the compounds are useful in therapy to protect skeletal muscles against damage resulting from trauma or to protect skeletal muscles subsequent to muscle or systemic diseases such as intermittent claudication, to treat shock conditions, to preserve donor tissue and organs used in transplants, in the treatment of cardiovascular diseases including atrial and ventricular arrhythmias, Prinzmetal’s (variant) angina, stable angina, and exercise induced angina, congestive heart disease, and myocardial infarction.

Granted by the US Patent Office February 22, 2001 ⇒

More Like This: A Design Pattern

Originally Published on UXMatters.com January 4, 2010 ⇒

In my last installment of Search Matters, “Cameras, Music, and Mattresses: Designing Query Disambiguation Solutions for the Real World,” I presented several design strategies for query disambiguation.

Unfortunately, most sites do not make sufficient use of this pattern and some that do use it design and implement it incorrectly.

Show Me More

The idea behind the More Like This pattern is very simple: within each group of items representing a particular category from a catalog or accompanying each item in search results, provide a prominent link or button with a label that is some variation of More Like This ». Of course, the devil, as they say, is in the details. Continue reading →

Cameras, Music, and Mattresses: Designing Query Disambiguation Solutions for the Real World

Originally published on UXMatters.com December 7, 2009 ⇒

Our language is limited and imperfect. Typically, people type search queries quickly and with little forethought, so queries are definitely less than perfect. When a customer constructs a query that may have more than one meaning, a good search user interface provides tools to help the customer define the query in less ambiguous terms, so the search results more closely match the person’s intention. This process is known as disambiguation, and best practices for effectively supporting the disambiguation of search queries are the subject of this column.

Recently, I came across a new search engine—which shall remain nameless—that promised a combined search and browse approach to finding products. I was curious, so I put this new search application through its paces by typing the query Canon. In addition to results for cameras, the search engine displayed results including the company’s profile for investors, Pachebel’s Canon—a form of music—and, to my great surprise, a Canon mattress and a Canon ottoman, which the products section featured prominently. Continue reading →

Make More Money: Best Practices for Ads in Search Results: Part 2

Co-written with Frank Guo ⇒
Originally published on UXMatters.com November 2, 2009 ⇒

In this installment of Search Matters, we’ll continue our discussion of ads in search results. If you missed it, read Part 1, which covered these best practices:

  • Integrate your ads’ appearance with the rest of your site.
  • Make sure customers can easily distinguish ads from content.
  • Keep ads relevant and appropriate.
  • Understand how your customers interact with ads.

In Part 2, we’ll discuss the following best practices:

  • Understand what makes a good ad.
  • Limit cannibalization.
  • Provide ads for internal merchandise instead of third-party advertising.
  • Pay special attention to ads on pages that appear if there are no search results.

Let’s dig in! Continue reading →

Make More Money: Best Practices for Ads in Search Results: Part 1

Co-written with Frank Guo ⇒
Originally published on UXMatters.com October 5, 2009 ⇒

Conflicting demands make many UX professionals think of ads as a necessary evil. Customers frequently go out of their way to say they hate ads, while marketers always seem to try their hardest to stuff as many of them as they can on each search results page on your site. This leaves many UX design professionals caught in the middle, trying to balance the ad equation—and frequently failing to fully satisfy either customers or marketers. For this 2-part column, I’ve teamed up with advertisement and eyetracking research guru Frank Guo to present real-world strategies for successfully integrating ads into your search results. The goal is making money without unduly turning off your customers. Continue reading →

Best Practices for Designing Faceted Search Filters

Originally published on UXMatters.com on September 7, 2009 ⇒

Recently, Office Depot redesigned their search user interface, adding attribute-based filtering and creating a more dynamic, interactive user experience. Unfortunately, Office Depot’s interaction design misses some key points, making their new search user interface less usable and, therefore, less effective. That’s the bad news. The good news is that the Office Depot site presents us with an excellent case study for demonstrating some of the important best practices for designing filters for faceted search results, as follows:

  1. Decide on your filter value-selection paradigm—either drill-down or parallel selection.
  2. Provide an obvious and consistent way to undo filter selection.
  3. Always make all filters easily available.
  4. At every step in the search workflow, display only filter values that correspond to the available items, or inventory.
  5. Provide filter values that encompass all items, or the complete inventory.

By following the attribute-based filtering design best practices this article describes, you can ensure your customers can take care of business without having to spend time struggling with your search user interface. Continue reading →

Brave New World of Visual Browsing

Co-written with Ahmed Riaz ⇒
Originally published on UXMatters.com August 3, 2009 ⇒

When the Web began, pages were mostly text, but today, everywhere we look, it seems like image content is taking over the Web. The ubiquitous use of digital cameras and improvements in the picture quality of mobile phone cameras has likely helped this phenomenon along. The shift toward content that is primarily visual introduces new challenges and opportunities for developing intuitive and powerful user interfaces for browsing, searching, and filtering visual content. To help me cover this important topic, I’ve asked Ahmed Riaz—Interaction Designer at eBay and physical interaction design enthusiast—to contribute his insights and ideas. Continue reading →

The Mystery of Filtering by Sorting

Originally published on UXMatters.com July 6, 2009 ⇒

What is the difference between filtering and sorting for a search query? Any SQL developer would be happy to tell you that a sort translates to a SQL ORDER BY statement, while a SQL WHERE clause performs a filter. However, for most users of consumer-facing ecommerce applications, the difference between a sort and a filter presents a mystery they understand dimly, if at all. The distinction between sorting and filtering blurs, because of a phenomenon I’ve called filtering by sorting, which leads to all sorts of interesting search user interface implications. Continue reading →

Search Results Satori: Balancing Pogosticking and Page Relevance

Originally published on UXMatters.com June 8, 2009 ⇒

When designing the data and layout for search results pages, the design strategy boils down to a single key principle: show the greatest number of results possible, without increasing pogosticking. In other words, the challenge is finding the right balance between

  1. providing enough information in individual search results, so customers can make informed decisions about whether to view product detail pages—that is, click product links
  2. providing enough relevant search results on each page of results to warrant further exploration of the site

On the one hand, if your search results do not provide enough summary product information, you’ll force your customers to jump to individual product detail pages, then repeatedly back and forth between product detail and search results pages, like a child bouncing on a pogo stick. On the other hand, if you do not provide enough search results on each page of results, customers may not find relevant results, so may leave your site. As we will see presently, the tension between these two opposing design forces is what makes the problem of creating search user interfaces so interesting. Continue reading →

Making $10,000 a Pixel: Optimizing Thumbnail Images in Search Results

Originally published on UXMatters.com May 11, 2009 ⇒

In search results, the old adage a picture is worth a thousand words rings true. When it comes to making your search results more efficient to use, more relevant, and more attractive, images reign supreme. There is simply nothing else on your search results pages that can come close to offering the same potential as thumbnail images for dramatically increasing your conversion rates and revenues.

While your Web site’s image requirements are likely unique, there are some common pitfalls you might encounter in using images in your search results. The good news is that you can easily avoid most of these mistakes with awareness and a little foresight. Continue reading →

Searching Help: Don’t Even Go There

Co-written with Tricia Clement of jUXtworks.com ⇒
Originally published on UXMatters.com Published: April 13, 2009 ⇒

Web site user assistance that consistently exceeds customer’s expectations can catapult your company to legendary status and create brand equity you can measure in billions of dollars. However, making Help a strategic asset for your company is an arduous task. To shed light on this important topic, I have teamed up with Tricia Clement, a renowned cognitive psychologist and Web site user assistance expert. In this month’s Search Matters column, we’ll deliver actionable insights about Web site user assistance. Continue reading →

Choosing the Right Search Results Page Layout: Make the Most of Your Width

Originally published on UXMatters.com March 9, 2009 »

Page layout forms the foundation in presenting search results. Your layout decisions for search results pages will have tremendous impact on the user experience for your entire site. Choosing the right width for search results is important, and the optimal width for search results may be a great deal narrower than some people using big monitors would believe.

To see for yourself the narrow divide between great and barely usable search results layouts, take a look at Figure 1, which shows the primary gateway to the Starbucks shopping area. When it comes to page layout, this Starbucks search results page shows very poor design choices. At a screen resolution of 800 x 600 pixels, most of what you see is the left margin of the layout and a large logo. Continue reading →

Do Any Corporate Cultures Truly Embrace UX?

People often ask me if there are companies “out there” that truly embrace UX.  In my experience, not one company I ever worked at was truly customer-centric.  While some companies might say they are in their mission statement and even hire lots of designers/UX people, companies are only truly committed to one single thing: making money for their shareholders.  (Many years ago I read a great Kurt Vonnegut quote to this effect but I can no longer find it.) Fortunately, the one modern finding that came out of the entire UX movement, is that focusing on your customer is the surest, most direct way for any company to make lots of money.  As I explained in my article Experience Partners: Giving Center Stage to Customer Delightany company that has not yet realized the making the customer successful is the key to profit and survival is either delusional or on its way out of businessContinue reading →

Starting from Zero: Winning Strategies for No Search Results Pages

Originally published on UXMatters.com February 9, 2009 »

Search results pages are some of the most visited pages on typical e-commerce sites—to say nothing of a search engine like Google. Many articles appear each year about optimal search algorithms, database performance, and the like. In contrast, very few publications focus on improving the search experience from the customer’s perspective. My new Search Matters column aims to fill this gap by focusing on:

  • best practices of search user interface (UI) design
  • design patterns and strategies for improved search user interfaces
  • common search UI pitfalls
  • how to use search to provide maximum value to customers and your business
  • practical search UI matters that have strategic impact on your customers’ Web site experience

Continue reading →

Experience Partners: Giving Center Stage to Customer Delight

This article was originally published on UXMatters.com April 12, 2008 »

Today, the design industry is at the threshold of a new epoch—a point of theoretically limitlessness potential for expansion. We must decide just how, going forward, we will relate to the people who use our designs—as people who are “busy and eager to get on with it” yet “alert and caring” or, much less constructively, as people who are merely “simple-minded and stupid.” Therefore, I want to propose the concept of experience partners as a whole new way of thinking about our customers as partners in holistic product experiences. We need new terminology to describe this concept, because the term users limits us to old ways of thinking about the world we live in and the products we develop. The term experience partners reflects an emerging paradigm shift from a focus on product features to instead conceptualizing holistic product experiences and embodies our best understanding of how to design products that create delight and become integral, harmonious parts of people’s lives. Continue reading →

Designed Ketera’s B2B Social Network for Mid-Market Sourcing and Invoicing

Ketera Final DesignClient: Ketera Technologies »

Product: Ketera Network, Sourcing, Invoicing & Procurement

Problem: Ketera needed to leverage their enterprise apps to create a friendly place for their 150,000 mid-market suppliers and buyers.

Solution: Designed a new B2B Social network of over 130 wireframes from the ground up, while heavily leveraging the existing enterprise application functionality.   Devised a flexible app framework that allowed Ketera to “plug-in” apps from their enterprise application suite.

Services: vision & strategy, storyboarding, concept sketching, wireframes, site maps, IA, workflows.

Designed Lobby and Profile for Grockit On-line Collaborative Learning

Grockit Final DesignClient: Grockit.com »

Product: Grockit On-line Collaborative Learning Web App

Problem: Grockit needed to expose their collaborative learning functionality and quickly convey the main value proposition to new visitors.

Solution: Devised a key mission-critical innovation: the new mode of educational play consisting of “study rooms”. Designed IA, lobby, game scheduling and member profile page to reflect the dynamic collaborative and social networking nature of the site.

Services: vision & strategy, storyboarding, concept sketching, wireframing, site map, IA, workflows.

Designed Thirsty Pocket iPhone App

Thirsty Pocket Final DesignClient: Thirsty Pocket Labs »

Product: Thirsty Pocket iPhone Neighborhood e-Commerce App

Problem: Thirsty Pocket needed a compelling, intuitive selling flow and GPS-based local finding UI that was easy to use.

Solution: Designed the entire application from the ground up. Deliver the “fastest and easiest selling flow anywhere, on any device” using a built-in iPhone camera.  Use GPS and the iPhone’s multi-touch features to replicate a simple, compelling shopping experience of a neighborhood garage sale.

Services: vision & strategy, storyboarding, concept sketching, wireframing, site map, workflows.

Helped design eBay’s Social Network, My World

eBay My World Final DesignClient: eBay.com

Product: My World – eBay’s Social Network

Problem: eBay is the world’s largest e-commerce social network, yet members had no way to showcase their profile or participate in social networking activities outside commerce.

Solution: Partner with eBay members to understand their social networking goals and what kind of social networking features they might find compelling.

Services: participatory design, personas, roles, vision & strategy, concept sketching, wireframing.

Designed Holistic Vehicle Selling Flow for eBay Motors

eBay Motors Selling Flow Final DesignClient: eBay Motors

Product: Sell Your Vehicle Workflow

Problem: eBay Motors wanted to improve conversion and decrease drop off during the vehicle selling flow.

Solution: Conduct field studies to understand existing vehicle selling issues. Approach the design problem holistically, considering both on- and off-line tasks. Redesign the product from the ground-up while keeping within limited project scope.

Services: field studies, vision storyboarding, concept sketching, wireframing.