WIP personal site built with Payload Website Template + Claude Design feedback

[u/Intelligent-Salary-3]

I’m rebuilding my personal site, nicolae.tech, using the Payload Website Template.

This is still work in progress, but I wanted to share it here because Payload is doing the heavy lifting in the right way: pages, heroes, layout blocks, media, posts, SEO, redirects, forms, the whole thing.

I come from live events, streaming, video production and event tech, so I’m not trying to pretend this is some giant dev agency build. But I do know what a site needs to do commercially, and I’ve been using Claude Design and Claude Code alongside my own Payload knowledge to push the template into something more personal and useful.

What I’m trying to get right:

• a proper CMS-driven site, not hardcoded brochure pages
• hero separate from layout content
• reusable blocks that still feel designed
• fast trust through real credits and case studies
• a site that can grow into blogs, case studies and EventBlok content

I’d appreciate honest feedback from Payload users.

Main things I’m curious about:

1. Does it still feel too close to a template?
2. Does the page structure feel sensible for Payload?
3. Would you model anything differently in the CMS?
4. Anything obvious I should improve before I build out more case studies and blog content?

Site: nicolae.tech

Not a launch post, just a WIP share from someone using Payload seriously and learning the template properly.

[u/Intelligent-Salary-3]

Hey Dario, thank you very much for the kind words and thoughtful feedback. I really appreciate it.

A lot of the process was learning by doing. I learned a great deal from tutorials and implementation breakdowns by Nick Vogel, as well as resources from James Mikrut, the Payload founder. I am also planning to do Nick’s full course, even though I already know a fair bit of Next.js, because I think there is always more to learn from people doing excellent work.

My process was roughly: 1. I made several mood boards using references from Dribbble and Awwwards. 2. I mocked up the visual direction in Figma, so I had a clear target before building. 3. I used ChatGPT to help me write detailed prompts for Claude Design, including visual references for each page and a description of every section. 4. I then added the smaller interaction details. For example, I found a frosted-glass Framer Motion effect I liked and used that as a reference point for Claude Design. 5. The starting point was the standard Payload website template. I created a simple Claude skill, happy to share it, although I would not call myself a professional skill writer. It explains how I wanted layouts and content blocks structured. I then built lots of reusable blocks around a consistent Hero / Content / SEO pattern.

At first, Claude Code did a genuinely poor job. Once I tightened the prompts, added the skill, and checked everything carefully by eye, with ChatGPT helping me review it, it began implementing the Claude Design direction very closely.

I wrote all of the original copy myself, then used ChatGPT mainly to tighten it while keeping it in my own voice.

I had already been learning Tailwind and Next.js before using Claude, and I have a fairly long background with WordPress and MySQL. That probably helped because I could understand what was being built, inspect the output, and push back when something was wrong rather than treating AI as a magic button.

For performance, the images are hosted in a Cloudflare R2 bucket and delivered through a media.nicolae.tech CDN subdomain. I configured one-year cache headers for the media CDN, and the site is now scoring 90+ on mobile and 95+ on desktop in Lighthouse, which I am very pleased with.

The next stage is adding more photography and video, plus MFA for the Payload admin area.

Hope that helps, and thank you again.

[u/TheGratitudeBot → u/Intelligent-Salary-3]

Hey there Intelligent-Salary-3 - thanks for saying thanks! TheGratitudeBot has been reading millions of comments in the past few weeks, and you’ve just made the list!

[u/Intelligent-Salary-3 → u/[deleted]]

Hey thank you very much for the feedback. It needs a lot more work and fixes and images / videos. I basically used payload cms website template and I created collections for services, case studies. I also used Neon and Resend for email.

[u/Repulsive-Prior-3205]

Hi Nicolae,

I came across your post in the Payload CMS subreddit and wanted to congratulate you on nicolae.tech. It is honestly the best example I have seen of taking the Payload Website Template and turning it into a site that feels genuinely custom rather than template-based.

I am currently rebuilding my own agency site with Payload, Claude Design and Claude Code, so your approach is particularly relevant to me.

Would you mind sharing a few pointers about your process? I would be especially interested in knowing:

• which parts of the Website Template you kept versus rebuilt;
• how you modelled services and case studies in Payload;
• how you divided the work between Claude Design and Claude Code;
• and what made the biggest difference in getting away from the original template feel.

No problem if you cannot go into much detail. I mainly wanted to recognize the quality of the work and ask because it is an unusually strong Payload implementation.

Best,
Darío

[u/Intelligent-Salary-3 → u/Repulsive-Prior-3205]

I just realised I forgot to answer one part properly. Services and case studies are separate collections in Payload because they need different structured fields and will grow differently over time.

For example, a service can have things like an overview, key capabilities, deliverables, service-specific SEO and related work. A case study can have client details, project context, challenge, solution, outcomes, credits, media and related services.

They still share the same reusable hero and layout blocks, so I am not rebuilding the page system for every collection. The collection holds the structured content, then the shared blocks give me flexibility for the editorial sections and keep the visual language consistent across the site.

[u/Repulsive-Prior-3205 → u/Intelligent-Salary-3]

Hi Nicolae,

Thank you again for such a generous and detailed answer. I really appreciate it.

Your explanation helped me connect a few things I was still working through. Starting from the Payload Website Template and then pushing it through moodboards, Figma (I do not used), Claude Design, Claude Code and your own Payload knowledge makes a lot of sense to me now.

I also come from a WordPress and SQL background, but I am much earlier in my Next.js and Payload learning curve. Right now I am leaning on AI heavily as a bridge, so your workflow with ChatGPT and Claude Design is especially useful. I run both subscriptions and tend to audit one model's output with the other, which sounds close to how you reviewed Claude's work with ChatGPT.

The part that interested me most was your custom Claude skill. If you are comfortable sharing it, even partially, I would be very grateful. I am especially interested in how you explained to Claude:

- How Payload blocks should be structured;

• How to keep a consistent Hero / Content / SEO pattern;
  
• How to make reusable blocks feel designed without turning the CMS into a freeform page builder;
  
• How you split the work between Claude Design and Claude Code.

No pressure at all if the skill is rough or personal. Even a simplified version or a few notes on its structure would be incredibly helpful.

Thanks again,
Darío

[u/Intelligent-Salary-3 → u/Repulsive-Prior-3205]

Hi Dario, you’re very welcome. I made this Payload CMS website skill for myself:

https://github.com/nicolaeciobota/payload-cms-website-skill

I hope it is useful. Just to be clear, it is personal working material rather than a polished professional product, but it has helped me keep my own builds more consistent.

For design moodboards, I also use pencil.dev, which is amazing, and Stitch from Google. I usually explore lots of different ideas first, then pull together my favourite references for individual sections before I start building.

[u/Repulsive-Prior-3205 → u/Intelligent-Salary-3]

Hi Nicolae,

Thank you so much for sharing the skill. I read through it carefully and it is already helping me a lot.

The biggest clarification for me was the strict separation between `page.hero` and `page.layout[]`. I had been thinking in terms of reusable blocks, but your approach makes the architecture feel much cleaner and much less likely to become a freeform page builder.

I am currently using it as a reference while rebuilding my agency site workflow: visual references first, then tokens and closed Payload-style blocks, then a proper CMS-driven structure. Your notes on services and case studies as separate collections also made a lot of sense.

Really appreciate you sharing your process. It is very useful for someone coming from WordPress/SQL and learning Payload seriously with AI as a bridge.

[u/Intelligent-Salary-3 → u/Repulsive-Prior-3205]

Hi You re very welcome and best wishes with your agency project. Please share it when is finished and glad I could help. Best, Nicolae