When we think about great real world shopping experiences, there is a common theme to every flagship store and back alley pop-up shop: excellent product presentation. In the offline world, it’s guaranteed that there will be a real live product to pick up, inspect and share. You need only watch shoppers in a average apparel store to see how picking up an item, holding it up and glancing in the mirror creates an emotional attachment.

This simple act is so basic in the offline world that it’s too easy to overlook when envisioning the online experience. While best practices dictate things like the Add to Cart button being above the fold and intuitive search and browse functionality, it’s important not to lose sight of the basics:

Outstanding product presentation is a ticket to the game. Without it, consumers are may look elsewhere for this emotional attachment.

Scene 7 was kind enough to validate this philosophy in their recent “What Shoppers Want” survey. The Cliff’s Notes version is this:  shoppers want rich, vivid product imagery and the ability to browse views and colors and zoom in with simple mouse over actions. Clicking is too much work.  They want to “go big” and inspect every last detail of the product with minimal effort,  just as they would in the offline world.

At Fluid, we designed Fluid Experience from the ground up to produce rich, easy-to-use product displays that are unparalleled in the e-commerce landscape. Almost as important, we made them incredibly simple to build and change so you can experiment and find out what delights your customers.

In the spirit of going big, we took a few minutes to put together a demo that does just that. Simple mouse movements change views and expose zoom. Plus you can click View Larger for even greater detail and zoom. We think you’ll agree that it’s difficult to go back to just an average product image.

Craftsman Custom delivers a premium experience for consumers to tailor a pro-quality tool storage solution to their specific needs and tastes. The experience leverages 3d visualization to deliver a blueprint-like experience that progressively builds into a photo-realistic vision of the consumer’s ideal product, all in real time.

The Sears Garage Planner experience is built on inspirations and “starting point” ideas. Consumers are presented with an interactive photo gallery of shoppable and customizable garage storage solutions. The experience is simultaneously inspirational and actionable, injecting the consumer with ideas and empowering them to make them their own.

Our team has a long history designing shopping experiences for customizable products, including …

• FunStamps (the first personalizable stamps offering)
• Timberland Boot Studio (custom footwear)
• Your Reebok (custom footwear) + facebook configurator
• Design Within Reach FLOR Designer (custom carpet configurator)
• Fine Stationery (card & stationery customizer)
• Vans Customs (custom footwear)

We’re fortunate to collaborate with such great brands to innovate new shopping experiences in such a nascent field. We’re proud to be among the first who have created configurators delivering consumers real-time visualization, product rotation, share-to-phone and integrated social sharing tools.

The business benefits of a better customization experience: 200%+ increase in sales, 16+ minute average consumer engagement on-site, spikes in sharing & heavy engagement with social media customization tools.

Some recent observations, field notes, and expectations looking forward:

• Before the “economic downturn” (or whatever it’s called now), Fluid was seeing RFPs for customization up approx 5-10x showing a sharp increase in interest across industries. The recession put most of those projects on hold.

• Those brands that continued forward became increasingly strategic around customization, seeing it as a brand and business building opportunity. In many cases increasing scope and decreasing timelines in an effort to get to market quickly with robust offerings (a differentiation/barrier strategy).

• Interestingly, over half of these brands are in verticals outside of footwear.

• Embedding up-sells in the customization experience has proven so effective that some retailers are pricing base models at-or-under cost and attaching costs per attribute selection (e.g. premium colors, extra set of laces, etc.).

• Providing the consumer with simple, intuitive social tools — both providing the ability to chat real-time with friends & ability to engage one’s facebook network without ever leaving the customization experience — has become a priority among most of our clients (and now considered a best practice within Fluid).

Finally, three predictions:

1. Customization experiences will take shape in ways that are more subtle and less overt – more about great digital shopping and less about “configurators” per se. This is what most consumers want. Thoughtful experiences that embed customization vs. customization being the main draw will help launch this consumer-driven approach to digital shopping into the mainstream.
2. Customization will make the notion of a crowd-sourced economy a reality. Champion and Keds are first movers (and got a lot of brand benefit as a result + some satisfaction at beating Nike to market I’m sure
3. Customizable shopping experiences will increasingly be deployed exclusively to social channels like facebook. Customizing something lends itself superbly to a community atmosphere – expect to see brands fully leveraging all that facebook has to offer in that regard.

My initial goal was to research and write a blog on sneakers, the sneaker culture, and what drives a ‘sneakerhead’ to seek the most limited/hard to get/wait-in-line-for-2 days type sneakers. But as I set out on my task to contribute to the Fluid blog, I stumbled onto the site miadidas.com. I say ‘stumbled’ because I have not heard or seen much about this site. I knew about NikeID, YourReebok(formerly known as RBKCustom), and the newly updated Vans Custom site among others, but was surprised and somewhat disappointed about just discovering the custom site for Adidas shoes. I’ve seen the in-store experience at the Adidas store in San Francisco, but was not aware it was migrated to the web – or at least a version of it.

With that said, I decided to focus my attention to the site and give my personal review.

OVERVIEW

“In 2008, adidas Originals successfully introduced its in-store customization tool, mi Originals.  Now, mi Originals is taking steps to broaden its product offering for the streetwear community with the US launch of miadidas.com.”

The site launched in February 2009 with the Superstar, ZX 700, Stan Smith, and Gazelle. Since then it has added the Stan Smith CF and Forum Lo to the Originals line along with a ‘Sport’ line which offers 13 different types of models catering to Basketball, Soccer, Running or Tennis. Prices range from $95(Gazelle) to $240(Predator Power Serve – soccer shoe), which is about 20% or so above the retail price of its inline version.

HOMEPAGE

The home page displays three models for each line – Originals and Sports – located at the bottom of the page. Clicking on any of the shoes brings up a nice hero shot and some quick blurb of its history (Originals) or quote by an ‘athlete’ (Sports). There is navigation at the top which filters the products either by Gender (Men / Women) or Line (Sports / Originals) or by All Products. There are also links to Help, an E-newsletter, a Store Finder (which I wasn’t sure why since this is about making/buying custom shoes and not inline) as well as a My Account page.

Still on the homepage, I did notice some inconsistency with how you were able to start customizing. If you click on any of the ‘Sport’ shoes, the hero shot includes a link to start customizing, but the hero shots of the Originals do not include this link.*

*Update – This has now changed from my initial review. There are now links to ‘Start Customizing’ for both Sports and Original.

If you decide to see all products, you will be taken to another page that has Sport and Originals separated into two columns populated with various shoe inspirations – about two or so for each model. A ‘Details’ link beside each custom shoe will take you to a page specifically for that model providing description, three different shoe views, and additional inspirations for that particular shoe.

At this point, I was ready to start customizing. I simply clicked on the ‘Customize’ button which is visible at various areas on the page. I decided to go with the Superstar II for various reasons – nostalgia, love for the ‘shell-toe’, love for RunDMC, or love for the 80s – not sure, but I digress.

GETTING STARTED

The main customization area is one screen separated into three vertical sections. The left side is split into four panes – Side, Top, Bottom and Personalize. The middle section is the information or selection area. This is where you select your size, gender, colors and materials for the different parts of the shoe. The right side has an image of the shoe being customized which updates as various selections are made. The shoe is a 3D model image powered by Holomatix Blaze3D, or so it says when I right-click on that area.

You are able to rotate the shoe 360 degrees by dragging your mouse in a specific direction. There are also links at the bottom which allow you to change Background (white or black), change views (Top, Bottom, or Side) and Zoom (you can rotate while in Zoom mode which is pretty cool).

Once you’ve selected your size/gender, the left panel becomes ‘available’. It starts grayed out until you select size/gender. Before I dive in, I want to spend a few moments to talk about the Size selection. You are asked to select a Gender, Size as well as Width. With the Originals, the Width is usually always ‘Medium’. With the Sport shoes, you are able to choose a specific size and width settings (Narrow, Medium and Wide) for both the left and right foot. As the site says:

“Every foot is different. Even your own two feet are not alike. So instead of making your feet fit into some average shoes, why not make the shoes fit your feet?”

Believe it or not, there are some people that have this need. Both the left and right foot can finally be happy together.

Brilliant.

CUSTOMIZING

So back to my Superstar customizing – I start with the ‘Side’ which opens up another panel with various side images of the shoe, each image having a certain piece highlighted to represent what will be customized. I’m asked if I would like perforation on the shoe or a print. But ‘print color is not available if you select no print or perforation’. This type of messaging is everywhere to the point of annoying confusion. I decide to go with the ‘classic trefoil’ as my print and proceed to select a print color before I am presented with another error message.

“The combination of print (color bloom) and lateral rear quarter (color bloom) is not allowed. Please change on the above options and try again.”

So if I wanted to have my print to be the ‘color bloom’ I would need to go to the next step and change the color of the ‘lateral rear quarter’ to something other than bloom. And if I decide to change the lateral rear quarter material from leather to suede, I get another message telling me I have attempted something that is not allowed. I think this would have been better represented in one main pane giving the user the visibility as to what is/is not available based on their selections. If I select a print, I see that only certain colors/materials become available. I totally understand the need for rules surrounding colors/materials/patters but I think it could have been better presented to the user. And if it wasn’t for the visual, would the average person really know what a lateral rear quarter was?

I continue through the rest of the shoe – Top and Bottom – encountering the same ‘messages’ as I continue to customize my work of art. I keep on pushing forward not letting the bombardment of ‘try again’ messages deter me from completing my masterpiece.

PERSONALIZE

Now that I am pretty much satisfied with my color/material layout, it’s time to personalize. The Personalize area allows you to select a lace jewel and/or personalize your shoe with embroidery. The lace jewel gives you two options: birth date of your shoe or trefoil. The birth date is a pretty cool idea especially if the date is significant in some manner.

Adding text personalization to the shoe is pretty standard and has the same type of ‘profanity check’ present on similar sites. Although, in Seth Rogan fashion (see Tonight Show appearance late 2008), I was able to find some phrases/words that did not make the cut. Insert evil laugh here.

The Personalize area differs based on shoe. For example, the Stan Smith CF allows you to personalize the top and middle strap of the shoe. You can also add a ‘city print’ to the shoe (i.e. “I ‘trefoil’ Amsterdam”) with about 14 cities on the list – sadly no San Francisco.

The TS Bounce Commander (basketball shoe) even allows you to have a player quote and autograph on the underside of its lace cover. The athletes are obviously limited to those sponsored by Adidas, but very cool nonetheless. There are more cool personalization options based on shoe that I will not detail out here, but definitely good to see Adidas expanding this area of customization.

SAVE / SHARE

If you aren’t ready to purchase, you can Save your work to your ‘My Account’ page. You’ll be prompted to sign in(if you aren’t already) or register for an account to save your shoe in progress.

My Account list is almost a closet of sorts, displaying all the shoes you’ve saved.  It’s a very clean, but plain interface.  From this page, you can Add to Cart, Edit, and Send to a Friend among others.

The Share functionality is pretty limited. With Twitter, Facebook, MySpace, and Digg encompassing the social universe, none of these options were available. What makes it even more amusing is the fact that there is a miadidas Twitter page (@miadidas), but no way to access it from the actual site. The only Share option was via email, which works well. But there are times when I need to show my masterpiece to the world and get the thumbs up of approval. I would have thought a few ‘Share to Social Sites’ option would be available.

ADD TO CART / CHECKOUT

Pretty standard stuff here. You are presented with an image of the shoe you just customized along with the option to update/remove quantity, save to your account or re-edit by clicking on the shoe name.

Shipping is a flat rate of $12 regardless of how much you have in your cart with delivery estimate of about 3-4 weeks which is on par with other site.

SUMMARY

All in all, Adidas’ entry into the online customization world has gotten to an ok start. I could definitely see some improvements in the user follow as it relates to rules with colors/materials as well as addressing some of the consistency issues. But for the most part, the experience was good. But I’m not sure if most of the ‘good’ is based on the fact that I love Adidas originals and having the opportunity to customize them is pretty sweet.

I would love for them to expand the ‘Share’ feature considering how popular social sites are. They could start by tying in their Twitter page with the actual site.

I did like the use of 3D, which gives more flexibility when it comes to rotating and zooming. The personalization options were a definite plus along with the number of shoes available. They just didn’t go with their most popular lifestyle/sport shoes, but also offered sport focused shoes such as soccer cleats. I’ll definitely be getting the word out and will definitely be back to see what other creation I can conjure up and call my own or as RunDMC said, “My Adidas…”, or in this case mi adidas.

Pros

• Size/Width selection for both left and right shoe
• Shoe rotation and zoom capabilities
• Use of 3D modeling
• Personalization options
• Number of shoes available
• Pattern/material options
• Flat shipping rate

Cons

• User flow / shoe placement inconsistencies
• Presentation of rules for colors and materials
• Blank shoe can be easily accessed for Sport line but not Originals. Need to click ‘Start Over’ before presented with blank shoe option.* This has since changed.
• Sharing limited to Email only

References

——————

www.miadidas.com

http://www.press.adidas.com/DesktopDefault.aspx/tabid-4/79_read-10186/

• My son moused-over every single option for every single product part (not kdding…he methodically moused over every option). This was only possible because Fluid Configure uses client-side technology (Adobe Flex in this case) to do the image previewing, meaning you don’t need a round trip to the server to generate the image.  Using server-side imaging technology this could take an hour or more.
• My 3 year old son asked, “Can we turn it over?” Specifically, even as an observer to the process he wanted to view the product from multiple perspectives. While Vans doesn’t feature the incredible rotation of Your Reebok, but it does show the product from multiple views with great responsiveness.

Overall it was gratifying to see them  quickly grasp the experience, move through the configuration process and take great pleasure from the emails and SMS’s they were able to send letting their family know about the shoes they had just designed. If only the design of their shoes could have been so positive.

The Vans work builds on many of our learnings of the past years:

• Designing a custom product is stressful. One of the biggest impediments to custom product sales has been the inability to get immediate validation on a design in real time. In the Vans configurator a shopper can send a link to a friend via instant messenger (or email). When the user clicks the link they’ll be brought into a collaborative shopping session where they can share design ideas and give feedback in real time. We believe this will not only increase sales but bring new shoppers to the Vans site.
• Product configuration is an iterative undertaking. We’re providing users a simple “Scratchpad” where they can save their designs in progress for easy reference without logging in. With the scratchpad users can save a design with a single click and return to a previous design just as quickly.
• All of this functionality is part of the Fluid Retail product suite, utilizing both Fluid Configure and Fluid Social. This means we’ll be able to deploy the technology faster and more cost effectively for future customers looking to create similar collaborative shopping experiences.

We couldn’t be more excited to share this client work with you…keep your eyes peeled for future deployments of Fluid Social collaborative shopping deployed in support of collaborative shopping for traditional, mainline products.

Recently, Adobe asked Fluid to share our approach of rapid prototyping with the Adobe Fireworks and Adobe Dreamweaver developer’s community and we were both honored and excited to do so.

Our in depth article, “Rapid interactive prototyping with HTML, CSS, and JavaScript using Fireworks and Dreamweaver CS4″, can be found on Adobe’s website here:

http://www.adobe.com/devnet/fireworks/articles/rapid_interactive_prototyping.html

Mass Customization and Manufacture-on-Demand

Customized products are the ultimate in personalization: customers can select from many options for many attributes to create a product that is unique. This level of customization is made possible my manufacture-on-demand processes. Finished products are not stored in inventory to be picked, packed, and shipped – they are actually manufactured when the order is received.

A potential hazard of customization is that it creates more choice, possibly too much choice, for the consumer. Much has been studied and written about the paradox of choice and decision paralysis, but it boils to situations where there are so many options from which to choose that the consumer is overwhelmed, and it is actually easier to make no choice (and abort the purchase) than to make any choice. When customers are presented with many customizable components, each with many configurable options, the number of combinations may be overwhelming. Therefore we need to design customer experiences that help customers get started, make decisions, support their choices, and encourage them to proceed and complete the process.

One way we can craft more inviting experiences is to manage the number of choices people are given and how they are presented. A manufacture-on-demand process does not need to be transparent to the customer – they do not need to know when products are stocked in inventory versus made when an order is placed.

At the discreet end of the continuum, customers never even know that they are ordering a custom product, because the merchant has pre-defined all of the options and choices (e.g., notebook color, binding, and cover image) and presents the product as a ready-made item. Even though the customer makes no choices beyond selecting a quantity, when the order is placed that product is manufactured.

At the limited level of the customization continuum, consumers realize that they are ordering a customized product, but they may not realize the extent to which that product may actually be customized, because the merchant has pre-defined some some of the options (e.g., ink color and envelope interior pattern) but left a few for the customer to specify (e.g., text on the notecard and the font.) The product is still manufactured when the order is placed, but the number of choices has been controlled to make the personalization process simpler and faster.

Finally, at the level of full customization, consumers realize they are are ordering a customized product, and they understand that it will be manufactured just for them when the order is placed. (Curiously, some customers still think that all variations on custom products have been manufactured in advance and stored in a warehouse awaiting selection and shipment when an order is placed, because they may not fully realize the number of combinations possible and that it would not be feasible to make every possible version of a product.) The choices and options are numerous, and the messaging about the product and customization service typically makes it clear that a product is being made just for the consumer according to their specifications.

There are web sites already offering mass customization of products, and we are likely to see more and more as the ability to manufacture-on-demand becomes more widespread. Today, manufacturing-on-demand is often limited to a base set of products (e.g., photo mugs and mousepads) to which a custom pattern, color, or text may be applied, or to products that have manufacturing processes that lend themselves more easily to mass customization (e.g., custom shoes.)

Cafe Press and Zazzle both offer a set of base products from which to begin. Customers then add their own personal touches and select from a few options to create products that are uniquely their own and which are manufactured-on-demand.

Reebok offers full-customization of shoes, and consumers have the ability to design their own shoe selecting from so many choices that there are literally trillions of possible combinations. A unique product is actually possible, and there is no way that Reebok could manufacture and stock all possible variations of the shoes – this is made possible only my manufacture-on-demand processes.

The manufacture-on-demand process and the ability to create custom products also quickly and easily opens up the opportunity for online, digital equivalent of “pop-up stores.” Pop-up stores are temporary physical retail stores that open for a short time in a previously empty location, generate buzz and attention, respond to a trend or community need, sell for a limited time, then close and disappear. Companies that have the ability to manufacture-on-demand could respond quickly to current trends, fads, and styles by pre-defining products, opening a temporary web site, and selling those products either under their brand or as an ephemeral brand. They could offer limited edition products, different products for different geographics regions, or even products that are offered only to existing customers. Once the ephemeral brand has run its course, the web site disappears.

Custom products are more than just choice for the consumer, they are also opportunities for the companies that are able to manufacture-on-demand, who want to differentiate their product offering, and who are able to quickly and nimbly respond to styles, fads, and market trends.

These packages range from $25,000 – $45,000 and are designed to let our clients tap into our expertise in ecommerce customer experience without breaking the bank.

The four initial offerings include:

• A high level expert review of your online store, delivering a prioritized list of areas for immediate improvement including key dropout points in the conversion cycle.
• Targeted analysis of your product detail page and identification of key areas for improvement. Final deliverables include analysis of current page, redesigned schematics and a few visual design directions.
• Checkout flow analysis, investigating the process from cart to transaction and including detailed suggestions from wireframes to visual design.
• Web 2.0 interactive merchandising audit that identifies crucial areas for customer interaction and ways in which rich media can engage shoppers and move them toward a conversion. This solution includes design direction as well as creation of functional, production-ready interactive merchandising components.

We are excited to offer solutions that are specifically designed to meet the needs of the current challenging environment. Thus far, we have had a strong response from retailers looking to use these packages to learn from this year’s holiday season and implement a more effective site in early 2009.

Video is the next JPEG

Just as static images are seamlessly incorporated into web pages today, we are going to see more seamless integration of video that moves beyond the use of an inline video player. Video will become integral to the content and not be a separate piece of content meant for independent interaction.

In the Harry Potter films, the Daily Prophet newspaper has “magic moving pictures” printed on the page as part of the news article. There is no separate video page and no video player off to the side – the moving pictures are simply integrated into the content of the page.

The Ralph Lauren site Rugby.com integrates video into the page content in a similar manner: the video, the images, and the text all live in the same space as part of a single experience. The brand experience is enhanced and strengthened by using simple yet high-quality video to supplement the information.

Video has the benefit of being able to convey more information than a static image. Seeing clothing on a walking, moving, breathing person tell us much more about fit and finish than a still image on a white background.  We can understand much better how a product might, work, or behave by seeing it in action.

At Martin & Osa the models take turns moving, walking, and turning around to demonstrate how the clothing fits. There is a great nuance to the customer experience: when you select a filter to narrow down your selection, the models wearing clothes that do not match the filter literally walk off the screen. Video is being used not only to show products, but to verify and acknowledge customer interactions.

Video can also tell a story much better than a single image. Would you rather watch a short film or view a single frame from a short film? And the story does not need to focus on the product – it may be used to enhance the brand, to inspire people, and even to set a mood.

The North Face uses video in several ways: demonstrate products in use, educate about the professionals who use the products, show the environments and usages for which the products were developed, and show how the company supports athletes, indigenous peoples, and environmental causes.

And of course video can be used to facilitate shopping, but rather than showing models wearing clothes or salespeople demonstrating products, we can also shop from the same video we see on television and in the movies.

“Shopisodes” take video from popular television programs and provide images, details, and links to buy the products that appear in the video. You can buy the clothes and accessories worn by favorite actors, furniture and decorations from their homes and rooms, and even the items they are using. Each video segment is created to provide information and a link when that product is visible.

Video for product merchandising falls into two categories:

• “Fast” video is meant to be watched like a short film; it provides context and information, and it demonstrates products in use; “fast” video is not clickable, and it is more likely a passive, entertaining experience.
• “Slow” video is meant to provide information while remaining clickable; it focuses on the products and provides ample opportunity to interact with the video while it plays.

Video may also come in a range of quality levels. Low fidelity video has an amateur appearance, may be customer-generated (although professionally produced video may intentionally take on this style), and generally focuses on product information and usage rather than brand enhancement (e.g., product reviews submitted by real customers.) High fidelity video has a professional appearance and may convey a much wider range of information, from product usage to brand ideals to corporate social responsibility.

Although video is becoming increasingly important to the online experience, it is not yet ubiquitous, and there are some issues to be resolved. Video requires much more bandwidth, and although more and more people have broadband access, web pages with integrated video still have longer load times, so visitors wait for content. Additionally, there are still many video formats. Even though Flash Video is perhaps the most common format for inline video today, there are competing formats that offer higher quality video and audio but with a different customer experience, and there are differences across browsers and operating systems that mean that some formats may not be viewable to all visitors.

Nevertheless, the movement toward integrated video is certainly underway, and we are seeing more video being used to provide information and content in more places than ever before. Although we cannot yet walk to the corner and buy a copy of the Daily Prophet, it may not be long before we commonly have similar experiences when browsing the web.

Initially we have launched Fluid Lite for the Yahoo! Stores platform through our partner Fast Pivot (www.fastpivotsoftware.com). For $200/month users can add the same rich zoom functionality that has been proven to increase conversion by 15-50%. Better, this is offered from a self-service site with virtually no need for implementation services (though the folks at Fast Pivot will do a great job helping you out, if you’d like). Even better, the integration with the Yahoo product catalog is built in, so you don’t have to do redundant data entry in Fluid Lite. There is almost no additional work.

The results from the first customer, Automoblox, have been tremendous. They have moved from a site with small, static images to utilize large, interactive images that really showcase their unique product. And ultimately, shopping is about engaging people with your products. We’ll share increase in conversion data with you once we’ve had enough traffic.

One of the most important aspects of the Fluid Lite offering is the deep integration with the ecommerce platform users get out of the box. The Yahoo Stores integration can automatically import product data so you don’t have any manual work. As we complete other integrations, Fluid will be working with partners to roll out Fluid Lite self-service solutions for other SMB ecommerce platforms, including Netsuite Commerce, Amazon Webstores and others. For customers that are already using those platforms we are able to help you now – it is simply the self-service piece and default integration we are working to put in place.

While we think Fluid Lite is an exciting alternative to overpriced imaging solutions on the market today, Fluid still offers Fluid Experience for customers that want to use interactive technology to increase conversion broadly across their site, from site arrival to conversion. Beyond the basic zoom and swatching solutions, Fluid Experience offers video, recently viewed items, suggestive selling and shoppable lifestyle photography.