A rebranding design for STEP X to reshape its identity and expand its audience.

STEPX
Fitness App

UI/UX Design
Figma
Illustrator

IOS UI

ROLE UI/UX Designer

Duration Nov. 2021-Feb. 2022 (4Months)

SUMMARY

My role involved redesigning the STEP X app to improve its user interface and overall user experience, introducing a new visual identity to the app. This was necessary because the app was originally developed without a UI/UX focus, which resulted in a visually unappealing and user-unfriendly interface.

01 research
Review The Original Version

01 Lack of Brand Identity

Upon reviewing the UI, I noticed that the current version lacks a distinct brand identity. Incorporating a feature that enhances brand identity into the UI is crucial.

02 Users want to record their GROWTH

Those who work out while using STEP X can gain reports of body composition data via Accuniq, a high-tech body composition recording equipment. Regarding training, members want to receive an organized analysis of the body.

Overall evaluation

I evaluated the previous app comprehensively to understand all the problems. One of the most severe problems is that the app lacks interactivity.

Body Composition records

Body composition records are connected with the data from individual users calculated in the STEPX gym. This is one of the featured functions in the app. However, it lacks interactivity, so users cannot easily find their records on the "more info" page.

02 Ideate
Information Architecture

Feature

Based on the analysis of the rebranding project and the evaluation of the previous app developed by engineers, I defined one main feature: Body Composition Analysis.

Wireframe

Redesigning user flow helps me deliver a great product experience. I made wireframes to lay out content and functionality on an app that takes into account user needs and user journey.

o3 Design
Style Guideline

Visual Style

Visual style is an essential part of a project as it helps create a standardized system of colors, fonts, buttons, text input, and many other components that will be combined and displayed on user screens.

04 Design
Components Library

The UI component library helps developers build apps faster with ready-made design elements,
ensuring the app looks consistent and keeps its design style.

o5 Design
User Interface

00
Reflection

During this project, I learned that as a designer, one can sometimes become too ambitious with the product concept. Engaging in discussions with the engineering team provided me with a reality check, revealing the actual limitations we faced in UI development. With more time, I would have preferred to delve deeper into refining our prototype's user experience, as I am convinced that additional user testing could significantly enhance the UX. The project was immensely fulfilling nonetheless, and I truly valued the experience of stepping into the roles of both UI and UX designer.

STEP X / Coporation Identity System

Sound Map

I'm open to new opportunities &
would love to hear from you.

# Inclusive Design # Product Design # Brand Design # And more......

Email

Home