eCommerce web design built around the product page and the checkout
Homepages get the attention in design reviews and almost never get the traffic. Most of your revenue is decided on a product page reached from a search result and a checkout that either gets out of the way or does not.
What is eCommerce web design?
eCommerce Web Design is the design of an online store with the product page and checkout treated as the primary surfaces. It covers category and search design, product page structure, cart and checkout flow, and post purchase screens. It is platform agnostic, suiting Australian retailers on Shopify, WooCommerce or a custom build.
Get a fixed written quote- Typical timeline
- 5 to 9 weeks
- What drives cost
- The number of distinct product types and templates, whether the checkout can be modified on your platform, how much evidence work is needed up front.
- Best for
- Retailers whose traffic is fine and whose conversion rate is not
- You own
- Design files, the component library and all source assets
- Built with
- Figma, real product data, checkout flow mapping, WCAG 2.2 AA
Your handover
The product page is the store
For most Australian stores, the majority of sessions that end in a sale include a product page, and a large share of them arrive there directly from search or an ad without seeing the homepage at all. That page has to do the work of a good salesperson: show the item clearly, answer the questions a buyer would ask, remove the doubts that stop a purchase and make the next step obvious.
- 01Evidence review of analytics, search terms and funnel drop off
- 02Category taxonomy and filter specification
- 03Product page design with objection ordered content blocks
- 04Cart and checkout flow with every field justified
- 05Mobile-first designs for every commerce template
- 06Post purchase, tracking and returns screen designs
- Component library with all interaction states
- Accessibility annotations to WCAG 2.2 AA
- Developer handover pack and walkthrough
The doubts are consistent across categories
The doubts are consistent across categories. Will it fit or suit my situation. What is it actually made of. When will it arrive, specifically, at my postcode. What happens if it is wrong. Is this seller real. Most product pages answer the first question with photos and leave the rest to a shipping page linked in the footer. Designing the page so those answers are present at the point of hesitation, rather than a click away, is the single highest return change we make on most stores.
- Imagery covering scale, detail, texture and the product in real use
- Variant selection that shows availability before the customer commits
- Delivery estimate by postcode, shown on the page rather than at checkout
- Returns terms visible where the buyer hesitates, not in the footer
- Specifications formatted for scanning rather than as a paragraph
- Reviews and questions placed near the decision, not at the very bottom
Shipping options state a date rather than a service name, because nobody knows what a service code means.
Checkout design: every field has a cost
Cart abandonment gets discussed as a mystery and is usually a list of specific, fixable frictions. Costs appearing late is the biggest one: a buyer who reaches step three before seeing shipping feels ambushed, and no amount of design polish recovers that. Forced account creation is next. Then a form asking for a company name, a delivery instruction, a phone number and a date of birth, none of which are needed to send a parcel.
Every field has to justify itself against the sales it costs
We design checkout by deleting. Every field has to justify itself against the sales it costs. Guest checkout is available by default, with an account offered after the purchase when the customer has a reason to want one. Address entry uses autocomplete, which is faster and dramatically reduces the failed deliveries that generate support contacts. Express payment options appear at the top for returning buyers. Shipping options state a date rather than a service name, because nobody knows what a service code means. Errors appear beside the field with wording that says how to fix it. None of this is inventive. It is discipline, and it is where the revenue is.
How the engagement runs
How an eCommerce design project runs
We start from your data rather than from a mood board. Analytics tells us where sessions end, which products carry revenue, what people search for internally and where checkout drop off happens. Session recordings show the friction that numbers only imply. That evidence sets the priority order, and it usually contradicts the internal assumption about what needs fixing.
- 01EvidenceAnalytics, internal search terms, checkout funnel drop off and session recordings
- 02PriorityThe pages and steps carrying the most revenue and losing the most of it
- 03StructureCategory taxonomy and filters based on how buyers decide, not how stock is stored
- 04Product page designContent blocks ordered by the objection each one removes
- 05Cart and checkoutFlow mapped step by step, with every field justified or cut
- 06Post purchaseConfirmation, tracking, and returns screens designed rather than left to defaults
- 07Prototype and testReal buyers completing a purchase on their own phones, with the friction logged
Two decisions on your side that keep the project moving
We design mobile-first because that is where most Australian retail traffic sits, and a design that works on a handset almost always translates upward. Desktop layouts drawn first and then squeezed down produce the cramped product pages you see everywhere. Real product data goes into the designs from the start, including the item with a forty character name and the one with a single low quality supplier image, because those are the products your grid has to survive.
Category and search design for how people actually browse
Between arriving and reaching a product, a customer either browses a category or searches. Both are design surfaces and both are commonly neglected. Category pages are often a grid with no editorial guidance, and search is left to whatever the platform provides, which for many stores means a shopper typing a plural or a misspelling and getting nothing.
Category design should reflect how buyers think rather than how your warehouse is organised
Category design should reflect how buyers think rather than how your warehouse is organised. Filters need to be the attributes people decide on, which for apparel is size and colour, for hardware is dimension and material, and for consumables is quantity. Filters should show counts, stay applied when someone goes back, and work properly on a phone where most sessions happen. Search needs synonyms, tolerance for typos, and a results page that is a proper merchandising surface rather than an error message. Whether the design is implemented on Shopify, WooCommerce or a custom stack matters less than getting these decisions right first.
The screens after the sale still belong to you
Design attention stops at the thank you page in most projects, which leaves the highest attention moment of the entire relationship to a platform default. The order confirmation is opened more reliably than any marketing email you will ever send. The tracking page gets visited repeatedly. The returns form is used at the exact moment a customer decides whether to buy from you again.
A confirmation that states clearly what happens next and when
So we design those too. A confirmation that states clearly what happens next and when. Dispatch and delivery messages that set expectations honestly, including when a parcel is with Australia Post and outside your control. A returns process that does not require an email exchange to begin. For categories with high return rates, such as apparel and footwear, the returns experience is a primary driver of repeat purchase rather than a cost centre. It is also where automated messaging and design have to be planned together rather than separately.
When design is not the reason your store is underperforming
If your conversion rate is roughly normal for your category and your revenue problem is volume, redesigning the store will not help. You have a traffic problem, and the money is better spent on eCommerce SEO or paid acquisition. We check this before quoting design work, because it is a common and expensive misdiagnosis.
The rest of the answer
There are two other cases where design is the wrong lever. If your prices are materially above the market for an identical product with no differentiation, no layout will fix that, and buyers will comparison shop within a tab or two. And if your store is very slow, page weight is the constraint rather than the layout, which is engineering work and often a conversion and performance programme rather than a design project. We will tell you which of these you have after looking at the numbers, even where the honest answer costs us the design work.
How we scope it
Four ways to scope your eCommerce Web Design project
We do not publish package prices, because the same brief can be a short build or a long one. These are the shapes the work usually takes. Tell us which one sounds like you and you will get a fixed written quote that spells out exactly what it covers.
Store launch
A first real store, set up for Australian selling
Fixed written quote, agreed before work starts
- Evidence review of analytics, search terms and funnel drop off
- Category taxonomy and filter specification
- Product page design with objection ordered content blocks
Store growth
A store with catalogue, integration or margin problems to solve
Fixed written quote, agreed before work starts
- Everything in Store launch
- Cart and checkout flow with every field justified
- Mobile-first designs for every commerce template
- Post purchase, tracking and returns screen designs
Commerce platform
Multi store, multi channel or a custom commerce build
Fixed written quote, agreed before work starts
- Everything in Store growth
- Component library with all interaction states
- Accessibility annotations to WCAG 2.2 AA
- Developer handover pack and walkthrough
Store care
Merchandising, speed and conversion, month to month
Rolling monthly, quoted in writing
- Hosting, patching, backups and uptime monitoring
- Merchandising, campaign and catalogue changes
- Checkout and payment paths tested after every update
- Rolling, cancel with 30 days notice
These are shapes, not menus. Most quotes end up somewhere between two of them, and we will say so when the honest answer is the smallest one. Describe the problem and we will tell you which it is.
Questions buyers usually ask
Frequently asked questions
How long does eCommerce web design take?
Typically 5 to 9 weeks to developer handover. Evidence gathering and structure take the first two weeks, product page and checkout design the middle stretch, and post purchase screens plus testing the remainder. Stores with several distinct product types take longer because each needs its own page treatment. Catalogue size affects the build more than it affects the design stage.
What drives the cost of a store design project?
The number of distinct product types and templates, whether the checkout can be modified on your platform, how much evidence work is needed up front, and whether prototype testing is in scope. A single category store is a much smaller job than one selling apparel, hardware and consumables from the same site. One call to scope it, one document with the fixed price.
Do you design for a specific platform?
We design platform agnostically and then adapt to the constraints of yours, which is the honest order. Checkout customisation is the main variable, since hosted platforms limit what can change unless you are on their enterprise tier. We confirm those limits before designing so nothing in the pack is impossible to build, and we note where a change would require a platform upgrade.
Do the design files belong to us after handover?
Yes. Figma files, the component library, exported assets and any font or image licences transfer to your business at handover, purchased in your name. Whoever builds it, including your existing developer or a platform partner, receives the same annotated pack and specifications. Nothing is retained to keep you dependent on us for future changes.
Will a redesign hurt our search rankings?
Not if it is handled properly, and this is a real risk worth naming. Rankings suffer when URLs change without redirects, when content is removed during a redesign, or when the new templates lose the structured data the old ones had. We keep the URL structure unless there is a strong reason to change it, plan redirects in advance and preserve product markup as part of the handover specification.
Can you improve the store we have without a full redesign?
Often that is the better value option. A focused programme on the product page and checkout, tested against your actual numbers, frequently produces a bigger return than a whole site rebuild and costs considerably less. We look at where revenue is being lost and propose the smallest change that addresses it. If the foundations are sound, we will say so rather than proposing a rebuild.
Related services
Get a fixed written quote for your store design
Send us your store URL and your current conversion rate. We reply within one business day with what we would fix first, whether or not you engage us.