The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
🚀 My #WonderChallenge Submission
For this challenge, I decided to redesign something that's often the hardest project for any designer my own portfolio.
Instead of starting with a blank canvas, I used AI as a creative partner throughout the process. I combined ChatGPT for content and structure, Lovable to rapidly prototype and build the landing page, and my design expertise to refine every detail—from typography and spacing to visual hierarchy and user experience.
The goal wasn't just to create a beautiful website. It was to build a landing page that clearly communicates who I am, what I do, and the value I bring to clients.
This project reminded me that AI doesn't replace creativity it accelerates it. The best results still come from combining technology with human judgment, strategy, and thoughtful design.
I'd love to hear your feedback. What would you improve?
#WonderChallenge #Lovable #BuildWithAI #AI #WebDesign #LandingPage #BrandIdentity #GraphicDesign #Figma #UIDesign #CreativeAI #PortfolioDesign
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Hello everyone!
You might recognize me from the unique faceless avatar pfp, so with this submission, I wanted to find ways to make the faceless avatars series more accessible for everyone.
Wonder chat has helped me execute the foundations for a faceless avatar studio where I can reuse various poses, hairstyles, accessories like hats and glasses, thanks to the vector models of arrow 1.1 max and the friendly interface of Wonder.
After generating various vectors, the illustrations were close to the style so the refinement and improvements were minimal.
I then focused on building the UI prototype, with the help of Wonder chat, where it further helped me discover new concepts on how to visualize this.
Final demo of v0.1 was then built with an MCP connection of Claude code and soon to be live for everyone to use!
Check out the design process from Wonder here: https://app.wonder.so/thoroughly-peaceful-imp/files/019f38df-c790-7860-a31a-571472e3b60c
The faceless avatar studio sounds intriguing; how do you plan to expand the range of accessories in future updates?
✨ Introducing WonderPane for the wonder.design × Contra Hackathon ✨
WonderPane is a Quick way to showcase your Designs. It help designers, creators, and builders turn images into polished visuals quickly without over complex tools.
If its easy and fast - its WonderPane.
Try WonderPane: https://wonderpane.vercel.app/
WonderPane Project: https://app.wonder.so/abhicontra/files/019f26cf-bce7-759c-a3cb-519235814ca0
Try Wonder app : https://wonder.design/
100 % built in wonder app.
❓How Wonder.design used? ✨
➡️ Wonder generated Assets
➡️ Most powerful Wonder UI properties editing feature ready for rapid tuning
➡️ Wonder chat the key for fast development
➡️ Wonder itself a complete one stop package.
I use it as a design playground for UI/UX presentation work — uploading a design, adjusting padding, radius, scale, rotation, shadows, window styles, and background colors until the mockup feels ready to share.
It’s helpful because mockup generation is usually too slow or too heavy. WonderPane keeps it fast, clean, and focused: upload, style, randomize, download.
Built for anyone who wants beautiful design previews without opening a full design suite.
Excited to share this as part of the wonder.design × Contra Hackathon 🚀
#wonderchallenge #webdev #DesignTools #web
Wonder Shader Lab - This is my submission for Wonder Challenge.
I made this project because I really love shader effects in Wonder and I was struggling to find and use this feature at first.
Shaders are powerful but somewhat hidden, so I created Wonder Shader Lab, a curated gallery that shows a list of cool shader effects you can use in website design.
I counted 95 main categories of shader effects, with each category having 2 to 6 or 8 different variations. The page includes live examples and simple instructions on how to apply shaders as background and text effects.
Built entirely in Wonder to help other creators quickly discover and use these amazing features.
Wonder File Link: https://app.wonder.so/zeng/files/019f34ef-5599-7c55-9858-ec5d63972f18
I include steps on how to add Shader to background, text and SVG here:https://x.com/zeng_wt/status/2074309904668463312?s=20
Made with Wonder by Zeng.💜
95 categories is a serious amount of cataloging, that alone is a useful reference even without the Wonder file. Do you plan on keeping the gallery updated as new shader types get added, or is this more of a snapshot?
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
fifaworldcup2026
The World Cup is here and the whole world's watching. How are you designing for the world stage?
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?