Product Design

/

STEM

Engaging users while onboarding Kano products

Engaging users while onboarding Kano products

About

Kano Computing

Kano is a STEM company dedicated with introducing kids to technology and coding in an accessible way. They can explore physical technology or coding blocks in the same ecosystem, learning as they go.

Responsibilities

Head of Design
UX/UI
Researcher
Animation/Video
Product Management

Team

About my role

  • Own the UX and UI for onboarding Kano devices.
  • Work with the Art Director to apply our art style to onboarding journey.
  • Work with the App product designer to maintain the app component and style guide.
  • Produce animations to display on onboarding UI and Pixel Kit.
  • Work with Head of Product to maintain consistent UX across all devices.
  • Impact

    ⏳ Device setup that could be completed in less than 5 minutes

    🚀 Shared onboarding journey for all Kano devices

    Challenge

    Kano was launching a suite of products that could be plugged into its core Computer Kit product or any computer device. In order to use these products they needed to be connected to be registered and connected to a WI-FI network. To do this we needed to design a solution where young users could easily onboard their new device with minimal fuss. This provided a challenge where our users could be as young as 5 years old; where its easy to become distracted or become overwhelmed with instructions.

    As we were releasing multiple products in quick succession, our solution needed to be as easy to replicate as possible; so maintaining a strict design template was essential to optimise efficiency for product launched.

    Process

    Turning an on-boarding experience into something that felt like Kano represented a challenge - how do you add fun and energetic elements without losing sight of helping the user onboard their new kit as simply as possible? My instinct was to replicate the style used in the instruction books that come with each product. These 'Storybooks' as we call them, help the user build and get started with their device, and it felt essential for the user to replicate that experience as much as possible. The books use illustration to explain the steps for the user to follow, and by using these I could continue the same flow, but also bring them to life with browser animations that heightened the user experience.

    We were also very aware that the onboarding experience would need to be completed (at least partly) with an adult helper to enter information like email addresses and WI-FI passwords. For this we would add notes to user like "Get help from a grown up" to let them know something needed a little assistance.

    connect Motion Sensor Kit
    Animations aimed to replicate and enhance what would be seen in the Storybook

    The goal was ultimately to get them playing with the device in under 5 minutes and I was very keen to make the experience feel "easy" and not overwhelming. I designed the UX to be simple, with short instructions and playful animations to help the user understand each step, and stay engaged with the product they were connecting.

    Select a product to connect
    The Kano App allowed you to connect any device from it's ecosystem

    Kano likes to demystify what it sells and teaches. As well as bringing the experience to life with animations,  I worked with the Creative Director to source and write little facts that would help the young user understand how their device worked. For example with the Pixel Kit we would explain how fast light reached their eyes. These were all designed to bring more warmth to the experience, and let young users and their older helper have some to engage with together.

    Connecting your Pixel Kit
    Animations from the screen would appear on your Pixel Kit at the same time
    Onboarding complete
    Captions would appear on screen to help users understand what was happening... just like our instruction books

    While onboarding I didn't want the products to feel redundant, I wanted the user to use them too in some way. For the Pixel Kit, the animations that appeared on screen also played on the kit itself, and when on-boarding the Motion Sensor Kit, you had to complete training which showed you how the product works. This all helps make the on-boarding experience feel connected to the products themselves and not just a step the user has to get through to complete.

    Helping users get started
    Users were given tutorials to using their new product while onboarding

    The end result ended up being an onboarding UX that allowed us to re-use templates for any device in our suite. When moving onto new product launched, we only had to write content and design animations. This sped up the process and saved valuable time where my team was responsible for multi-channel marketing comms.

    Other case studies

    Want to work together?
    Get in touch