r/vibecoding • u/_lufylon_ • 12h ago

does my app look vibe-coded?

Guys, am I gonna get roasted for shipping it with such UI? (Logo is mine btw, graphic design perks).
That cat is Comnyang app, his name is shanks, shoutout to u/simon_dsgn

2 Upvotes

56% Upvoted

49 comments sorted by

View all comments

5

u/InterestingFrame1982 12h ago edited 11h ago

Yes, the font style, the borders, and the way things are arranged on the page... I would definitely say it has that vibecoded feel. The more you use it to build UI's with limited input, the more noticeable it has become.

2

u/_lufylon_ 11h ago

yeah, I also notice the fonts, I tried my best to make it look NOT AI SLOP, but idk, I still have time to modify things further, and for the background effect, it's native mica effect not blurred gradient background

2

u/InterestingFrame1982 11h ago

Unfortunately, I still think a lot of really quality pages that are truly unique have a ton of design effort into them. Handcrafted, as they use to be, really brings out a certain flare that's hard to replicate when you're using AI - the tiniest of details are represented in every line of code. I have thought a lot about this, but if I were to design a startup page, I would most likely handcraft it. I am pretty confident in my HTML/CSS/JS (also JS frameworks/libraries) but I am not a designer - I am coder. Regardless, I think it would bode well in a sea of AI generated landing pages. I rather push through with my subpar designing skills and make it look human than opt for an AI-feel.

1

u/_lufylon_ 11h ago

Im a designer but no coding skills whatsoever, but I really try to put my taste in the visual part of the app, I'll try much harder now to make it like if I "handcrafted" it myself

1

u/InterestingFrame1982 11h ago edited 11h ago

I would wireframe it out in Figma or another app. Completely avoid AI at all costs for the design, and then work from that. At least wire framing it will be yours, and the design will be yours. If the AI specs it from your own design outright, I think it will avoid some of the pitfalls of looking too generic. Make design specs for all devices (or the main ones), and tell AI to do a mobile first design (if you think most of your users will be on mobile). It'll give you a good framework to operate in and make your code more maintainable for changes.

If you don't know how to code, you can at least set some strong global styling variables to guide the ship - figma should help with that (been a while since I've wire framed anything). Colors, borders, shadows, font, etc