Building a landing page for my side project was a slow and iterative process. I went into it wanting a design that would be impressive, something with a real wow factor. But that was easier said than done.
The Challenges of AI-Generated Design
ChatGPT is great for a lot of things, but designing web pages that truly look great isn't one of them. The initial suggestions were functional but lacked visual impact. I also tried Lovable.dev, which produces aesthetically pleasing designs but felt too formulaic and generic. I wanted something unique, something that told a story rather than just listing features.
I briefly considered using a template, but nothing I saw really appealed to me. In hindsight, I probably should have looked harder. That said, a good landing page doesn’t need to reinvent the wheel. It just needs to communicate clearly and convert effectively.
The Iterative Grind
Since I wasn’t starting with a solid template or design inspiration, I ended up iterating endlessly on a rough concept.
Most of the time was spent on fiddly issues:
- Responsive design testing and tweaks
- Smooth scrolling between sections
- A down arrow button to guide users through the page
- Key up/down handlers for navigation
- Managing the foreground, background, and positioning
- Picking out some nice photo backgrounds from Unsplash
- Trying to come up with some reasonable copy
The result was something that looks acceptable on every device size and orientation provided as a preset in the Chrome Dev Tools, but it doesn't look great on every device. It's a compromise.
While these elements contributed to a dynamic experience, they added complexity that probably wasn’t necessary. In retrospect, I should have asked: does this add meaningful value, or is it just making things harder? At least for the first version.
What I’d Do Differently
Looking back, I should have just kept it simple. A conventional scrolling page, without complex section transitions or extra interactions, would have saved a lot of time and frustration.
Additionally, I wish I had a clearer idea of the content from the start. The messaging, the way I present the benefits of the app, is still not where I want it to be. But at least now I have a foundation to iterate on.
Key Takeaways for Others
Don’t overcomplicate it. Fancy interactions might seem cool, but they can slow down development and introduce tricky layout issues.
If like me you’re not a designer, consider a template. Even if it doesn’t feel perfect at first, you can tweak an existing design much faster than starting from scratch. It's hard starting with a blank canvas.
Have a clear vision for your content. Design supports messaging, not the other way around. Knowing exactly what you want to say upfront makes everything easier.
Follow landing page best practices. Make sure your page has a strong headline, concise copy, clear CTA, and is mobile-friendly.
AI can help, but it won’t do it all for you. ChatGPT was great for iterating and problem-solving, but it didn’t magically produce a stunning design. Human judgment and refinement were still essential.
In hindsight, it's probably better to have one or two pages / screens worth of content. Less is more. I ended up with multiple pages though.
What Do You Think?
So what I ended up with is not that great in my opinion, but I don't want to keep iterating on it forever. It'll do for now, just like the rest of my app - which is still very much an early stage work in progress.
I’d love to hear your thoughts though! If you’ve built landing pages before, what lessons did you learn? Do you have feedback on my approach or my final result? And if you want to check out the RelayChat landing page yourself, you can find it here: RelayChat.social
Top comments (0)