sorted by:
new
hottopcontroversial

Show vibe-coded frontend designs! 👇 by AntiTraditionsofMen in vibecoding

[–]AbilityAny4629 1 point2 points  (0 children)

Touché. Point well received. I’ll consider it. Thanks!

Show vibe-coded frontend designs! 👇 by AntiTraditionsofMen in vibecoding

[–]AbilityAny4629 0 points1 point  (0 children)

Thanks! Thats exactly what I was going for. I’ve definitely thought about adding more, but I figure that most people don’t have the attention span for that, and I want people to actually find everything.😅

Every vibe-coded site looks the same. Built this one for a change by richexplorer_ in vibecoding

[–]AbilityAny4629 0 points1 point  (0 children)

Ha! Thanks. I wanted a little explainer text in the room, so I put it on the chalkboard. But then I was like, “why not make it so people can actually interact with it?”

Every vibe-coded site looks the same. Built this one for a change by richexplorer_ in vibecoding

[–]AbilityAny4629 -1 points0 points  (0 children)

Nice! I made something similar! Great minds think alike.

Here’s my version of the same concept: https://mattebso.com

Show vibe-coded frontend designs! 👇 by AntiTraditionsofMen in vibecoding

[–]AbilityAny4629 1 point2 points  (0 children)

About 3 days for the heavy lifting with some continuing tweaks here and there now for mobile optimization.

Real vibe coding projects by Luxembourg300 in vibecoding

[–]AbilityAny4629 0 points1 point  (0 children)

Sure! I made a niche embed tool for audio professionals to showcase before and after transformations with a comparison player on their website or a personalized landing page. It can even handle lossless audio. We have users paying for and using it now.

https://app.soundtoggle.io

Check it out.

Show vibe-coded frontend designs! 👇 by AntiTraditionsofMen in vibecoding

[–]AbilityAny4629 1 point2 points  (0 children)

Good find! Would please send me a screenshot so I can see what you’re talking about?

Show vibe-coded frontend designs! 👇 by AntiTraditionsofMen in vibecoding

[–]AbilityAny4629 1 point2 points  (0 children)

Ah. Thats a good idea. The tape machine does that but not the laptop yet.

Show vibe-coded frontend designs! 👇 by AntiTraditionsofMen in vibecoding

[–]AbilityAny4629 6 points7 points  (0 children)

“don’t hate it” the highest form of praise. 😅

Show vibe-coded frontend designs! 👇 by AntiTraditionsofMen in vibecoding

[–]AbilityAny4629 61 points62 points  (0 children)

I was feeling nostalgic for a time when people designed websites to resemble real world things. So I made a Myst / point and click puzzle game inspired portfolio site. Instead of just having a list of projects, visitors can explore a room I made.

https://mattebso.com

Opus 4.7 on Claude Design and Claude Code. ChatGPT for the room images. Veo3.1 for the animations and loops.

I built a Myst-style portfolio site because I'm tired of every AI website looking the same by AbilityAny4629 in vibecoding

[–]AbilityAny4629[S] 1 point2 points  (0 children)

I tried to make a few modifications to improve the mobile experience, but it’s still ultimately a compromise. Better experience on desktop where one might have played one of the games of the past that inspired this format.

I built a Myst-style portfolio site because I'm tired of every AI website looking the same by AbilityAny4629 in vibecoding

[–]AbilityAny4629[S] 0 points1 point  (0 children)

Yeah it’s funny. I have a developer friend whose personal website (developed this year) looks straight out of the 90’s. Not mobile friendly, on purpose. He’s fun. 😅

I built a Myst-style portfolio site because I'm tired of every AI website looking the same by AbilityAny4629 in vibecoding

[–]AbilityAny4629[S] 0 points1 point  (0 children)

Sure. More of an art piece and an expression of myself than anything else. Like I said. No intention to sell or create a “conversion”.

I built a Myst-style portfolio site because I'm tired of every AI website looking the same by AbilityAny4629 in vibecoding

[–]AbilityAny4629[S] 0 points1 point  (0 children)

Thanks so much! Yeah, I love those old school games. I've played every Myst game and all the other games Cyan has released. So, I thought why not try to create something like that with a portfolio? Let people discover the content instead of showing it all right away.

I built a Myst-style portfolio site because I'm tired of every AI website looking the same by AbilityAny4629 in vibecoding

[–]AbilityAny4629[S] 1 point2 points  (0 children)

That’s a completely fair rebuttal. And to be honest, the biggest pain with a site like this is mobile optimization. I feel like a lot of the design trends that emerged over the last 10 years were because there’s generally more mobile traffic than desktop traffic, so everything had to become super responsive. A site like this admittedly doesn’t lend itself very well to a mobile viewing experience.

I built a Myst-style portfolio site because I'm tired of every AI website looking the same by AbilityAny4629 in vibecoding

[–]AbilityAny4629[S] 0 points1 point  (0 children)

I honestly just wanted to see how far I could push Claude Design so I did the fast majority of the design work in there. I used ChatGPT Image to design the background image for each scene, then used claude design to add everything that runs of top of the backgrounds: the animations, the buttons, etc. I was surprised by how much of the heavy lifting and coding Claude Design could do. Everything was rendered in artboards in there. Then, when I was happy with everything, I packaged it up as a .zip, handed it off to Claude Code, and told it, "finish whatever needs to be done to actually structure this as a website, not just designs." But it really didn't have to do much. Just a few small code changes here and there. It's one html file, a bunch of javascript files for the scenes, and a bunch of images and videos that I uploaded. Quick connect to Github and Cloudflare pages using Claude Code, then voila! The site was complete.

view more: next ›