-
(音乐PLAYING] Design trends come and go. But there are design elements that are fundamental in modern e-commerce. In this lesson, I'm going to share the four design elements that will help your store sell more and distract less. So let's get into the elements of modern e-commerce design. There's trust, visual appeal, form, and navigation. Some of these may be review, though I encourage you to approach this with a beginner mindset.
-
First, let's talk about trust. So imagine visiting an online store for the very first time. You know nothing about the brand, the quality of their products, or the commitment to making the customer happy. What would encourage you to actually make a purchase? You may be lured into a deal. But to actually go through the whole purchase really requires trust.
-
So what are trust indicators? Here are the top three must have trust indicators that I would recommend for every entrepreneur. First, contact information. Nothing throws people off more than a website without contact information, including email, a possible phone number, or even a mailing address. This is the kind of information along with an about us page that really helps potential customers feel like they're buying from a person instead of just a brand.
-
Second, you'll want the return policy. A policy doesn't only make it easier for a person to return a product that doesn't satisfy them. It actually increases purchases by instilling a sense of confidence and trust in the customer, knowing that they can return the product if they need to. And another great way to build trust is by displaying technical certifications on your shop. Just by using Shopify, your site will automatically be secure by using Shopify Payments alone.
-
Shopify Payments is a very powerful payment gateway that uses the latest security technologies to make sure that you can protect your customers' sensitive information. So don't hesitate to use graphics showing the security compliances your store has as well as even the payment methods you can accept on your online store. Customers' trust is hardest to earn when you don't have any customers.
-
So I highly recommend you include these trust indicators as an important aspect of designing your store. Another critical element of your shop and the one you've probably thought about the most is visual appeal. And there are a few elements to this, whether it's photography colors, fonts, and so on. When selling your product online, perception is everything. People form their first impression within the first few seconds of visiting your store.
-
On your Shopify store, making that impression count rests on the quality of your images. Think of it this way. Your product photography is like an ambassador sharing the promise of your product online. Your customers can't try, taste, or feel or wear the product before they buy. So they'll rely heavily on the visuals to decide if that product is actually right for them. Products photographed on a white background are typically a gold standard for e-commerce photography.
-
Notice how, when you purchase a product on the big box retailer's website, there's always a white background photo including lifestyle photos as well. Here's the reason why. It's easier to see the product details as it strips away the branding so your product can appeal to different demographics. If you want to learn more about the product photography, check out Shopify Academy's free course on product photography.
-
Lifestyle or brand photos are also important because it allows customers to envision themselves interacting with your product on a day-to-day basis. Overall, your product photos are a key factor in your store engagement, conversion, and even retention. Let's continue with the visual appeal of your online store and talk about colors and fonts. You may have created the most incredible product.
-
But if the aesthetic on your website specifically to the colors and fonts don't work, your customers will be put off and may not make a purchase of that incredible product. The look of your store plays into the overall experience of buying this product that you're looking to sell. Color is one of the most powerful tools that you can use to spark interest and emotion. Color can also be used to draw attention to specific sections of your website and even lead your customers down a specific buyer's journey.
-
In module 2, we'll talk more about how to choose your brand colors. Though, for now, I want you to keep in mind the golden rules for using colors on an e-commerce website. I recommend using two main colors for your website-- a primary color and a secondary color. There are two ways I recommend choosing complementary colors. Firstly, I go to dribble.com and search for a color palette.
-
For example, if I can type in red and I can see examples of websites that use red in their color palette and see which options look most visually appealing to myself, that works great. The second option is to check out a website or a tool like Kuler by Adobe, which allows you to pick a primary color and it generates complementary colors associated with it. Another important topic that I'm passionate about is ensuring that your website is accessible.
-
You want to ensure the colors that you're choosing contrasts well enough that people of all ages can read the text that you're looking to communicate. I've also included a guide in the resources below to ensure your website is accessible. Now let's talk about fonts and typography. These days, customers expect to see dynamic and interesting typography on a website rather than an old school, stale looking font, like Times New Roman, for example.
-
Well, the words you write your information is important that typography communicates the emotion of the information to help you build brand identity. And more of that in module 2. The good news is with the Shopify Theme Store, each template comes with tons of recommendations for fonts. You can use the recommended fonts for your website. Or if you do choose to make changes, here are some good foundational rules.
-
First, define a hierarchy of typography. Keep your body font style simple and easy to read. And when it comes to headings, you can be a bit more adventurous with the font style you choose. Second, stick the two fonts. As a beginner, it's just easier to manage two different font styles. Now let's talk about form. How does your website take shape?
-
When you answered that question just in your head right now, I guarantee you visualize a website on a desktop computer. That has to change. There's no doubt that your potential customer will expect to buy their products on a phone. When people pick up the phone, they want to just get something done immediately. Mobile commerce is taking over.
-
According to comScore, nearly 70% of digital media time is actually spent on a mobile device. Unfortunately, many e-commerce websites and platforms were built only to keep desktop browsing in mind. Luckily, you're building your business with Shopify. Shopify themes are responsive. This means that the site expands and contrasts nicely between different devices, whether you're viewing a website on a desktop computer, smartphone, or a tablet, Shopify Themes has you covered.
-
As you saw in the theme tour, in the overview, you can see what themes look like in a mobile perspective. When choosing a theme based on mobile, it's best to attempt to make a purchase to see if you're happy with the transactional flow. If you're not, there's a good chance your customers might not be as well. Elements like a cart drawer or slide out or an easy to follow navigation that might have an accordion dropdown are crucial when choosing your potential mobile Shopify theme.
-
The last critical piece of e-commerce design is navigation. Your website navigation should help customers find the product quickly and easily. A good navigation improves the online store's shopping experience and helps merchants increase sales and profits. Navigation can influence your theme choice as well. If you have a large catalog of products, a theme with a larger menu display might be best for you.
-
我有一个原则,我建议企业家follow when launching their store. First, only three to four headers on the navigation. You also want to be clear when you label your headers for your navigation. There's no time to be clever. So you want to be as clear as possible. These are the headers I recommends at the top of the navigation when getting started. First, shop product or collection name.
-
Add your about us, your best sellers, as well as contact us. Second, your footer, that's the bar at the very bottom of your page. Here are the labels I recommend for your footer. Try shop, once again, for a collection or product. This time add a return policy, terms of service, as well as contact information. This is a great place to get started. And you can change your headers if you notice that they're not being clicked on.
-
You can see, this is when you go through your iteration process and use products like HeatMap or user testing to validate the correct navigation items. It's important to keep these four fundamental design elements in mind as you build your Shopify store. I've worked on dozens of businesses, from startups to massive brands. And these are the four factors that constantly come through when building out these projects.
-
Build trust. Make it visually appealing. Think about the device your visitors are using. And keep the site navigation as simple as possible. And get the visitor to the product as quick as possible. So in the next lesson, I'm going to be breaking down two of my favorite stores and what they're doing successfully that has made them strong merchants.
