r/vibecoding by u/VoxCraft20231 376 894mo ago How to Vibe Code beautiful UI (some tricks after shipping 10+ apps) Hey vibe coders,
Let’s be honest… AI-generated UI is kind of ugly right now.
It all looks exactly the same. It has that heavy "AI feel"—the inevitable purple/blue color scheme. You can spot it from a mile away.
I have built over 10 apps entirely with AI recently. In the beginning, this really frustrated me. I loved how fast the coding was, but I hated that my projects looked like soulless templates. But after a lot of trial and error, I summarized a few tricks that actually help break out of that generic loop. I wanted to share them here:
**1. Don't start with text—use Excalidraw**
When you just type "make a landing page or dashboard," the AI guesses too much.
Instead, I use Excalidraw to sketch a quick wireframe. I draw the boxes, where the buttons go, and where the images should sit. Then I export that image, give it to the AI, and say: "Follow this structure exactly."
**2. Use screenshots as reference**
AI is really good at copying, but bad at imagining.
Don't just say "make it look clean." Go to sites like Dribbble, Mobbin or find a real website that looks great.
Take a screenshot of the specific part you like (like a navigation bar or a pricing card). Paste it into t
View parsed comments (up to 89)Open on Reddit r/ClaudeAI by u/itsnotatumour 2,751 6261y ago I blew $417 on Claude Code to build a word game. Here's the brutal truth. Alright, so a few weeks ago ago I had this idea for a Scrabble-style game and thought "why not try one of these fancy AI coding assistants?" Fast forward through a sh\*t ton of prompting, $417 in Claude credits, and enough coffee to kill a small horse, I've finally got a working game called LetterLinks: [https://playletterlinks.com/](https://playletterlinks.com/)
**The actual game (if you care)**
It's basically my take on Scrabble/Wordle with daily challenges:
\- Place letter tiles on a board
\- Form words, get points
\- Daily themes and bonus challenges
\- Leaderboards to flex on strangers
**The Good Parts (there were some)**
*Actually nailed the implementation*
I literally started with "make me a scrabble-like game" and somehow Claude understood what I meant. No mockups, no wireframes, just me saying "make the board purple" or "I need a timer" and it spitting out working code. Not gonna lie, that part was pretty sick.
Once I described a feature I wanted - like skill levels that show progress - Claude would run with it.
Ultimately I think the finished result is pretty slick, and while there are some bugs, I'm proud of what Claude and I did together.
*
View parsed comments (up to 626)Open on Reddit r/UXDesign by u/HapaPappa 129 1434mo ago After 20+ years as a product designer, I’m abandoning design software… In the last two weeks I’ve designed and built 3 apps (1 mobile and 2 web apps) basically all in cursor. My entire career has been designing in pixels/vectors, but AI has just made it way too easy to design directly in code for the first time.
I have been shocked and blown away by the speed at which I can design and create interfaces by not using Figma. By starting your concept in the code and then shaping it to the way you want you’re working with a collaborator that thinks about the small UI patterns that are universal and standard and does them effortlessly. Small touches like adding the right icon to tabs when you didn’t ask it to feel magical and then there’s the big layout solutions that you can briefly describe and you can come up with a starting point.
My team was drowning in PRT‘s and a complex design system for a large sass app that we’re building. We were making extremely complex prototypes to try to communicate to the front and engineers how things should be built and what the interaction should be like. But recently we have started doing these explorations directly in the code and essentially vibecoding the design, so we can see variations and test interactions in rea
View parsed comments (up to 143)Open on Reddit r/UXDesign by u/DontGoRaga 107 10516d ago Encouraged to go "all-in" on AI...now being put on an extreme token diet. For the last year or so, my company has highly encouraged everyone to explore ways to use AI to enhance and accelerate their processes. My UX colleagues and I dove in head first. In just six or seven months, we've gone from doing all of our designs in Figma to building rich, complex, interactive prototypes using natural language and AI. We've also built our own internal tooling and systems to support this work. It's been an exciting time. Vibe-prototyping has allowed us to explore workflows and functionality in a much deeper way than we ever could with Figma. It's also greatly enhanced our ability to communicate and collaborate with product managers and engineering. It's no exaggeration to say it has increased my productivity by 10x or more.
However, just this week, management let us know that, due to pricing changes with GitHub Co-Pilot, we will all be put on a fairly severe diet of tokens for our AI-assisted work starting next week. I did some testing today to see how this might affect my work. Even after optimizing my prompting and choosing a very lightweight model, I still burned through 20% of my monthly token budget in just two hours.
This has me really worried. Going back
View parsed comments (up to 105)Open on Reddit r/Frontend by u/teddarific 52 712y ago Does anyone actually use AI tools in their workflow? Been seeing a lot of AI tools in the frontend space lately, but can't tell if they are mainly just excitement or legitimately useful. I've tried them out, but haven't quite figured out a way to make them useful for my daily workflow.
Some example tools I've seen & tried recently:
\- [tldraw's MakeItReal](https://github.com/tldraw/make-real)
\- [Vercel's v0](https://v0.dev/)
\- [Galileo](https://www.usegalileo.ai/explore)
\- [Picoapps: Screenshot to Code](https://picoapps.xyz/free-tools/screenshot-to-code)
I'm always looking for ways to make engineering & design work faster for myself, so was wondering if anyone has actually added any (or other) of these AI tools to their daily workflow.
View parsed comments (up to 71)Open on Reddit r/Entrepreneur by u/Ok_Physics_4154 0 861mo ago Is there really an AI tool that can make a fully functioning app without taking their subscription? In case anyone knows how to do that let me know. Any ideas welcome. My objective is to create an app but I don't want to put in any money before I even get started. Most of these AI tools have limited functionality so looks like it can't be done?
View parsed comments (up to 86)Open on Reddit r/startups by u/IVBIVB 0 511mo ago Find an AI-video generator from an image that doesn't suck? I will not promote We have our product launch in a few weeks omg this has been painful :-). It's a B2B mostly. Humanization is part of the branding, and we've given our product a human name and had chatGPT create an image. I want to create a 10ish second video basically saying "Hi I'm <name>, and <rest of script>".
I've tried HeyGen and D-ID but neither seem very natural. Very Max Headroom for the GenX amongst us. I used the free version but supposedly the paid tiers are just longer video limits, but the video itself is the same quality.
Anyone find an AI tool to do stuff like this that doesn't need an enterprise subscription? I'd be willing to spend ($50?)/month, but nothing giant. We'd expand our usage of it, but if it can't get a 10 second video right I have no hope for a 60 second bit.
View parsed comments (up to 5)Open on Reddit r/startups by u/Abdo_1998 3 371mo ago Are you still hiring designers? or are you replacing them with AI Tools? I need founders perspectives here i will not promote So whenever this topic gets shown up in designers forums and subreddits, everyone starts to get defensive and start to explain that design tools cannot replace designers. But in the meantime, you see companies do massive layoffs. The role of software engineers and designers is being done better with AI tools.
I am a product and a UX designer myself, so I don't know if I should continue in this field or should I maybe move into something like product management or something. really confused here and would to get founders perspective on designers specifically. if AI tools are not good enough now. they will definitely be good enough in a matter of 4-5 years. do you still need a human designer in your company?.
Are you fine generating UX and UI with the AI tools right now or is the value of a UX and UI designers still there. I need to know these perspectives so i can make a career decision here, and i have to ask about freelancing as well. would you still hire a ux and ui designer to design an app and then send it to a developer to code it for you? or you can just use claude code and do it yourself instead?.
I am open for discussion, need some direction here. appreciate your feedbac
View parsed comments (up to 37)Open on Reddit r/Entrepreneur by u/jahanzeb_110 1 210mo ago My New Approach to Building Clean No-Code Apps (And Without Winging It) I run a product development agency. Most of the clients I get are people looking to validate their ideas and what almost 90% of them do is: **Skip Designs**
While speed to market is essential, a well thought out user journey and UI to complement will make your product 10 times better
What most people do is, they have an idea, they start building it themselves, either with bubble or now with any of the AI code editors (Cursor, lovable, bolt etc.)
They hit a brick wall and now want someone to help them complete the product. Since the user journey is not documented, they end up with a broken product that no one wants to use.
I have a different approach to building products. It used to be a 3-week design sprint, but now it takes me hardly a few hours to completely design a prototype that I couldn't make even if I spent months on Figma
Here’s what I do differently:
* I use Chatgpt to write me a PRD and scope out all the features needed for the product to run
* I then design pages with v0 dev, each screen from profile pages to heavy dashboards, I insert dummy data into the designs
* I then replicate it in bubble or import it in cursor (depends on which tech stack we're using
View parsed comments (up to 2)Open on Reddit r/Frontend by u/Ausbel12 18 361y ago AI tools for front-end workflows—worth trying or just hype? Lately, I’ve seen a surge in AI tools that claim to speed up everything from layout generation to component design and even bug fixing. Some even say they can build out full landing pages with minimal input.
I’m curious—has anyone here actually integrated AI into their front-end workflow in a meaningful way? Did it save you time, or did you end up rewriting everything anyway?
Would love to hear what’s actually useful vs. what’s just marketing fluff.
View parsed comments (up to 36)Open on Reddit r/UXDesign by u/Equivalent-Phrase185 0 384mo ago Is anyone still directly using Figma for all designing? If not what AI tools are best for your workflow? I feel like many AI tools can pop out full and detailed wireframes within minutes that I would otherwise spend hours trying to perfect in figma. What tools are you guys using to use UX principles to come up with near-instant UI designs? Thanks.
View parsed comments (up to 38)Open on Reddit r/Frontend by u/pee_pee_poo_poo_24 0 391mo ago How do you avoid the generic AI slop look when shipping frontend with Cursor/Claude Code? I ship using Cursor and Claude Code. The code works, the features works, it looks great on screen, but things sometimes don't feel right and me not being able to be deduce what exactly it is because I'm still new to frontend designing.
I am able to correct visually big issues like contrast issues or opacity level mismatch and corrects it one by one.
But things break in weirder places too when examined properly:
* Modals opening and closing in janky ways
* Mobile UI breaking at awkward breakpoints
* Subtle interaction issues a professional designer would catch in 2 seconds but I miss entirely
I've tried->
1.Using Claude skills- helps to polish further but still leads to some unnoticeable issues which i cant point towards but i can feel subconsciously.
2.Eyeballing- slow and required practice and knowledge in this field.
3 Asking the agent to review its own work- mostly useless as it hallucinates with its own work.
How do you avoid the generic AI slop look, are there any other AI or deterministic tools that you specifically use that I haven't mentioned that do work?
View parsed comments (up to 39)Open on Reddit r/SoftwareEngineering by u/SuspiciousPavement 14 101y ago Software writing process is so smooth these days! I'm a senior software engineer with 10+ years experience and I just started building a new application and I picked Spring boot and Next.js for my stack.
Everything is so smooth really these days, here's some of the problems I've faced and how I solved them:
- First and foremost any boilerplate I need to write, chatGPT 4o or github copilot writes it for me, things such as open api specs, class entities, database schema with a little supervision is written by AI
- There's not a thing I want to do that hasn't been tackled and solved by other people. You just need to spend a little bit of time to find libraries that are well maintained. Going on reddit for personal awful experiences of people with libraries as well (Next auth, I see you 👀) helps select the best tool for the job really.
- Bugs of libraries? Stack overflow has 99% of the problems people have faced already. I only needed to open an issue on GitHub for 1 Library and thankfully it was solved in the next release.
- parameterization of libraries? Every library has well maintained docs mostly these days and examples
- I've only need to look at the source code of a few libraries to do the thing I needed
- In my case tools su
View parsed comments (up to 10)Open on Reddit r/smallbusiness by u/Silly_Badger_3422 0 1323d ago Receipt / Expense Tools still SUCK! I had a discovery call with an accounting firm recently - a family firm that’s been around for decades - and the accountant told me that some clients hand over their bank logins so the accountant can go and download statements himself.
Not because he wants to. Because the workflow still breaks before the software ever gets the data.That feels mad to me.
The most expensive, least available person in the chain - the accountant - is still being pulled into basic data-gathering work that the software was supposed to eliminate.
It struck me.. **most receipt and expense tools are still pull tools.**
They wait for you to:
* remember the receipt exists
* forward the email
* snap the photo
* upload the PDF
* explain what it was for
* match it to the bank feed
* tell your accountant six months later why you bought it
>That is like buying a dishwasher that still makes you rinse every plate, scrape the food off, and load everything in a precise order. At some point, the machine is not really doing the job. It is just moving the work somewhere else.
**The receipt problem is not just storage. It is context.**
A card statement might show that money left the account, but it usually does no
View parsed comments (up to 13)Open on Reddit r/Frontend by u/purvigupta03 0 92mo ago Best AI tools for building a frontend project as a beginner? Hi, I’m a beginner working on a frontend website using HTML, CSS, JavaScript, Bootstrap, Sass and some API integration.
I tried building everything manually, but it’s taking a lot of time and I feel like I might fall behind if I don’t use AI tools properly.
Can you suggest: • beginner-friendly AI tools for UI design, code generation, and API integration
• tools that actually help in real projects (not just demos)
Also: • which AI tools are best to start with?
• should I rely fully on AI or just use it for support?
• any simple workflow using AI for frontend projects?
Looking for honest advice. Thanks!
View parsed comments (up to 9)Open on Reddit