Induction: Ecommerce Foundations

This week I worked on designing and building the first version of a responsive e-commerce website for a UK-based performance cycling brand. The brand is aimed at men aged 30–55 who are serious about cycling and care about performance, quality, comfort and reliability. Because the products are higher-value purchases, I focused on making the site feel clear, trustworthy and easy to use rather than just making it look visually impressive.

I started by looking at the customer in more detail. I thought about how they would shop, what information they would need before buying, and what could stop them from completing a purchase. This helped me realise that the site needed strong product information, clear pricing, good images, reviews, filters and a smooth user journey. A customer buying performance cycling products is unlikely to rush into a purchase, so the website needed to support comparison and research properly.

After that, I planned the main structure of the site. I mapped out the key sections, including bikes, clothing, accessories, new in, parts and wheels. I also planned the role of each page: the homepage needed to quickly communicate the brand and guide users into the site, the category page needed to make browsing and comparing products simple, and the product page needed to give enough detail to help the customer feel confident buying. I then created wireframes for these pages so I had a clear layout before building anything.

A big part of the week was learning how to write better AI prompts. I created prompts for the homepage, category page and product page, then improved them by adding clearer context, objectives, constraints and output requirements. This made the AI output much more useful because it understood the brand, the target customer and the purpose of each page more clearly. I focused on things like mobile optimisation, fast load times, simple navigation, product filters, image galleries, reviews, size options and add-to-basket features.

I then used this planning to build the first version of the website, which I named True Cadence. The site included a homepage with a strong hero image and clear calls to action, category sections for the main product areas, product listing pages with filters, and a detailed product page with images, pricing, sizing, delivery information and product details. The aim was to make the website feel premium but still practical, so the customer could move through it easily without feeling overwhelmed.

One thing I learned this week is that planning the user journey first makes the design process much easier. I also realised that AI works best when the prompt is specific rather than vague. My first results were not exactly what I wanted, but once I gave clearer instructions and examples, the output improved a lot. I also fixed an issue where the website did not anchor back to the top of the page when clicking around. Next time, I would still use example websites for inspiration, but I would be clearer that the AI should use them as a guide rather than copying parts too closely.