# Low Score on the Checklist? Fix These First You used the [Production Readiness Checklist](https://horizonx.so/resources/vibe-coding-ui-production-readiness) and got a low score. This guide tells you what to fix first, and gives you a ready message to send to your AI agent for each problem. Made by [HorizonX](https://horizonx.so/), a library of UI kits, components and templates for people who build with AI. You can copy the requests, templates and checklists in this guide into your own projects, including client work and paid work. Please do not republish the whole guide. Link to it instead. ## First, don't panic The checklist has 15 checks. Each one gets 0, 1 or 2 points, and the total becomes a score out of 100. A low score on a first version is normal. The goal is not 100 today. The goal is to fix the problems that hurt real people the most. ## The order to fix things Fix in this order. Problems at the top stop people from using your product. Problems at the bottom make it feel less polished. 1. **People cannot do the main task.** (Keyboard, touch, broken layout on phones.) 2. **People do not understand what to do.** (Main action, labels, errors.) 3. **People do not trust it.** (Hidden costs, unclear data use.) 4. **It looks unfinished.** (Missing states, inconsistent spacing.) 5. **It feels slow.** (Speed and layout jumps.) ## Fix 1: It breaks on a phone **Signs:** text is cut off, you can scroll sideways, buttons overlap. **Send this to your agent:** > At 375 pixels wide, the page scrolls sideways and [describe what is cut off]. Fix the layout so nothing is wider than the screen. Do not change the desktop design. Show me screenshots at 375 and 1440 pixels wide. ## Fix 2: Buttons are too small to tap **Signs:** on a phone, you tap the wrong thing, or need two tries. **Send this:** > On phones, make every button and link at least 44 by 44 pixels, with at least 8 pixels between them. Do not change how they look on desktop. ## Fix 3: You cannot use it with a keyboard **Signs:** press Tab again and again. You cannot see where you are, or you get stuck. **Send this:** > When I press Tab, I cannot see which element is selected. Add a clear focus ring to every button, link and input. Make sure I can reach and use every control with Tab, Enter, Space and the arrow keys. ## Fix 4: It is not clear what to do **Signs:** someone new looks at the screen and does not know what to click first. **Send this:** > This screen has [number] buttons that look equally important. Keep [name of main button] as the only primary button. Make the others secondary (outline or text style). ## Fix 5: Buttons and errors are vague **Signs:** buttons say "Submit" or "OK". Errors say "Something went wrong". **Send this:** > Rewrite button labels so they say what happens, for example "Send message" instead of "Submit". Rewrite error messages so they say what went wrong and how to fix it, for example "This email is missing an @". ## Fix 6: Color is the only signal **Signs:** an error is shown only by a red border. Someone who cannot see red will miss it. **Send this:** > Every error, success and selected state must also use text or an icon, not only color. Check that all text has enough contrast with its background (at least 4.5 to 1 for normal text). ## Fix 7: Missing states **Signs:** a list with no data shows a blank space. A button does nothing visible while loading. **Send this:** > Add these states: an empty state for [list name] with a short message and a button, a loading state for [button name] that prevents double clicks, and an error state if the request fails. ## Fix 8: Users can lose work by accident **Signs:** "Delete" works with one click and cannot be undone. **Send this:** > Before deleting, show a short confirmation that says exactly what will be deleted. If possible, add an "Undo" option for a few seconds after. ## Fix 9: Trust problems **Signs:** prices appear only at checkout, fake countdown timers, unclear what happens to personal data. **Send this:** > Show the full price before checkout. Remove [timer / fake activity message]. Add one short sentence near the form that says what we do with the user's data. ## Fix 10: Spacing and styles are all different **Signs:** every card has a slightly different gap, three shades of the same blue. **Send this:** > Create a short list of spacing, color and corner-radius values, then replace every one-off value on this page with one from the list. Show me the list first. ## Fix 11: It is slow or jumps while loading **Signs:** the page takes long to show. Text moves when images load. **Send this:** > Give every image a fixed width and height so the page does not move while loading. Compress large images. Tell me which files are the biggest. ## After you fix Run the checklist again. Check one score only after you have tested it yourself, on a real phone if possible. A fix the agent says it made is not a fix until you see it. ## Next steps - [Production Readiness Checklist](https://horizonx.so/resources/vibe-coding-ui-production-readiness) - [What Changes on a Phone?](https://horizonx.so/resources/what-changes-on-a-phone) - [Every State of a Button](https://horizonx.so/resources/every-state-of-a-button)