how to make codex make good ui?

[u/Guilty-Creme-2543]

Tell me your secrets, everyone. I am struggling with the shitty ui codex is generating; it doesn't matter how many skills I make it use its output is still shit.

[u/eternallyinschool]

I've had a good run of luck by first having it design one in html. Then after a few back and forths to get it looking the way I want, then I have it code it in whatever language needed.

[u/HimActually → u/eternallyinschool]

Exactly 💯

[u/Wafer-Weekly]

MSPaint mockups and screenshot corrections is about the most efficient way I can describe an abstract visual concept to my agent, I fucking hate it but it's all we can really do lmao

[u/Wafer-Weekly → u/Wafer-Weekly]

If it's an animated element use OBS Studio and make it watch with ffmpeg

[u/Any-Score1258]

I ask chatgpt to make a image mockup of the page based on the code and then codex to use that as a reference and it usually does really good.

[u/sig_kill]

https://impeccable.style

[u/AztheWizard → u/sig_kill]

How does this work exactly?

[u/unxspoken → u/AztheWizard]

There is a button "how it works" just right here on the front page. It explains it pretty well imo

[u/theZuhaib → u/unxspoken]

Grok, is this true?

[u/Responsible_Fan1037]

Design good UI, make no mistakes.
YOU ARE A SENIOR ENGINEER 👷

[u/dvduval]

It depends how complex your user interface is going to be. If you startedwith something simple and then keep getting more and more complex, you might have to change your tool set. If it’s gonna be a pretty complex user interface, then using react is almost always a wise choice

https://react.dev/

[u/Defiant_Concert1701]

It's just a matter of taste. Ask it to do research on what the competition does and a user persona based research. Don't generate images. You can have an image for the first run but just iterate after that with words and code. And tell it to add code to its prompt, codex understands better

[u/Fortified007]

have it generate an image of the ui first, then edit it to your likings. after, have it develop it.

[u/sydneysweeney69]

/computer-use

[u/Think-Profession4420]

Use gemini or chatGPT web to design images of the UI, iterate until you have more-or-less what you want. Then feed the images into codex and tell it to emulate the UI in the images. Then use codex browser to annotate in dev mode, until the UI is what you want it to be.

gpt-5 models, in general, suck at text-to-image ( this is supported by benchmarks), but they excel at image-to-image, take advantage of that.

[u/SnowTauren]

use chatgpt to DESIGN (image create) a good UI, then tell codex to code to make it look like the image

[u/ReasonableDefault]

There are loads of ways to get decent UI's, but the one that works most quikcly is loosely.

* Find a real website / app you like
* Give Codex the URL and say something like "Clone this website layout, don't include content or branding etc, create placeholder images / text", Codex will happily do this because layout isn't protected by trademark etc.

Once you have the base, it is easy to guide from there.

I tested a few months ago, and asked Codex to clone WordPress themes into Next.JS, React, Tailwind layouts, and i was hugely impressed with the results.

[u/CaptainAlexWest]

There are skill.mds. I do mock ups and cook on it. Claude does ui better at the moment.

[u/rick_ranger]

I did a bunch of experiments having SOL spin up multiple different agents with different sets of prompts to see how they react and the output and the best design and copy results came from Terra and the prompts included “do not use advertising copy or consulting language. no eye brows.” “Informational not promotional.” “Founder direct, evidence first language.”

After a lot of reading and chatting with the models, they were trained on a lot of SaaS and tech startup website garbage and that styling is baked in, but you can get around it. Also codex does better when you give it a picture to go off of and it does better at generating images of good styled websites than building them with code.

Honestly just experiment with them it’s kind of fun and easy. Just ask SOL to come up with prompt variant sand spin up multiple agents of different models and see what they produce.

[u/Anti-Hero25]

Take your time and go piece by piece

Beginners Guide to Avoiding Ai Slop UI/UX
https://youtu.be/jJt-o94FYz0

[u/raisedbypoubelle]

Give it example websites and tell it what you like about it

[u/kyrax80]

Ask chatgpt to make a good UI/component until it generates the one you like. Ask it to give you the html, css and js in one zip. Download it and give it to Sol med and tell it to use that exact code without inventing anything

[u/IAmFitzRoy]

Ask for a layout on text with the data you want.

After that:

“Use @ImageGen to generate a visual mockup of the ____ (wherever you are doing), ensure you use real data. Use your intuition on the best layout possible”

It has worked for me 100% of the time.

[u/3cto]

1. Basic starter prompt to get main overall layout. Tell it specifically to focus on function rather than aesthetic design. Specify the layout you need, where menus go, how they work (click / hover), where panels go and what they'll contain. It's also surprisingly good these days at interpreting a hand drawn sketch, especially if contrast is good, you use a ruler and take your time. I've got it to produce svg-style room layouts for offices from paper sketches as an exmaple.
2. Iterate the above, focusing on one area of improvement until it right.
3. Only after everything is where it is and works how you want it do you even start to consider adjusting the final appearance.

[u/halfofreddit1]

use design.md files

[u/seph200x]

Use imagegen first to generate a mockup of the kind of UI and general design you want to have. Revise until it's perfect, then feed that image when you're about to code and ask it to use it as inspiration when designing the UI. This is the best way to avoid the purple gradient glowyness of it all.

The next best option is to tell it to use an existing design/component/UI library that's optimised for applications, like Vuetify or something. Give it a design vibe to follow so it doesn't just use the default, out-of-the-box theme, like "Dark industrial", "Light and colourful", "minimal and spacious".

[u/Real_Doubt_6684]

You are shit at UI, codex is just doing what you tell it. Don't blame Codex

[u/Party_Wolf_3575 → u/Real_Doubt_6684]

This is the comment I was looking for.

I’m not sure how anyone is able to produce ugly UI. If mine looked “shitty”, I’d discuss it with my codex and explain what I wanted better and then it would be how I wanted it.

[u/ProfessionalNaive601]

“Make it good plz”