The best foot measurement and sopping experience for your kid

SpeedSmith  |  Product Designer・2018
img_ss_cover
Information

Disciplines | Product Lead, UI, UX, Visual, Illustration

Published | April ,2018

Project | iOS app

Agency | R+W Inc.

Product Owner | Black Brass Inc.

Company | Black Brass

ic_ss_app
iOS App
iOS App
Website

Overview

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

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

Children Foot

This situation worries many parents in the world. There are 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. What is more, most of the children can't express directly their feelings and emotions and telling 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 their first three years of life.

img_feet_test

3D foot Measuring System

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 iPhone camera to create accurate 3D models.

As 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 expectation for measurement.

img_feet

My Role

At the same time, SPEEDSMITH team produced the sneakers for all age of children.
The children's products who can wear it to do any 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 with Product Owner and Developers. My overarching task was to translate user needs and brand requirements into an app with a seamless experience.

Here are three main business and customer goals for SPEEDSMITH app

  • Allow the user to explore and interact with SPEEDSMITH brand content and help invoke 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?

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 want to solve and gives parents the confidence of knowing the right shoe size and shop the shoes for the kid in 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

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

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

img_ss_basic_guide

The Tutorial

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

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

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

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

Isometric / Perspective 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

The final tutorial

img_onboarding
Onboarding At Early Vision

The Measurement Process 

Once the user measured the feet, the user can get a suggested shoe size within a few seconds and shop the SpeedSmith shoes with fit and comfort.

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. You can save profiles for multiple peeps in your family, and save sizes every time you measure. Based on built-in app smarts, SPEEDSMITH will notify you when it's time to measure your kid's feet again.

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

Icon Set

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

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

UI Overview

I was iterative worked on this project since May 2017. We ran the Google Design Sprint to identify use cases and possible situation. There were over 80+ screens I designed for it. Now, the app officially kicked off in April April 2018. I was ecstatic to see that the app was finally available for everyone to download. 

img_store
img_pre-registration
img_launch_screen
img_checkout
img_capture
img_product

Love from App Store

I commissioned to work on this project since 2017. So much love and feedback I got from the client, users and App Store. I felt this is one of the interesting projects I’ve worked on to date. However, it paused in progress for a moment. Looking back at the project with a critical eye, if given chance, I would reinforce the Profile to increase drive traffic to e-commercial of the app.

img_avatar_female
Kerplunk97

Aug 2, 2018

⭐️⭐️⭐️⭐️⭐️

Great concept, easy to order. Such cute shoes, we’ve seen them on other kids and they look and feel amazing! The app for measuring was great because I usually order several sizes to be sure, this made it so much easier, took the guesswork out!!

img_avatar_male
AneetsFTW

Jul 12, 2018

⭐️⭐️⭐️⭐️⭐️

My little guy is super picky about his shoes, so we’ve tried tons of brands and styles. We also usually have a hard time figuring out his size. This clever app solved that problem! When he tried these on, we knew we found a winner! These shoes are high quality, lightweight, and comfortable. They even come in a cool bag. Highly recommend!

img_avatar_female
TranLin

Jun 20, 2018

⭐️⭐️⭐️⭐️⭐️

Finally, an app that can do it all and super easy to navigate. No more guessing our kid's ever-growing shoe size. And once the app smartly measures their feet, in one click you can order the shoes!! Love it!!! Oh, and the kicker? They're super comfortable AND stylish.

img_avatar_male
Dantastic4

Apr 20, 2018

⭐️⭐️⭐️⭐️⭐️

App is super easy to use to get exact fit for growing kids. Didn't know that the typical kid's feet are different sizes between left and right, and the app let's you get the perfect fit for the little feet. Shoes are looking fabulous too! Shoes are awesome too. Simple clean design with knit top that allows for lots of action. Highly recommended!!!