Things I Learned From a Box: Packaging Design Principles for Interactive Design (Part 2)
by Andrea NelsonWednesday, March 18th, 2009
Yesterday, we discussed the key elements of packaging design, including messaging, presentation, structure, and brand artifacts. Using our “Oil of Olay” package as a case study, we highlighted the consequences of the “barrier to entry” that is created when packaging fails. Today, we’ll discuss how the design guidelines for packaging design apply to the practice of interaction design using another case study.
First and foremost, think about your web site as your “packaging,” and design accordingly—do not create a barrier to entry that separates customers from their end goal and hinders conversion.
When we reconsider the previously discussed factors of packaging design in this context, they align nicely with some familiar elements and ideas of good usability. We’ll review our packaging design principles in a new context below. As a case study, we’ll use the Rich and Skinny brand jeans site (http://www.richandskinnyjeans.com/RichAndSkinny/).
Design Principles, Revisited:
1. Messaging: The messaging component of our “packaging” isn’t that different between the aspects of physical objects and designing for interaction online and beyond. The key difference, however, is that there is often more to say—and it’s easy to fall into a trap of veritable content-overload. The most effective sites often present one singular, captivating message. As a design guideline, I often ask myself, “What is this page saying?” And if the answer is, “Too much,” I reconsider the purpose and focus of the page and its message.
Case Study: On first look at the home page of Rich and Skinny Jeans, all of the components on the home page combine to deliver a successful and compelling brand message. The message of Rich and Skinny goes beyond simply selling jeans. They’re selling their lifestyle, and that message is clear, fun—and inviting.
2. Presentation: Previously, I described presentation as the way in which messaging and content are formatted, stylized, and presented. When we consider an interactive experience, presentation becomes critical: going beyond visual design, successful information design presents new challenges. Designers should consider how the information hierarchy affects page scanning and overall readability to ensure that the message being presented is clearly communicated. The use of intuitive user interface elements will ensure that intended interactive behaviors can be easily anticipated and deliver the expected results.
Case Study: Rich and Skinny excels in delivering a completely immersive experience. The use of video and sound throughout the site, especially on the “catwalk” of the category page, reproduces the nuances of a personal, in-store shopping experience. All the elements combine to put the customer into the site, delivering presentation that goes beyond mere passive viewing.
3. Structure: In our packaging discussion, we defined structure as the framework that supports and organizes the messaging and presentation. In our online world, structure speaks to the underlying site architecture and navigational systems that support site content and facilitate intuitive movement from one area of the site to the next.
Case Study: What’s great about Rich and Skinny is the navigational system. While the site architecture itself is fairly simple, the metaphorical system of the navigation continues to tell the story of the Rich and Skinny lifestyle. Customers select models in a dressing room, or “enter” rooms of the R&S house to delve deeper into the brand.
4. Brand Artifacts: A product’s packaging may itself be a brand artifact, an object that is in itself compelling enough to notice, preserve, and collect—how many readers have saved your various iPod boxes? An interactive experience may provide tangible brand artifacts—a desktop wallpaper for downloading, a song of the week—or intangible ones, such as the lasting impression of the overall brand experience that causes you to return to the site or share the link with a friend. And these intangible effects are the most intriguing. As we design, we must actively think about the opportunity to create branded artifacts as we ask ourselves, what is the lasting effect that our customers take with them from this experience?
Case Study: The overall experience across the Rich and Skinny site creates a lasting impression that the customer takes with them after they leave. The story of the brand is so vivid and the shopping experience itself is so much fun that traditional ecommerce sites feel slightly disappointing after spending time on Rich and Skinny. R&S does carry its presence onto Facebook and Myspace (as additional artifacts), but it is the brand impression on the site itself that carries the most impact as an artifact of the experience.
We have reviewed several principles of packaging design and applied them to the practice of interactive design. It’s a slightly different approach to thinking about how we approach the design of a page, a web site, or an application. But, as we endeavor to think critically, we must move between physical space and virtual space in our design thinking. And in doing so, we utilize design principles that are essential to successful communication in any context or media.
