4 Reasons Why I Mock Up My Squarespace Sites In Adobe XD First

 

I used to think that mocking up a Squarespace website first would be a waste of time and just add more steps to my process, but by adding this step to my client experience, I’ve actually been able to wrap up projects faster (and with fewer revisions). 

By mocking up designs in Adobe XD for client review, I have been able to push the boundaries of what I thought was possible in Squarespace changing website design for me. Anything I can do to get more creative with my design plus increase the speed of my project process, the better.

I used to think that mocking up a Squarespace website first would be a waste of time and just add more steps to my process, but by adding this step to my client experience, I’ve actually been able to wrap up projects faster (and with fewer revisions).

Here are a few reasons why I mockup in XD first:

It is easier to get creative

You have to first have a basic understanding of Squarespace before you can start pushing the boundaries of design, but once you have that down - the creativity really kicks in. Whether it’s a content block hack or using some CSS to customize your site, there are quite a few things you can do to step up your design game. 

By taking a step back and building out the mockups in Adobe XD first, you can start to play around creatively and build a unique site for your client. You are able to experiment with different fonts and site styles without having to go back and forth in the site styles design menu in Squarespace. That feature alone is a huge time saver. 

Plus you can compare two ideas side by side. Let’s say you build out a homepage that you like but want to see how it might look with a few adjustments you can’t “save as” and create a new draft just to see what it might look like. With Adobe XD you can do just that. Amazing right?

Related: Squarespace vs Wordpress

Clients can easily give feedback

Adobe XD had a great feature for prototyping and sharing your designs with your client. You’re able to share a link directly with them and they can view the site and make comments directly on the link, no need to log in. This method is also handy if you work with a developer to be able to share your designs with them. 

Explore a mockup I created for a client here or see a .jpg of a mock-up below. You can also watch a video from Adobe XD here on how to share your prototype with clients here.

 
Adobe XD layout.jpg
 

It is quicker to make changes

If you happen to miss the mark with the design and the client has major changes, it’s way easier for you to make them in Adobe XD vs having to build a whole other site in Squarespace. This will save you lots of time!

Related: Squarespace SEO Launch Checklist

You can outsource your site development and build-out

Once you have the design approved from the client all that’s left is to build out the site. If you have a lot of custom needs this can easily be outsourced to a developer or if you have a lot of content or images to go in you can easily outsource this to a junior designer or virtual assistant. This allows you to start on your next project sooner, making your wait time for projects less! Win, win. 

Want more tips? Here are some more helpful videos from Adobe!

Get to Know Adobe XD

Layout and design your app or website