A side gig that turned into a long term project

What started out as a simple re-skin of a web app quickly became much more.

‍

A past client that I worked for

became a new client while I ran my own studio. He approached me because I previously helped him design a fitness app and he had a new project.

When I was presented with a fairly simple, but meaningful product in the athletic space, I began dreaming up ways to make it great.

Athlete Training Club can be summed up as

A dynamic and fresh take on digitally tracking, assessing, and competing with other athletes in a fun and engaging way.

There was already an established brand

Along with that brand was a responsive web app, a team, and a board of about 5 people in place when I joined.

But, the brand and the product needed a refresh

To bring it up to speed with current design trends, UX best practices, and appeal to its target audience of young athletes it needed to be redone almost completely.

So I created a plan to redesign the whole experience:

• Brand Identity
• Web app
• Print collateral
• Social media framework
• Email marketing and templates

‍

I started with a web audit of all pages, features, states, and content.

Then moved on to the brand:

ATC Logo

This needed a refresh to feel more modern and move away from the retro style that didn't mesh well with the product and brand vision.

‍

Style Guide

I created a universal style guide that could work across brand, marketing, print, and web. This consisted of colors, typography, and photography art direction.

‍

Then onto the web app:

I started with creating a Design Library, then began applying it to the app.

‍

Authentication & Account

Multiple menu states.

‍

‍

The Leaderboard

This is the main location in the app that athletes can see their competition's placement, where they stack up against others, and get insights into how they can move up. This needed a big overhaul... so I took it from a very simple bootstrapped table with some basic data to a robust leaderboard with a featured leader and enhanced data all wrapped up in a beautifully laid out and easy to use design.

‍

Thinking through every user state and interaction is important, so I accounted for hover states and a scrolled state that utilize a compact sticky header and table header.

Personal profiles

‍

Marketing site

There had to be a way to market the app and brand so I created a new marketing site with multiple states for Beta and the official launch.

Social posts

Some examples of social post designs I made for real brand partnerships and contests.

Print

I even made the occasional print ad. This one was used for a Combine challenge competition that was a main highlight on the marketing site's home page.

‍

‍

Overall I had fun with the brand, content, and experience. It became a year long project and I loved co-creating it with the founders and team.

‍