DEVOURED
How I Design with AI
Designers should approach AI-generated drafts as raw inputs that require aggressive pruning of superfluous elements to maintain usable product standards.
What: The design team at Ref mandates building in component libraries and validating with real data rather than raw model output. They prioritize group critique of drafts to filter out the 'slop'—excessive copy, icons, and lines—that AI models typically default to.
Why it matters: This represents a shift in design philosophy where the primary skill is no longer 'drawing' interfaces, but 'curating and constraining' the generative overflow produced by models.
Takeaway: Before handing off AI-generated mockups, strip out everything that isn't functionally necessary for the current task.
Deep dive
- Use AI for rapid exploration, not final output.
- Remove 'slop'—unnecessary UI ornamentation that models generate by default.
- Build designs directly into component libraries rather than flat files.
- Test UI drafts by deploying them against actual data sources.
- Use peer critique to stress-test the 'taste' of generated components.
- Borrow established interface patterns to ensure the generated design feels familiar.
Decoder
- Slop: In this context, low-quality or unnecessary content, UI elements, or decorative fluff generated by AI that adds noise without adding functional value.
Original article
Product design with AI turns to slop unless constraints come first and the extra copy, lines, and icons agents love to add get removed. The approach favors iterating in a design tool like Figma rather than the codebase, building reusable component libraries, and validating results with preview deploys against real data. At Ref, the team also borrows interface patterns from existing products for context and stress-tests taste by critiquing drafts as a group until something holds up.
Explore all 56 articles in today's digest
Fresh dev news, AI-digested daily. Never miss a trend at devoured.fyi