Anti-patterns

Each is a named mechanism observed in a real product. "It looks dated" is not a diagnosis; these are.

In Konjo's own tree

1. Hairline-only hierarchy. 318 uses of radius.card, 487 border declarations, all one weight. Train home stacks up to eight containers at identical weight under a band that shouts three times, so nothing can be second-most-important.
2. Uppercase inflation. Five uppercase registers shipping at once (eyebrow 11/800, sectionLabel 12/500, bandLabel 16/900, bandLabelLead 18/900, tri-buttons 10/800). Uppercase used as ambient light instead of a spotlight.
3. Duplicate destination in one viewport. Events home shows the same event three times — band strip, featured card, browse row. Learn shows the same destination twice.
4. Truncate rather than reflow. The shipped marketing screenshot clips "curriculum & class …" mid-sentence. Band labels are numberOfLines={1}, so long event names silently disappear.
5. Ship a law, then break it privately. Thirteen violations of the no-depth law — six in src/, seven gradients in Studio. PlansLibraryScreen defines two shadow levels, an elevation ramp reinvented locally because the token set has none.
6. One bespoke Card per feature. 16+ *Card.tsx components, 29 files defining their own button style, and no Card or Button primitive anywhere in src/.
7. Empty space that reads as unfinished, not spacious. ~400pt of blank white below Train home; a red button floating in a void on Run class.
8. Inverted emphasis from colour inflation. On Train home the red "See all" is more prominent than the section label it belongs to.
9. Two equally-weighted red buttons on Run class with no primary/secondary rank — for the persona with literally one free hand.
10. The most emotional moment is the least legible thing in the product. The achievement gold pair computes to 2.97:1.
11. Studio is better systematised than the app. apps/studio has ui/button.tsx; the 128-screen mobile app has no Button at all.

In the competitors

12. Inverted row anatomy — Mindbody's class list sets "Mon 4/6 at 7:00am" at 15pt grey above "Gentle Yoga with Sound Bath" at 17pt black. The eye lands on the timestamp instead of the class.
13. A 48pt button carrying 13pt type — Mindbody's "BOOK NOW". Target size and label size decided independently of each other.
14. The primary row action as the weakest element in the row — Mindbody's "SCHEDULE" ghost button: lowest contrast, smallest type, smallest target, and under 44pt.
15. Selected state that doesn't read as selected — Mindbody's segmented tabs differ only by a 3px underline in the same colour, weight, and size as unselected.
16. Three button styles in one 44pt row — Zen Planner's date stepper: two bare chevrons with no container, a bordered square icon button, and an unstyled label.
17. Competing bold lines — Zen Planner class rows set two of four lines bold, so the class name and the instructor name fight.
18. An unexplained decorative accent — Zen Planner's 4px gold left bar, which encodes nothing.
19. A gradient nav bar — Zen Planner's black-to-charcoal top bar. Dates a product instantly.
20. Four stacked metadata treatments in one row — Mindbody search results: name, address, tag chips, distance, and star rating, each with its own size and colour.
21. Marketing composition inside the product — several competitors ship App Store shots of tilted device mockups because the real screens have no hero. If the product needs a tilted mockup to look good, the product doesn't look good.