I built this amazing Shopify website from scratch using nothing but Claude

And it was… a massive waste of time.

 

Claude Shopify website design

Over the last few weeks I’ve been seeing posts all over Instagram about how AI is making web designers redundant and how you can get Claude to redesign your Shopify store in minutes and launch it with one click. Which to me sound rather worrying because I happen to be a web designer myself.

So I thought I’d test Claude out and see if it is coming for my job any time soon and also to check how fast I can build an online store for my would-be cosmetic brand with this tool.

Like most web designers, I of course rely quite heavily on AI to make my job easier and faster so I’m not opposed to the idea of Claude helping the process even further. But I wanted to test it for myself first.

I set out with a goal of building a beautiful, animated website which would be fully integrated with the Shopify backend. The design process itself was actually brilliant, as the homepage mockup created by Claude in minutes was high quality, matched my spec perfectly and would normally take me hours to design. So far so good.

claude website mockup

Interestingly, although very pretty and perfect from the point of UX, the design wasn’t optimised for sales and didn’t include elements which could drive potential sales, like including social proof, trust signals, or different types of photos. This is something I’m able to spot and correct as a professional web designer but the average brand owner who is just trying to build their first Shopify store and save some money on web design, I’m sure I’d just follow the advice of AI who I’d assume knows more than me.

Claude develops my Shopify website

The next hurdle is the issue of moving my design into my Shopify test store somehow. By Claude’s own admission, there isn’t a ‘one click solution’ available, you need to get the code created by Claude and copy and paste it bit by bit into the Shopify backend. And it’s not a straightforward process of grabbing the whole page design and putting it on the website.

The first choice is whether to have Claude create the code from scratch or use the free Dawn theme as the foundations to put everything on (which is strongly recommended).

The next step is to update the liquid code created by Claude section by section, like the CSS stylesheet, page sections or the main liquid file. Claude will provide instructions on how to do that but, unless you’re quite familiar with the Shopify backend and editing code, it’s neither straightforward nor fast!

Shopify backend

Where things go wrong

The next part is where is where the whole concept of designing with AI falls apart for me. The code created by Claude is far from ‘plug in and play’. You upload it to your website and only then discover that it leaves too much empty space or that the font size is not screen responsive. From there, the process feels a lot like training an intern on their first day to perform the most basic tasks in your job. The dialogue goes something like this:

Me: Claude, this text is barely readable, can you increase text by about 30%

Claude: Do you want to increase just the headers or all text?

Me: If you make the headers bigger but leave the body the same, it will look off. You have to increase everything.

Claude: Okay, here’s the new code for you to paste into every single section we spent the last 3 hours creating.

Ugh.

Then, you need to take your AI intern by the hand and create the elements you know are missing from his design entirely. In all fairness, Claude does a great job predicting your design needs, intuitively making new sections which perfectly fit the rest of the design. It even added animations here and there because I indicated I want the website to be interactive, without me having to prompt that expressly.

The result, as you can see, is a beautiful website which makes me want to purchase this product doesn’t even exist. Was it quick and easy? Not one bit. If I were a Shopify brand owner, I would be much better served getting a premium (or even a free theme) from the Shopify store and customise it to my brand. If your vision isn’t super specific yet or aren’t too fussed about particular details you’d want on the website, you can achieve a functioning Shopify store like this in just a few hours.

shopify website created by Claude

As a web designer, I won’t be losing sleep worrying about Claude replacing me any time soon. But I will be using it in my own design process going forward!

Pin It on Pinterest

Share This

Share this post with your friends!