Maddawg Strong is the brand name for Maddy Forberg, a powerlifting coach based in Pennsylvania who contacted Chainlift to design and build a new website for their coaching business.
Design and develop a website for Strong for Life Co where clients can sign up for coaching, pay via stripe, and manage their own billing info with unique user accounts.
Give users the ability to compare and subscribe to coaching plans, have their own client portals, and manage their billing info through the site. We also sought to make it as easy as possible for the client's team to manage content.
The systems for subscription billing, user logins, and user profiles were not offered natively in Webflow at the time. Furthermore, we wanted to avoid subscribing to a SaaS service in order keep operating costs low.
We engineered a custom subscription billing platform using a combination of Google Cloud Run, Firebase Authentication, and of course Webflow CMS to deliver all required features with secure, end-to-end encrypted communications.
User logins with Firebase Auth allowed us to avoid middleware and get complete control over user account behaviors on Firebase's infinitely-scalable, lightweight, and secure infrastructure.
We used Stripe's checkout and billing portal components to create a seamless, custom checkout flow that keeps users on the client's site with secure payment processing guaranteed.
Webflow CMS brings all our back end features together into a centralized location where the client can add, edit, and remove content at will with zero learning curve thanks to Webflow's on-page editor.
We were provided the client's existing brand guidelines for her former business name, Maddawg Strong. From these, we derived our top-level color scheme.
For other style questions such as the use of outlines, origins of decorative elements, and image color correction, I turned to inspirations from both the real world sports and gym environments, as well as the symbology of athletic branding perpetuated by industry names Strong For Life's clientele would likely have a positive associations with such as Nike, Under Armor, and as shown below, Gatorade.
The Gatorade reference was chosen specifically due to its likelihood of invoking a nostalgic response from the user. Strong For Life's target audience is currently men between 25-34, who would have been children at the time when the campaign originally aired.
This allowed freedom of logical planning without getting bogged down in visual details. To reduce redundancy and overlapping flow lines, funnels were mapped independently of one another rather than connected into a single site "web." In addition, this process began at the same time as the UI design described above. Both efforts moved independently of one another until completing around the same time.
To get an idea for the level of detail in these flow charts, take a look at the example below. Gold squares signify starting points. Blue squares signify pages. Green circles signify making a choice that redirects to a new page.
In practice, the lo-fi and hi-fi mockups are produced in that order. However, I've decided to display them side-by-side here to make the differences between the two clearer.
.jpg)
