People often ask me how to use AI to design products that look good and don't feel like AI slop. It'...

Tw93(@HiTw93) · 软件开发

People often ask me how to use AI to design products that look good and don't feel like AI slop. It's not an easy question, since I'm not a professional designer, so I can only share it from a product engineer's point of view: how to make products that aren't ugly and are easy to use.

First, one premise. A good-looking design can't save a product that doesn't solve a problem. Design is the icing on the cake, not what decides whether a product succeeds. If I had to rank priorities, it would be: solves a problem > easy to use > looks good. It's like food: first don't go hungry, then get enough to eat, then eat well.

I won't say much about solving the problem, since that depends on the product itself. It solves a concrete need: someone needs it, there's a real scenario for it, and your product happens to offer a way for a person or an agent to get it done. Some problems are just bigger than others.

So how do you make a product that's easy to use and not ugly? Ha, you can walk through the list below yourself, or hand the whole thing to your agent and have it review your product's codebase.

1. Pretend you're an ordinary user who knows nothing about tech. Can they get through the main flow and come out with what they need? Find every place where they get stuck, where something isn't explained, or where one step doesn't lead naturally into the next, and fix all of it, so people can use the product without a manual. Only where that's truly impossible, add a short hint.

2. Every piece of copy should read the way native speakers of that language actually talk. Choose your words carefully instead of translating flatly. Look at how Apple, Windows and well-known websites word the same thing, and aim for copy that feels simple, clear and natural to a local.

3. Where the product itself already makes something clear, don't add text to explain it. Don't over-explain. Check every line of helper text for whether it says what it means without padding, and if the interaction or the visuals already say it, don't say it again in words.

4. When you show a number, make sure people know what it refers to, and make it easy to read for what it means. Money, metrics, distance and other units each have their own best practices. Accuracy matters a lot, so don't skip validating the data to save effort.

5. Don't keep asking users to confirm something they already chose. Ask a second time only when an action can't be undone, so the screen isn't full of confirmation dialogs. Don't splash big red areas over dangerous actions either. Think about how pleasant the product feels to use. Users aren't stupid, so don't worry too much about them making mistakes.

6. Visually, keep one accent color per page. Try to avoid orange, terracotta, and the bright corporate blue of old admin dashboards. Make every gray a warm gray, never a cold blue-gray. If you can't find a good color, look through traditional Chinese colors.

7. Use as few font sizes as possible, at most four on a page. Think about the reading rhythm of the whole page, its clarity and text contrast, and make sure it meets accessibility standards. Line height, letter spacing and paragraph spacing all need repeated tuning, while the whole system stays consistent.

8. Use italics, monospace and all caps sparingly, and only with a clear reason. No italics for helper text, monospace only for code, paths and metrics, and no all-caps text in buttons or labels. Go easy on joining things with a middle dot (·). Use one verb for one action across the whole product, and avoid verbs that push people to act, like the marketing-style "Buy now".

9. Keep buttons, spacing, corner radius, dividers, dialogs, animation and shadows consistent and restrained, so they don't get in the user's way. Nested rounded corners should be concentric: the inner radius equals the outer radius minus the padding between them, and it looks better. Pages are flat by default: no stacked shadows, no glow, no frosted glass. Shadows are only for dialogs that really float above the page, and no cards inside cards.

10. In a multilingual product, lay things out for the longest translation first, and put meaning before looks rather than changing what the text says to make it fit. You can rewrite the copy, but don't change the font size or truncate it. Check that everything displays well at different sizes on the devices your users actually use, test them all, and fix everything that looks off.

11. For a design you keep tweaking without getting it right, or one that still looks off after many rounds, ask your agent for the three options it thinks are best and pick one, then tell it to keep refining until you're happy. I like having AI put before-and-after images into one PDF, which makes comparing them much easier for me.

That's about it. One more thing matters a lot, though: your own patience and willingness to keep iterating. I'm a bit of a perfectionist, and I often go a dozen rounds with AI over a single line of copy, a color or a design until I'm happy with it. AI is smart, but you often need to ask more of it, and put in more time and patience to get a result you like. Or put another way, spend more time and look at more good design, and you can build products that are easy to use and not ugly.
💬3🔄1❤️28👀3414📊12

查看原文