{"slug": "how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop", "title": "How I Design UI with Help of AI Tool, Without Ending up With Slop", "summary": "A designer tested six AI tools with the same brief and found they all produced nearly identical, generic UI screens, which the author calls 'slop.' The author argues that AI tools invent design systems on the fly, leading to anonymous results, and recommends building a design system first before generating screens, using a tool like Moonchild that prioritizes the system over the screen.", "body_md": "A few weeks ago I noticed something that I could not unsee.\n\nEvery screen I generated with AI looked like it belonged to the same generic product. Not my product. Some other product that does not exist, the one all these tools seem to be quietly designing for.\n\nFor a while I blamed myself. Better prompt, better reference, better luck next time.\n\nThen it stopped feeling like a me problem and started feeling like a pattern, so I ran a small test to see if I was imagining it.\n\nI gave six AI tools the exact same brief.\n\nPrompt :-\n\nDesign a home screen for an AI agent workspace app.\n\nA finance team uses it to assign work to AI agents, review tasks that are waiting for approval, and chat with an agent to plan what to do next.\n\nInclude a left sidebar for navigation, a main message input at the top, a list of items that need attention with status labels, and a list of available agents with short descriptions.\n\nI pasted the identical brief into all of them and kept the very first result, resisting the urge to rerun it or quietly pick the nicest one.\n\nHere is what came back.\n\nLook at them together and something uncomfortable happens.\n\nThey are not copies, but they are clearly siblings.\n\nThe same indigo accent.\n\nThe same rounded stat cards.\n\nThe same Inter on the same 8px grid.\n\nThe same little robot glyph standing in for every agent.\n\nThe same colored status pills. Different tools, different companies, one face.\n\nWe have started calling this slop. But the word gets used as a synonym for ugly, and that is not the problem at all.\n\nNone of those screens are bad. The spacing is even, the contrast passes, drop any one into a portfolio and it looks fine?? Are you sure?\n\n**That is the trap.** They are competent and anonymous at once, like every product came out of one mold in a different coat of paint.\n\nThe same indigo accent. The same stat cards with little green arrows. The same status pills, the same generic icon standing in for a whole product’s personality.\n\nThese are not design decisions. They are defaults, and every tool reaches for the identical ones.\n\nIt is not a taste problem you can prompt your way out of.\n\nWhen a tool designs a screen, it has never seen your product, so it invents one.\n\nIt guesses an accent, picks a safe font, builds a tiny throwaway design system on the spot, then forgets it the moment the next screen loads.\n\nThat is the real cost of generation. The AI is not working inside your design language. It is inventing a new one, badly, every single time.\n\nI give the AI less room to invent.\n\nSlop fills the gaps I leave, so I stop leaving gaps.\n\nThat means being specific, and it means handing the tool a real design system instead of letting it guess one.\n\n**I define the roles, the type, the spacing, the components, the rules for how they fit.**\n\nI decide those things myself, up front, and the AI stops deciding them for me badly.\n\nSo the order has to flip.\n\nInstead of asking for a screen and hoping a system comes with it, I build the system first and generate the screens out of that.\n\nThe problem is that most tools cannot work this way.\n\nThey draw the screen and improvise the system in one move, then discard it the second the screen appears.\n\nWhat I needed was a tool that treats the system as the thing it keeps, not the thing it forgets.\n\nThat is where [ Moonchild](https://moonchild.ai/) came in.\n\nMoonchild was the one tool I found built the right way around, system first, so I put it to work on our actual product to see if it could kill the sameness. Here is what happened.\n\nI built the Softworker product demo end to end frontend, and shipped it\n\nI started with the system, not the screen.\n\nBefore I prompted for a single layout, I built the design system in Moonchild.\n\nColor, foundation, spacing, components, the rules for how an agent card or a status row should behave.\n\nSometimes I go with the default design system from gallery. This time I built one from scratch.\n\n**Moonchild DS Link :- **[https://studio.moonchild.ai/ds/065e450e-0c3f-411b-b97d-45b16362c941/Softworker-DS?shared=design-system](https://studio.moonchild.ai/ds/065e450e-0c3f-411b-b97d-45b16362c941/Softworker-DS?shared=design-system)\n\nDue to lack of time, this time I did not generate screens in Moonchild first. I used it to build the design system then, switched to dev side.\n\nI exported the DS as a markdown file, fed the file to[Antigravity], and let it generate the screens straight from those rules.\n\nAnd the moment it had the system to follow, it started handing me consistent screens, one after another, all speaking the same language.\n\nWhen the screens came through, I was genuinely happy. It felt worth it. For once I was not staring at the same generic AI slop, I was looking at a real demo that actually felt like our product.\n\nAnd it saved me half the work.\n\nThe refining I usually brace myself for barely happened this time. It is still AI, so it was not perfect, nothing ever is, but it landed about ninety percent on point straight away. That last ten percent was a quick polish instead of a rebuild, and that gap is the whole difference.\n\n**Link of Softwroker product demo**\n\nI am not going to pretend it was flawless. Two things tripped me up.\n\nAntigravity reads the system, it does not photocopy it. It followed my markdown file closely, but following is not copying. The first build came out a little off.\n\nSpacing drifted, some components got broke, and it took me a couple of passes to pull the screens back in line with what the system actually said. *So the gain was real, but it was not zero effort.* It was less effort.\n\nAll the magic sits at the front.\n\nThe only reason those screens looked like a real product is that I spent the hard work building the system first.\n\nIf I had fed Antigravity a thin or messy system, it would have built me thin, messy screens just as faithfully. **The tool does not do the thinking for me**. It just makes sure the thinking I already did does not get thrown away on every prompt.\n\nFor two years the promise of AI in design was speed, and the reality was cleanup. I would generate fast, then lose all the saved time dragging everything back in line with the brand. The tool moved the work around. It never actually removed it.\n\nBuilding the system first changes the job itself.\n\nOnce the system goes in before the screens, I stop being the person fixing the AI’s guesses and start being the person directing it.\n\nMy hours go to the decisions that actually need me. How the flow should feel, where to break the pattern on purpose, which direction is right for this product and not just any product.\n\nThat is the part I am excited about.\n\nThe AI did not replace my taste. It just stopped wasting it.\n\nSo that’s it.. Thankyou !!\n\nYou can find more of my thoughts and work credibility on [LinkedIn](https://medium.com/@nishkarsh-ux/linkedin.com/in/nishkarsh-gupt381), [Instagram](https://www.instagram.com/designer_nishkarsh?igsh=OGhjdHFqZ2VlOWNk), My [portfolio](http://nishkarsh-ux.netlify.app/) .\n\nIf you would like to connect directly, feel free to reach out on WhatsApp at +91 955990461 or email me at nishkarshgupta381@gmail.com.\n\nI am always open for my readers :)\n\n[How I Design UI with Help of AI Tool, Without Ending up With Slop](https://pub.towardsai.net/how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop-592ac513286b) was originally published in [Towards AI](https://pub.towardsai.net) on Medium, where people are continuing the conversation by highlighting and responding to this story.", "url": "https://wpnews.pro/news/how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop", "canonical_source": "https://pub.towardsai.net/how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop-592ac513286b?source=rss----98111c9905da---4", "published_at": "2026-06-19 16:31:00+00:00", "updated_at": "2026-06-19 17:14:35.510815+00:00", "lang": "en", "topics": ["ai-tools", "ai-products", "generative-ai"], "entities": ["Moonchild", "Softworker"], "alternates": {"html": "https://wpnews.pro/news/how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop", "markdown": "https://wpnews.pro/news/how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop.md", "text": "https://wpnews.pro/news/how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop.txt", "jsonld": "https://wpnews.pro/news/how-i-design-ui-with-help-of-ai-tool-without-ending-up-with-slop.jsonld"}}