I've been developing UIs using AI like Claude Code and Opus 4, but I find myself spending a lot of time fixing issues because the AI doesn't always consider visual aspects as we do. I've noticed that the AI still needs a lot of manual tweaking which can be really time-consuming. For instance, I've identified several common problems: windows that need an 'x' button, buttons that are smaller than they should be, improperly sized and centered windows, and issues with how new windows are presented. I'm looking for standard practices or resources, like a set of prompts or guidelines, that I could use to reduce the manual adjustments I have to make. Is there a way to provide image feedback to the AI or any other methods to streamline this process?
1 Answer
Consistency is key when building UIs! Having a set of rules for your styling system helps a lot. I make sure to document everything and really enforce those rules throughout the development. Tell the AI to create a component library and to double-check for existing components before making new ones, asking for your permission if needed. It's a bit tedious, but it works!
I just started building UIs myself and I'm learning to improve the design little by little. I hope there's a standard set of prompts I could just copy and paste to avoid these issues from the start rather than having to adjust them manually.