Developer uses Claude Code skill to unify fragmented Flutter app UI across 14 screens

A developer behind BrandMeld, a Flutter-based AI brand generator, found that the app's interface had grown inconsistent across 14 screens, with mismatched headers, random spacing, and an overwhelming 8-field creation form. Rather than manually refactoring each screen, they deployed a Claude Code skill — a markdown-based instruction file placed in a designated project folder — to apply a unified design system. The skill enforced an 8-point spacing grid, a 60/30/10 color system, and named UI patterns like gradient headers and grouped cards, transforming the settings screen and simplifying the creation form to a single required field. It also diagnosed rendering bugs from screenshots, catching issues such as clipped card borders and a floating stats card obscuring a user avatar. The developer has published the skill on GitHub, noting that packaging design conventions into a reusable SKILL.md file enables consistent UI output without re-testing underlying app logic.