X

Combining physical and digital experiences

We worked with Kohler to create a voice-enabled platform to support its growing ecosystem of connected products.

001. Brief

Kohler needed a smart platform that provided users with an easy way control their kitchen and bathroom appliances.

002. Solution

We created a unified experience, connecting Kohler’s products, simplifying daily routines, and adding voice control.

003. Outcome

Kohler’s new voice-integrated platform debuted at CES 2019, gaining the spotlight and winning a number of awards.

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.
Products

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.
Wireframing

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.
System

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.
Library

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.
thirteen23 is an exceptional part of our extended design team. They skillfully approach functional complexities with understanding and care, distilling them down into our desired minimalist expression.
— RAFAEL REXACH, DESIGN STUDIO MANAGER - SMART HOME, KOHLER

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.
Dark ui
Dark ui
Voice

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.
Mirror

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.