This post is based on presentations by Jenneviere Villegas and Leons Flanders from Printful Threads Vol. 6, a free online conference for ecommerce store owners. You can watch all the presentations on our Youtube channel.
It’s becoming increasingly clear that good design impacts financial performance. In fact, a study by McKinsey & Company found that businesses that adopt good design practices achieved 32% higher revenue than their competitors over a five-year period.
It’s important for business owners to stay on top of their store design, especially if they want to improve brand trust, reduce cart abandonment, and increase overall sales. This blog post brings together valuable insights on the topic from our Printful Threads speakers and goes over how you can apply these tips to your store.
Focus on the principles of design
Design principles are important pieces of advice and information that help make the design process easier.
Keeping a set of design principles in mind when designing your store can reduce corrections and adjustments later on. It also helps standardize your store’s appearance, which can improve a customer’s first impression and increase buying confidence.
The most important design principles to keep in mind include visual appeal, organized navigation, mobile responsiveness, and information transparency. When these principles are successfully applied, it optimizes your customers’ experience on your site and helps them move through the buying process more easily.
Read on to learn about the different areas that make up each principle, and how you can apply them to your ecommerce store.
Visual appeal
Your store’s design helps connect your customers with what you do. It affects how they view your overall brand and helps differentiate your business from others.
Store design also helps convey the quality that you offer customers. You’ll need to decide on your color scheme, typography, and photography to plan out your visuals. When you do this well, customers have an easier time moving through your store and less distractions will stop them from buying.
Color schemes
Your color scheme is a set of colors, 2 or more, that help set the vibe for your store. One is your primary color and the other is your secondary color. Both colors should be monochromatic so they can work as the foundation and background for product photos and any videos you add.
On top of these two colors, it’s a good idea to have a 3rd color that’s bright and striking that works as an accent to highlight buttons or links on your page. Make sure the colors you choose are accessible and ADA compliant.
Source: Printful
Make sure your chosen color scheme doesn’t make it hard for customers to read your site text. Learn more about color theory here.
Typography
Typography is the style or design of text which helps communicate the emotion of your brand.
Source: Printful
Legibility matters, so keep your body font simple so customers can read your information easily. Feel free to be more adventurous with heading fonts, but try to stick to two fonts max. You don’t want to make it harder for customers to focus on buying.
Photography
Photographs help customers decide whether they want to buy your products or not. Research from Justuno found that around 93% of buyers claim photographs and videos are key deciding factors when it comes to their purchasing decision.
Quality photography matters, so make sure your photographs are done on a neutral background, or at least compliment your site’s color scheme, so your items stand out.
On your online store, you’ll want to have two types of photographs throughout your Home, About Us, and Store pages:
Product photos—these capture your products from various angles to help customers examine your product and see if it’s right for them.
Lifestyle (or brand) photos—these types of images help customers visualize themselves using your products on a day-to-day basis, and offer more creative freedom for expressing your brand.
Diversity and inclusion matters. Keep in mind who your audience is and try to pick models that represent your audience well.
“Be sure to incorporate diversity in your brand photos. The important part is that as many people as possible can see themselves using your product. This can sometimes be where our internal biases show up, so I encourage you to challenge yourself to be as diverse as possible across body type, age, race, gender, ability, and other areas when thinking about your photography.”—Jenneviere Villegas, Sr. Merchant Engagement Manager
When visiting a site, people rely on menus to navigate where they want to go. Make it easier for customers to move through your store and stay focused on buying by keeping your menu tidy and visible at the top bar of your site. Try to stick to an average of 3 to 6 menu options, and use drop-downs to keep your menu neat.
Source: Printful & Artem Beliaikin
Be as clear as possible when labeling your menu headers. For example, a typical store will have these headers:
Home
About us
Shop
Best Sellers
Contact
Your most important headers are usually placed on the left side, and less visited headers go on the right.
Mobile responsiveness
Mobile responsiveness is how well your store adapts to mobile screens. It’s important to get this right to keep your store competitive: around 55.4% of customers have bought at least one item on their mobile device since 2020, and retail commerce sales are predicted to reach $437 billion by the end of this year. If you make your store just as appealing for mobile devices, you won’t miss out on any sales from customers having trouble understanding your store layout on their phones.
Review whether or not your store design looks good on mobile screens and be sure to fix any issues you notice. Always pay attention to how the new products or pages you add look on both desktop and mobile devices. If you need help, we have an article that goes over in more detail how to make your store optimized for mobile shoppers.
Information transparency
Having all your business information available and easily accessible to customers helps build trust. Why is trust important? It improves the chances a customer will feel confident and secure buying from you.
Not every customer will have to use your returns policy or contact you, but letting them know how they can do it if the need should arise relieves any doubts about your store’s authenticity.
The information you should have available on your site is the following:
Your business contact information
A chat box or message form
Your business social media links
Your returns and privacy policy
Your accepted payment methods
Building your online store
Keep conversions in mind when you build your online store. You want to structure every section with the goal of helping customers through the buying process so you make it easier for them to focus on buying.
To get this done, you’ll want to set up your home page and the checkout process to be as straightforward and informational as possible for your customers.
Your home page needs clear, short messages to help customers with their buying decision-making process.
A call-to-action (CTA) that encourages customers to either buy something or sign up to your email list should be present on the top hero banner—the large image that stretches across the top of your page underneath the menu that serves as the starting point. If your store is extensive, you can opt to guide them to your best sellers or new products page instead.
A CTA is a call-to-action in the form of a highly-visible button that invites customers to do something on your page.
Mango’s hero image containing a CTA | Source: Mango
If you choose to invite them to your mailing list, you can advertise any new products or promotions through email marketing little by little until they are ready to buy. Just make sure your email has a CTA in it so they are directed to your store page.
Checkout process
Structuring your checkout process properly helps customers buy products from you without complications. It should entail several short steps which painlessly guide them to the shipping and payments page, where you’ll get paid as soon as they complete their purchase.
Your checkout process should include the following:
Product viewing—the customer begins the buying decision
Add to cart—the customer starts to commit
In the cart—the customer is making final decisions
Shipping and payment—the customer commits to buying
Order summary—reassuring the customer after buying
Making changes to your checkout process can be difficult, but if your store is growing or your goal is to expand quickly, it might be a good idea to invest in a professional to manage this. Keep in mind that anything you do to streamline and simplify the checkout process for customers can help reduce cart abandonment.
Product viewing
Your product page shows customers what you have for sale, and includes some pictures, information, and a CTA to either buy the product right away or add it to their cart.
This page is also the first step of the buying process, so it’s important you answer any questions and be upfront with all your product information so customers can focus on shopping instead of hunting for the specifics.
“Your product page is the closest your customers will come to interacting with your product”—Jenneviere Villegas, Sr. Merchant Engagement Manager.
To make a product page that customers find helpful, include the following:
Consistent image size ratios showing the product from different angles
Product material information and or any cleaning care instructions
A size guide with measurements to help customers decide their size
Social proof and customer testimonials to help customers feel secure
Average product ratings (i.e. 5 out of 5 stars) showing product feedback
A coupon code bar for customers to add any discount codes they have
A CTA button that customers can easily spot and click on to add to cart
A product availability tab so customers know if your product is sold out
An average delivery time display block to inform customers of delivery times
Add to cart
The second step of the checkout process is adding the product to the cart. This is when your customer begins to commit to buying your product.
Set up your store so that when an item is added to the cart, your customer isn’t moved straight to the checkout page. If it’s possible, stick to mimicking the experience of real-life shopping and have a number appear next to the cart icon indicating that a product has been added instead of moving the customer to a different page.
If your website is set up to bring customers to the cart each time they add an item, it makes it harder for them to look around your store and find more items they might want to add—potentially costing you more sales.
Some online stores don’t make it easy for you to control how this part functions, but if you have a choice, try to edit it (or hire someone to adjust this) based on the advice above.
In the cart
Once your customer visits their cart, they’re ready to decide whether they’ll go through with the purchase or not. You don’t want shoppers to abandon their carts, so try to make sure you offer all the information upfront to prevent unpleasant surprises for customers, such as unexpected shipping costs or unusual payment methods.
Information you should include:
Safe shipping certificates
Payment methods available
A link to your returns policy
Average shipping times
If you have the ability to edit how your cart checkout process is formatted, enable your customers to adjust the product quantity in their basket with updated total costs. Offer a sign-in option too, but make sure they won’t lose their cart items if they decide to register.
Shipping and payment
The final step of the checkout process is when your customer adds in their payment and shipping information and completes the order. Always include the final shipping costs, an overview of the products in their cart, and the total cost of the entire order. You don’t want to create any excuse for why your customer should leave this page to check anything, as it can make it more likely they’ll abandon the cart.
If you can, make this step easier for your customers by including the following customization tips:
Show a checkmark next to information (ie. name, card number) that is correct. Use a red X next to information that needs to be corrected so users have an easier time figuring out where they made a mistake.
Make sure all payment options your site accepts are visible, and include any safety guarantee certificates they come with.
Don’t use a drop-down for any information that requires a date as it’s easier for users to type it in instead of forcing them to scroll through a mini-calendar.
On the card payment section, include an explanation for what a CVV is as some users may have forgotten where or what that is.
Order summary
The order summary is the last part of the checkout process and it’s important for establishing trust and security between your customer and your business. When your customer completes their order, show them a full order summary and send a copy to their email. Make sure to thank them for doing business with you, and include the order number.
If you didn’t include any options to ask them to sign up yet, you can add it here—they’ve already completed all those fields of information, so it’ll be easier to get them to sign up.
Main takeaways
Putting together a successful store that earns sales and builds trust with customers is not an easy feat, but if you stick to the main principles in this guide you’ll have a better chance at succeeding.
Just remember to always be upfront and honest about all costs and delivery times, make sure to reassure users about payments and your returns policy, and structure your checkout process to be as neat as possible.
You’ll receive less questions from customers, avoid negative feedback from any surprises they may have, and end up with less returns if all the information they need to make a decision is available to them.
Cloe is a Content Marketing Specialist at Printful. Her educational background includes a Bachelors of Science in Management and Economics and a Masters of Science in International Governance and Diplomacy. Besides her work, she loves reading fantasy books and going for long hikes with her dog, a rambunctious jackadoodle.
Cloe is a Content Marketing Specialist at Printful. Her educational background includes a Bachelors of Science in Management and Economics and a Masters of Science in International Governance and Diplomacy. Besides her work, she loves reading fantasy books and going for long hikes with her dog, a rambunctious jackadoodle.
