Brohdi

Choosing where to focus

The founders were willing to push the launch back for work that made the product better. They were not willing to push it far. That made the first decision about where design time would earn the most, not about how much of the product I could get through.

Coaches are the customer. Brohdi sells to them, and a coach evaluating the product judges it on the work they do every day. That put training plan creation and meal plan creation at the top. Both were the hardest parts of the product to use and the parts a coach cannot avoid.

On the client side I took the workout flow. A coach's clients are their reputation, and a client who struggles to complete a workout reflects back on the coach who put them there.

The design system foundation covered the rest. Screens I never opened still inherited consistent components, so the work reached further than the flows I redesigned.

Two routes for the visual identity

The founders kept their existing logo. Everything around it was open.

I pitched two identity routes and showed each one applied across the app, the website, social and clothing rather than presenting them as static boards. Brohdi was a product with an audience attached to it, and an identity that only worked at interface scale would have failed the moment it reached a shirt or a launch post. The founders chose one route, which I then rolled out across the product.

Telling a coach an exercise is already in the week

Coaches on the client's internal team said they wanted to know when an exercise already appeared on another day of the same training week. Some avoid repeating exercises for particular clients. Their reason was that a client can read repetition as a coach recycling the same plan.

My first version put the detail in the card. "In plan: Mon Pull, Tue Push."

Coaches name their own days. One called a day "Monday push pull." Long names broke the component.

Three solutions went into comparison. A developer proposed numbered day pills in the card. I proposed a small red dot beside the information icon. The third used a multi-check icon.

I rejected the numbered pills. Exercises, sets and reps already fill this interface with numbers. Adding day numbers to that made it harder to read.

The multi-check icon would have made three icons on one card. Add, information, and then a third for cross-day usage. Three felt like too many in the densest part of the screen. That was judgement rather than testing, based on the number of dense interfaces I have worked on.

The red dot carries status and nothing else. Full day names moved into the exercise information overlay, where there is room for them however long they get.

Cutting the exercise card down to what a coach needs

Each exercise card carried a large thumbnail for a video that might not exist. The video matters to a client performing the movement. A coach building a plan needs the exercise name and needs to know a video exists.

Cards became compact rows led by the name. Tags, equipment, video availability and full instructions moved into an overlay behind the information icon. The list holds more exercises and scans faster. Reference detail is one click away instead of permanently in the way.

Rebuilding the meal planner around hierarchy

Everything a coach needed was already on the screen. The problem was that everything looked equally important.

I set the structure as Meal Plan, then Meals, then Ingredients, and used size, spacing and brand colour tints to make that structure visible.

Then I decided what to hide. A collapsed meal shows its name and its total macros. Individual ingredient macros stay hidden until opened.

That decision came from how coaches work. A coach who has programmed a balanced chicken and sweet potato bowl regularly does not need the per-ingredient breakdown while planning. They need the overview and the totals. Coaches confirmed they knew their regular recipes well enough for the detail to be optional. The feedback on the redesigned screen was positive.

An ingredient grid that survives real content

Ingredient names vary in length. The existing layout let that variation push every following input to a different horizontal position. Rows would not scan.

I built a column grid. The name flexes inside a controlled width. Quantity, unit and macros hold their columns down the page. On smaller screens each ingredient stacks into a group instead of compressing the columns.

Designing the client workout screen as a focused mode

The inherited exercise screen nested containers inside containers. Coach-set values looked editable. Completion was an unlabelled tick. Complete Exercise sat on screen the whole time. Global navigation stayed at the bottom throughout.

I removed the bottom navigation for the duration of an exercise. Global navigation is for moving between top-level areas of an app. An active workout is a single self-contained task, and a client working through sets has no reason to be one press from the nutrition tab. I made that call from experience and later found it matched established guidance on when bottom navigation should be dropped.

Coach-prescribed values became visually read-only. The tick became a Log button, because Log names what the action does. Complete Exercise appears only once every set is logged. The rest timer became a show and hide control rather than a permanent block.

I also raised a Skip action and flagged it as a functionality change rather than a design change. It stayed a question for the client.

Scoping the design system as a foundation

Brohdi was already built in Tailwind. A full design system programme would have run past what the product needed and past what the budget allowed.

The foundation also had a job the redesigned flows did not. Most of the product was never in scope for redesign. Those screens still needed to look like the same product, which meant the system had to be usable by developers on screens I would never open.

I scoped it accordingly. Recurring components, plus colour, typography, spacing, grid, states, iconography and responsive variants defined where the priority flows needed them. Three flows set that priority. Coach meal plan creation, coach training plan creation, and the client workout.

It is a foundation and I would describe it that way in any review. It gave the product consistent components across both the coach and client experiences, and it was structured to grow.