SpeedSmith・2018

The best foot measurement and sopping experience for your children

cover-speedsmith
Duration

6 months

My Role
My Role

App designer

Product design

Disciplines

Product Lead 
UI/UX

Visual design
Illustration

Published

April, 2018

Made with

R+W

ic_ss_app
iOS App
No longer available
iOS App

Overview

SPEEDSMITH is a startup that designs super-functional and stylish sneakers for children of all ages and all kinds of activities and environments.

R+W helped SPEEDSMITH created a highly engaging app and a 3D measuring online service that gives parents better shoe size recommendations for quick growing children's feet.

In 2020 April, awesome sports acquired SpeedSmith App and its patents of the feet mapping system and will take the baton and run with it magnificently.

Pain points statement

This situation has been worried many parents in the world. Many parents couldn't pick the right size of shoes with a toddler. Parents know something wrong while children start walking on tip-toes with greater frequency. Most of the children can't express their feelings and emotions directly and tell parents “NO, NO, NO” when it is time to put the shoes on.

In fact, a child’s foot can grow up to 12 sizes in the first three years of life.

img_feet_test

Foot measuring system development

The R+W tech team joined the SPEEDSMITH in the very early stage. The engineers developed a function by taking the perfect photo of your feet from an iPhone camera to create accurate 3D models.

As the R+W tech team released a prototype app for a test model. As a UI/UX designer, I was involved in this project to think about how to guide the users through the measuring process and give the user more context and expectations for measurement.

img_feet

Role and objectives

At the same time, the SPEEDSMITH team produced the children sneakers for all ages, activities in any environment. The SPEEDSMITH Co-Founder's also worked with Daylight Design to define the brand and identity.

I worked on this project as a UI/UX Designer, partnered closely with Stakeholders, PMS and Developers. My overarching task was to translate user needs and business strategy into an online seamless experience.

Here are three main business and customer goals for the SPEEDSMITH app

  • Allow the user to explore and interact with SPEEDSMITH brand content and help invoke an enjoyment feel in the mobile app. 
  • Make measurement feet very easy to reach out for help, record and ensure the parents are aware of the wide range of services offered by SPEEDSMITH.
  • Provide a way for the highly usable shopping experience that parents buy shoes for their young kids.
img_shoe
img_sketch
How to make parents predict the right feet size before kid uncomfortable?

My design process

First, understand the problem, "How fast do children's feet grow?", "How parents measure children's feet? "What kind of shoes is the best for a young kid?" even more questions. I started to ask the friends who have the child around me, and most of the pain points were like this, "I have no idea when their feet grow." or  "I bought a new size of shoes when they didn't want to put their foot into shoes."

That’s what SPEEDSMITH wants to solve and gives parents the confidence to know the right shoe size and shop the shoes for the kid on any occasion.

When I understand the general situation and workflow in parents, based on this question, here was the IA I intended for the SPEEDSMITH team.

UX
IA
This Finale Information Architecture 

Design guide

SPEEDSMITH had a new logo and brand colour palette from Daylight Design. My next step was extending the UI component and colours. It was essential to represent the character and brand for begging of the app.

The UI design guide iterated on an initial design: the user interface, wireframe, app flow, and even web and mobile UI components.

img_ss_basic_guide

The onboarding flow

For easy understanding and higher engagement to the new user. This is What I kicked off the process with a series of tutorials and guide the user to measure the feet before them jumping into the app.

The onboarding process showed a simple tutorial on SPEEDSMITH and how the app measures kid's feet. Also guided the new user to have guidance on paper and feet for the first measurement.

It is the best way that the user positively engaged in than describe anything.

img_login_flow

Isometric illustration

As Client and I had the same view with Tutorial screens, I dropped 2 to 5 different of kind illustrations for the beginning. As illustration is a key element of this app. We both think the image with the isometric (3D) view was an appropriate way to represent the SPEEDSMITH Brand and App. On top of that, the final illustration of the tutorial provides a clear and significant direction with the vibrant energy of youth.

Onboarding At Early Vision

tutorial_1

Get ready

You’ll need a piece of blank US LETTER paper (8.5”x11”), a hard (not carpet) floor, even lighting without strong shadows, and non-white socks for your child.

You’ll need a piece of blank US LETTER paper (8.5”x11”), a hard (not carpet) floor, even lighting without strong shadows, and non-white socks for your child.

tutorial_2

Get set

Have your child place their heel against the wall and try to keep their foot in the center of the paper. Their toes should be pointing forward, and only place one foot on the paper at a time.

tutorial_3

Measure

Position your phone so that the paper’s corners make all four pink boxes light up. Then, let us know if we’ve correctly placed the paper on screen.

tutorial_4

Shop!

Your suggested shoe size will automatically transfer to our app’s online store. You can choose a great pair of kicks for your child, and find out how to help support our non-profit partner Soles4Souls.

The final tutorial flow

img_onboarding
Onboarding At Early Vision

Icon set

A good product needs good storytelling. A clear and strong graphic increase branding awareness and build brand engagement to the client. By created these icons, users can easily understand the benefits of the sneakers.

ic_Comfortable-Stretch@2x
Comfortable Stretch
ic_Machine-Washable@2x
Machine Washable
ic_Super-Lightweight-@2x
Super Lightweight 
ic_Zig-Zag-Orders@2x
Zig Zag Orders
ic_Reusable-Shoe-Bag@2x
Reusable Shoe Bag
ic_Wide-Fit@2x
Wide Fit

The measurement process 

Once the user measures the feet, the user can get a suggested shoe size within a few seconds and directly shop the SpeedSmith shoes.

To be even more helpful. App also tracks how fast your kids' feet grow over time. This app also tracks how fast your kids' feet grow over time. Based on smart system, SPEEDSMITH will notify parents when the estimated size is getting close.

img_eta_chart
img_ETA_logic
The chart shows the logic and age to push notification in time

UI overview

I was iteratively working on this project since May 2017. We ran the sprint weekly to identify use cases and possible situations with the client. There were over 50+ screens we designed for this App. Now, the app officially kicked off in April April 2018. I was ecstatic to see how app truly impacts peoples' life and make their better life.

img_store
img_pre-registration
img_launch_screen
img_checkout
img_capture
img_product

Learning & Takeaway

App rating: ★★★★★ 4.8

I commissioned the design work on this project in 2017. So much love and feedback I got from the client, users and App store. However, it paused in progress for a moment. Looking back at the project with a critical eye, if given a chance, I would reinforce the Profile to increase drive traffic to the e-commercial of the app.