Kohler

A Marketing Story by Thirteen 23 about Kohler Co.

2 Views | 0 High Fives

Kohler Co.

Product Launch

Challenge

Combining physical and digital experiences We worked with Kohler to create a voice-enabled platform to support its growing ecosystem of connected products. Kohler needed a smart platform that provided users with an easy way control their kitchen and bathroom appliances.

Solution

We created a unified experience, connecting Kohler’s products, simplifying daily routines, and adding voice control. Putting voice first With an eye toward the future of voice-controlled kitchens and baths, thirteen23 worked with Kohler to design and architect its first digital platform. The new ecosystem allows users to control and personalize their product experiences, simplifying daily routines. UNDERSTANDING THE PRODUCTS We worked closely with Kohler’s teams to establish a digital strategy that seamlessly integrated with popular voice technologies while also creating an extensible platform for Kohler’s own services. Understanding how each product worked at the hardware level and determining which features to surface was critical to our strategy. ESTABLISHING WORKFLOW Strategy in place, a final feature matrix was established to inform our design and prototyping. The team created a global framework and an exhaustive set of wireframes that covered every user flow, including adding products, creating routines, managing rooms and locations, and voice personalization. Visual Design After mapping out a new digital experience, we established a comprehensive design language that could be extended across the rest of Kohler's digital products and software. We took our visual cues from the bold, modern character of the Kohler brand. AN EXTENSIBLE SYSTEM We created a custom design language establishing typography and colors, repeatable UI elements, and hero device controls that could be reused and expanded across the software. AN EXPRESSIVE ICON LIBRARY Instead of using product photography that would quickly become outdated, we created a detailed library of product illustrations representing each of Kohler’s smart products and appliances. Experiences and Products To accommodate the needs of users who want both easily repeatable, personalized routines and individual device control, we organized features into two categories: Experiences and Products. EXPERIENCES Experiences give users the ability to have one-touch access to custom routines and experiences from the home screen. They also provide Kohler with a foundation that can grow to include synchronized devices and inteligent voice control. PRODUCTS Product views allow users more detailed control over their devices. We created a suite of hero controls that simplify each product and focus the user on the most important actions. Additional configuration is still available in settings. EXTENDING THE LANGUAGE We also considered how our visual design language could be extended across Kohler’s hardware products. We focused on creating a seamless visual experience that continues when the user switches between their smartphone and Kohler's built-in displays. Adpative Interface To support advanced customization, we provided Kohler with an adaptive interface that can switch from light to dark based on user preference or time of day. VOICE INTERFACES In addition to the visual design, we also considered how custom presets would translate into voice experiences. We ensured that primary experiences could easily be summoned using voice, making major interactions conversational. SMART MIRRORS Beyond this, we designed our interactions to fit within Kohler’s growing ecosystem of voice-driven products, creating compatible experiences with Amazon Alexa and Google Home. Kohler at CES Kohler took our application, along with its suite of products, to the Consumer Electronic Show. As part of the new product launch, Kohler integrated our new visual identity into its larger marketing effort. The new platform was well-received and represented Kohler's first foray into to the consumer electronics space.

Product Design