Anyone with any interest in language knows Rosetta Stone, the world’s best-selling commercial language education software for over twenty years. Using immersive learning as opposed to traditional grammar-based and translation methods, the software has been awarded educational and learning awards since its initial release and is widely considered to be the gold standard for language software.
Having originally distributed their language programs as box sets of CDs, Rosetta Stone met with nclud and described their desire to take their offerings to mobile platforms, with subscription-based online learning and relevant, engaging mobile experiences for a new generation of learners. We understood exactly what they were saying.
nclud’s creative direction brought in the brand’s developing vibrant identity.
Using Rosetta Stone’s yellows, blues, and grays, as well as textures and patterns, the site clearly communicated that it was part of the Rosetta Stone family without overwhelming potential customers with the “yellow box.” By developing a system of large, bright hero images throughout the design, we crafted an emergent and emotional narrative for users to connect with as they browsed — and it encouraged them to delve deeper into the site. In this same vein, we opened the design up so it was less contained, allowing the information to flow easily and intuitively without boxing everything inside a tight grid.
Although the property was a mobile site, relying on a “tabbed” navigation scheme was dismissed as being too standard on native mobile applications. Instead, we designed an unobtrusive sticky menu at the top of the page that stayed with users throughout their scrolling and navigation to more easily provide access to rich additional content. With the goal of showcasing the products and their features and inspiring users to explore content, horizontal swiping within sections became a secondary form of navigation. Utilizing the full functionality of a touch device, users can simply swipe across a section or hero image to dive deeper into the content and interactions associated with it.
The most critical piece of the new mobile experience was an intuitive shopping cart.
Naturally, the goal was to reduce time-to-checkout and make the entire process easy to navigate and complete. Through eye tracking, user testing, and in-depth interviews, we worked through these UX challenges.
The initial challenge was differentiating between Rosetta Stone’s CD software versus their digital offering and TOTALe (the online subscription service and app component). Illustrating the features and values from the start was crucial for the customer to understand what they were actually purchasing.
The next question that arose was: “do customers pick their language or their product first?” User testing showed that users often thought that different languages had different products, complicating the purchase. With that in mind, the checkout process was approached from a product-first perspective, having customers pick the product before choosing their language.
The final problem to solve was the labeling of the shopping cart itself. Through user research, we identified that using “Buy Now” microcopy as a call to action intimidated shoppers and made them think that they were skipping right to checkout, as opposed to simply adding it to their shopping cart. Simply changing that language to “Shop Now” encouraged customers to use the call to action, add products to their carts, and check out.