Blog

Redesign Shopify

The Ultimate Guide to Redesigning Your Shopify Store

As much as we might wish otherwise sometimes, time continues to pass, and with it comes change. Trends come and trends go, and few are as visible as website design trends. Like changes in clothing from decade to decade, web design best practices, general templates, and in vogue appearances shift.

Remember a few years ago, when everyone started integrating dynamically-changing web designs? Remember a few years before that, when rounded buttons and minimalist interfaces started showing up? Remember even further back, when websites were dominated by frames and tables to regulate their layouts? Remember those short-lived days where Flash-based websites were all the rage before devices started dropping support and making them a usability nightmare?

Change is good. Unfortunately, change is also often a lot of work. Redesigning your website, even when it’s based on a modern, updated architecture like Shopify, means putting in a lot of work, or paying someone to do that work for you. Your site will look and feel great when you come out on the other side of the process, but that still leaves one major question: where do you even begin?

Is Now the Right Time to Redesign?

The first step to any website redesign is answering the question: is now the right time to redesign?

We’ve all known a website that seemed to change their design every year, and while keeping things fresh is good for users, that’s not quite what it means. When Google and the marketers that listen to them say freshness is a factor, they mean content, not design. In fact, a changed design can turn users off, if they don’t like the new user experience.

Uploading a New Theme

That said, there are plenty of good reasons to pursue a new redesign. For example:

  • Your current design is slow to load and bogged down by plugins, banners, and other cruft built up over the years.
  • Your current design isn’t mobile responsive.
  • Your current design looks and feels old, cluttered, or difficult to use for modern web users.
  • Your current design lacks many of the features a modern web user expects from a storefront.
  • Your competitors all have more modern, slick-looking designs and it makes you look unfavorable in comparison.
  • Your theme is throwing errors and is going to cost more than it’s worth to fix.

Shopify as a platform is kept up to date with a lot of modern features, and the ability to integrate new ones through apps. However, old themes can fail to integrate these new features in an elegant way, and plenty of site owners fail to update their back-end infrastructure either way. It’s especially common when the business in question paid for a custom design back in the day, and doesn’t want to reinvest in a new one or transition to a commonly available theme.

Perhaps more than anything else, are you proud of your web design? If you’re not happy to share it on your business cards, in your email signature, or when talking to interested parties, it’s a definite sign you should invest in a redesign you can be happy with.

Decide on the Scope of Your Redesign

If you’ve decided it’s time to redesign your Shopify site, you need to figure out what the scope of your project will be. Here are some questions you can answer to help determine how much needs to change.

Does your store use well-built and up-to-date apps? Any time you’re using a third-party framework, whether it’s Shopify, Joomla, WordPress, or something else, the people authoring the apps and plugins are continually updating it. They might be adding features or removing deprecated features, pushing security updates, making improvements to their core structure, their speed, or their integrations, and so on.

Some webmasters are on the ball, keeping their apps and plugins up to date. Others settle in and ignore updates because maintenance always has the potential to go wrong, and major updates can break old features.

While Shopify apps don’t need to be manually updated, the longer it has been since you’ve reviewed the apps you’re using, the more difficult it will be. Features and plugins might stop working, data could be lost, and the functionality of your store could be impaired.

Shopify Apps List

It may be a good time to audit your apps and determine which of them are essential to your business and which are old and outdated. You may be able to replace some of your Shopify apps with better, more modern versions.

Does your website rely on deprecated features? Things change, and we don’t just mean web standards and user desires. Even the very code your site uses may change with iterations on HTML and CSS standards. Years ago, you would use <b> to highlight text in bold, but with HTML5 that tag is meant to be the last resort behind CSS formatting or the use of <strong> instead. How much else has changed?

Shopify pushes new updates fairly regularly. In those updates, they change how their platform works, in major and minor ways. Sometimes those updates are under-the-hood tweaks to improve speed or handling of errors. Sometimes they’re major feature additions. Sometimes, major features are deprecated and slated for full removal.

It’s usually this kind of roadblock that keeps webmasters from updating their site. If you rely on a feature that Shopify removed, you may want to avoid updating until a replacement is developed, and at that point, it’s often easier to ignore the update than it is to make those major changes.

Theme Errors

Unfortunately, the longer you let your site get out of date, the worse it is. Not only do you eventually hurt usability and the user experience, but you may also leave your site vulnerable to security exploits. It can put your storefront and your business at risk, and potentially even expose your customers to risk as well.

Is your website structure aligned with your goals? Goals change over time. Maybe when you started your website, you were focused on growing an audience, with an emphasis on social media and blogging. Once you became established, your goals shifted to maintaining the audience and converting more of them into customers. Does your website facilitate that goal as fully as possible? If not, a redesign to your structure and user experience may be in order.

Do you have any common usability issues? Part of keeping a storefront operating smoothly is keeping an eye on your user journey, from the moment they arrive on your site to the moment they leave. Where do they leave? Are they running into roadblocks moving from one part of your sales funnel to the next? What kinds of issues are they experiencing? Often, common issues can be addressed through a website redesign with an overhaul of your site structure, messaging, and flow.

If your site takes more than a few seconds to load, for example, your bounce rate will skyrocket and you’ll lose sales. Shopify has fast and efficient servers, so your load time depends heavily on how well-built your theme is.

Slow Site

Is your current design mobile compatible? This one is important enough that we’ve mentioned it a couple of times already. Over 50% of web-use today is done via a smartphone or other mobile device. It’s important enough that Google is prioritizing mobile websites in search whenever possible. If your site isn’t easily usable on a phone, you’re missing out on a huge number of potential customers. Luckily, adding mobile compatibility to Shopify is as easy as changing your theme, but it’s still a change you need to make.

Do you have room to integrate modern features? You might want to, say, add a reviews feature, or integrated social media content, or a brand loyalty program, or another modern feature to your site. Doing so can be great, but you need to find room for it in your design, and that’s not always as easy as adding a new menu option. Do you have room to add these features, or will you need a new design and layout to make it work?

Adding Reviews to Site

Does your current design fit your modern brand expression? Brands change over time. What started out focusing on one audience may have shifted to another audience entirely, and it’s up to you whether you embrace it or not. Sometimes, brands may shift their marketing and messaging over time through their mailing lists and print marketing, but fail to update their website to be more compelling to that new audience. Are you in this position?

The way we see it, there are three “levels” of website redesign you might pursue.

Basic Redesign: Changing Banners, Colors, and Other Details

The easiest level of a store redesign is a relatively simple change in your theme’s details. As long as your background infrastructure is kept up to date – that is, Shopify itself, your plugins, and any back-end databases and other infrastructure – it just comes down to detail work.

Tweaking Theme Settings

That’s not to say this is an easy redesign. You still need to answer a lot of questions about your brand, your goals, and your user experience. Something as simple as changing colors on your site can confuse visitors. If you’re changing your branding, your site layout, your URL structure, or even just integrating major new features like a site search, a reviews system, or a loyalty program, it pays to plan ahead.

Think about the details you want to change. Are these details something you can change without doing anything major to your site? It’s easy enough to reorder menus, change colors, and integrate new apps without needing to overhaul the entire site structure. On the other hand, if your changes are major enough, you may want to change your templates entirely. That pushes you into the next level of redesign.

Intermediate Redesign: Changing Themes and Integrating New Features

At the intermediate level, you will be changing your theme, which changes your site entirely from the user perspective. It’s almost the opposite of the basic site redesign, in that while your structure and functionality are changing, you want to strive to maintain as much continuity in color and design as possible, so users aren’t turned off at the thought that your site is completely different now. You can still change those other aspects of design later, but it can pay off to make those changes more gradually.

One of the biggest reasons to change your theme is to add mobile compatibility. In the past, it was okay to have two versions of your site, usually the basic site and the “m dot” site, which would be the mobile version found at m.yourURL.com. Over time, this method has grown less and less favorable, as responsive design is much more flexible to a variety of different devices (such as tablet devices).

Thankfully, responsive design is so common now that most Shopify themes have it integrated. It’s simply a matter of finding a theme that fits your branding and goals, then customize it with colors, images, and apps that help elevate the experience and appearance of your store.

Responsive Shopify Theme Example

Changing themes is also a great time to add new features. There are plenty of cool things you can add to your site to increase user retention, give users something to do beyond reading blog posts or look at product pages, and generally boost the user’s experience.

  • Adding social media integration, from simple share buttons to share a post when a purchase is made to a visual, embedded feed from Instagram.
  • Adding the ability for users to add items to a wishlist and sign up for notifications for sales and other deals.
  • Adding a customer loyalty program, points program, or referral program.
  • Adding an FAQ or knowledge base so customers can answer their own questions.
  • Adding a live chat system so customers can ask you questions and get help directly.
  • Adding integrated customer reviews on product pages.

All this and more is available just with Shopify apps, and virtually any feature you can think of can be written by an app developer as well.

Advanced Redesign: Redesigning Shopify From the Ground Up

At the advanced level, you’re looking at a complete overhaul of your Shopify store. This is what happens if your storefront is extremely out of date, such that you’re looking to replace virtually everything. A new version of Shopify, a new theme, possibly even a custom theme design, new apps, custom apps, custom scripts; it can all come together to create an extremely robust and unique site perfectly aligned with your brand and business goals.

If you started your store with a basic Shopify template and it has grown into a successful business, if you’re still using that same template from when you first started, it might be time to invest in a quality site design that is shaped around your brand.

Under Construction

Unfortunately, this level of redesign typically requires a front-end programmer experienced with Shopify theme development. You’re going to have to discuss everything from your brand strategy to your intended imagery to your ideal customer funnel, and figure out what can be done out of the box and what needs a custom solution. Simply planning and strategizing this can be expensive and time-consuming.

This is the level where we recommend hiring a company to handle your design for you. Trying to muddle through it by piecing together a dozen online guides, putting together a strategy when you’ve rarely thought about it before, and picking apps you may or may not trust is frankly a bit of a crapshoot. It’s better by far to spend the money to hire a company with the experience to guide you through the process and get it all done successfully.

William Smith