Inside My 2-Week Squarespace Website Design Process
Table of Contents Show
One of the most common types of questions I get are all about processes.
When do I do this?
How do I do that?
When do I ask the client to do these things?
I get it! Websites are full of moving parts that can feel overwhelming, but you can find your rhythm with some practice and some guidance from someone like me, who’s learned from the pros and who’s done it a bazilion times.
Website process for clients are kind of like putting together one of those 1,000-piece puzzles.
All the pieces are laid out on a table or the floor, and you’re searching for the edge pieces so you can work your way inward. It’s too overwhelming to start in the middle with the first piece you pick up, and look at the other 999 pieces for match… 😳
Forming the boundaries helps set the process in motion and make it feel less daunting!
In an effort to help you with that, today I'm excited to share with you the ins and outs of my custom Squarespace website design process. You know, the whole process from that first inquiry to the exhilarating launch day, ––and beyond.
So, grab your favorite beverage (today mine is a hot Chai tea!), and let's dive in! Because it's that time of the year when I swap my coffee for chai, and cozy hoodies become my unofficial uniform. 😂
But I digress… Let's get into the meat of it - how I guide my clients through a high-touch, value-packed, hand-held, two-week website process with ease.
Navigating My Two-Week Web Design Process
Stage 1: The Lead Capture Form 📋
Now, every great project begins with a solid foundation. For me, that's the lead capture or inquiry form. Whether it's through Dubsado, HoneyBook, or good ol' Squarespace forms, this is where the magic starts. It's all about making it easy for potential clients to express their interest.
But here's a little secret - if your forms are lengthy, conditional logic will be a must-have. Check out Tally. It's a game-changer, especially in those early stages, because 95% or more of their features are available on the free plan, including conditional logic, AND you can embed these forms in Squarespace very easily.
The goal here? Efficiency and tailored experiences, right from the get-go.
If you’re not sure what to ask in the form, check out this post for more details on what to add to your contact page next.
Stage 2: The Discovery Call 📞
Alright, you’ve got the ‘lead’ (potential new client). Now fast forward to the discovery call. This is where the like & trust happens. They get to ‘know’ you on your website, but to like & trust you that might require you to ‘meet’ with them. (…And introverts everywhere cry out, “UGHHH!” 😩)
My Discovery Calls are a face-to-face (or screen-to-screen) rendezvous where we get to know each other better. Think of it like a casual meet-and-greet ––but with a twist. We're not just gauging the project fit, but also if we're a match made in designer-client heaven.
And yes, in this case, they are judging us (to some degree) as much as we are judging them. After all, they’re about to drop a chunk of money in our lap & that requires a judgment call, does it not?
This stage is crucial. It's about more than just the project details themselves & whether or not we CAN do it; it's also about a partnership that feels right, i.e.: do you think you’d enjoy working with this person? Will you understand each other, respect each other, value each other, and work well together to achieve common goals? 🤔
So, get on that call and see if you're a dream team in the making!
Not sure what to say on that call? Check out this post next for all my tips on leading quick and effective Discovery Calls.
Pro-tip! Make sure your form redirects to some kind of ‘hidden’ information page so clients can have quick/easy access to things like project-related FAQs, pricing, recent work, reviews, and what to expect now that they’ve inquired. This will potentially help them answer a lot of questions while they wait for you to respond to their inquiry ––and it may also mean you have fewer to answer on the call itself.
Stage 3: Scheduling Projects with Ease 🗓️
Now, let's talk about scheduling because knowing WHEN to book your client’s project can be kind of tricky. You want the money & the job NOW, but it’s not always in your best interest to book it in that fast. Here’s how I handle client project scheduling now!
When a client asks about availability on the Discovery Call, I don't play the calendar shuffle game. Instead, I pull up (on my computer) &/or provide them with a public view of my Project Calendar, so they can pick a slot that suits them best.
This way, they can see available spots without the back-and-forth, and without peeking into my actual personal schedule. It's all about making it easy and stress-free for you, AND for them!
Not only does this public calendar view work great for my clients, it’s also the same place where I plan how many projects I want to book each year, assign a monetary value to each spot, and see what my potential revenue would be if I fill all those spots.
But don’t worry, if you’re using my free template (👇🏼 grab it below!), clients can ONLY see the calendar view which includes the availability & dates but nothing else. 😉
What’s the soonest I will allow a client to book a new project?
for custom website projects: 2-4 weeks out from the call date
for VIP or Design Days: about 1 week out from the call date
Most clients have no idea how much work may be involved in completing their homework and getting content to you so you can do your job, which means it’s on US to guide them through it.
We’d be doing our clients a disservice by letting them start a project sooner than that if they are unprepared. And quite frankly, it’d be a shitstorm for us too.
They need time to get their shit together, –and so do we.
If the client is chomping at the bit and pushes you to offer an earlier date… that might be a red-flag you should pay serious attention to. This unwillingness to ‘abide’ by your policies or timelines is not a great way to start the project, so don’t give in! Pushing a project through faster will only lesson the quality you can provide and the attention they can give you.
Stage 4: Follow-up, Proposal, Invoice, and Contract 📑
Once we've decided we're a match (both of us!), it's time to make things official. The next step is to send over the ‘paperwork’ that includes the invoice and contract, among other things. That paperwork seals the deal.
Inside that packet, I include:
the Proposal (not a ‘pretty’ one, just a basic one like an invoice but also includes a basic scope of work, the project schedule, and a client information form)
the Contract or Service Agreement (it’s long; like 6 or 7 pages long, but it needs to be!)
the Invoice (with an initial payment request of 1/3 of the project, up-front)
I send this packet with 1 email that has a linked button inside to 1 link with 3 tabs, one for each of those documents so they can fill it out step-by-step.
They’ll get an automated email when they sign the contract with an attached copy with their signature on it, and an emailed receipt when they pay the invoice.
Before I get ahead of myself ––there are no surprises here; the price we discussed during our discovery call remains the same as the one on the Proposal and invoice, 99% of the time.
If you’re not sure where to get a client service contract, there are tons of legal template shops that make this very affordable. My favorite shop is Creative Law Shop, and that’s where my agreements are from (literally, I’ve bought like 10 templates from them so far!)
You can save 10% any time, on top of current sale prices over Black Friday & the like, with my code LAUNCH10.
Want to learn more about the differences between website Terms & Conditions and Client Service Agreements? Check out this post to learn more about bulletproof contracts for both!
Pro-tips for site creation in Squarespace:
I'll let you in on a little secret! Starting the website design on my own account gives me control over when I hand it over to the client without worrying about whether they’ve paid me in full yet.It's a smart move for solo designers like me, and it allows me to pass along a 20% discount on the first payment to my clients when they subscribe to Squarespace.
Even if you’re migrating from an old Squarespace website to a new one, it’s still in your best interest to create the new one on your account & transfer ownership (easy!) to the client when you’re done.
If you can’t, then get the payment in full, up-front before you do the work. That way, they can take the work & run, but you’ll still get paid. (VIP Days or Design Days are a great example of when you can’t start the website on your account, if it already exists & you’re just hired to edit the current site.)
Stage 5: The Homework Phase 📚
Now, before we dive headfirst into the project timeline, let's talk about the homework phase because I'm all about giving clients the time AND education they need to get their content and ideas together BEFORE the project starts.
Because of that, my client portal system is loaded with guidance, making sure everything's crystal clear before we hit the ground running, and for anything that’s potentially confusing, they know exactly how (& where) to ask me questions.
This homework phase is crucial for a rock-solid project foundation, and ultimately for a great end result, which is why I will never book a custom website project less than 2-4 weeks out.
This portal is a whole system I’ve developed in both ClickUp and Notion, and it’s a whole topic in and of itself, so if you want to know what’s inside my client portal check out this post next.
Stage 6: Design Kick-off 🚀
Fast forward to the project itself! The week before the project, I review the client’s homework and make a list of questions & discussion topics for the Kick-Off call, which typically happens on the first Monday morning of the project.
Before I forget, make sure you RECORD this call so you can refer back to it later & so you won’t have to take notes while they’re talking (it’s distracting & you might miss some gold nugget while you were writing down something else they said).
This is a great time to get clarification on anything they submitted, pick their brain to form solid strategies, and get to know both their business & their potential audience better, so you can provide them with a website design that appeals to their ideal client.
These questions can include things like:
how do you want your inquiry processes to work? (ie: what happens after a contact form is submitted?)
maybe you have some color palette options to show them
pull up their inspiration graphics (part of the homework in the portal!) and go through that together, talking through commonalities and patterns you see in what they submitted
look at competitor or inspiration sites together and talk about strengths & weaknesses that the client may want to adopt or avoid in the design
talk about their marketing method preferences (again, this was referenced in the earliest part of their homework) so you can plan to include the structure for things like email sign-up forms, monetized blog layouts, subscribe forms in a blog sidebar, etc.
give them a chance to ask you questions about anything they’re wondering about at the end of the conversation
ONE “CRUCIAL” PART I ALWAYS SKIP!
Unlike many web designers, I don't bother with wireframes or mockups for my custom website builds.
Squarespace is so user-friendly that it feels incredibly redundant. Especially when programs like Adobe XD and Figma have different settings and default element styles than Squarespace has. You also have to build in the animations or click-throughs to essentially make a fake website in these apps BEFORE you also make the website in Squarespace...
––Yes, I know there are workarounds and templates you could start with to fix that problem and it does really help with exporting assets at the exact sizes you created for the design. However, for me personally, it’s quicker & easier to just create the damn thing ONE TIME in the platform I actually intend to build the real thing in, and that Squarespace draft is sharable with the client in a way that offers a more accurate experience of the potential end-product.
Wireframes make more sense when there are both a designer & a developer working on a project, so the designer can create it & say, “This is what I want it to look like” before handing it off to the developer to code it from scratch ––but that’s now how Squarespace works.
Skipping the wireframe process is also way easier for newer designers who aren’t as familiar with Squarespace limitations, so it’s much less likely that you’ll create something that can’t be built in Squarespace or that would need custom code to develop. This is ultimately the reason why I started skipping the mockups in the first place, and it works so well for me that 8+ years later, with a skill set that’s increased 10-fold, I’m still skipping it!
WHERE DO I START?
Instead of designing mockups in another platform, I jump straight into creating the Template Style Guide which helps me get the most out of Site Styles in Squarespace. Then I design the homepage draft.
When that’s done, I stop there to get feedback before I move on to the remaining pages so I know I’m on the right track.
Think of it like those HGTV shows where the designers periodically bring the client in for strategic choices, but the whole thing is basically a surprise. (And 95% of the clients LOVE the results, even though they didn’t see the play-by-play while it was happening!)
Stage 7: Draft Presentation and Initial Feedback 🖥️📝
By Wednesday of the first week, it's time for the (mini) grand reveal –– the homepage draft. Clients get to choose how they want to experience it though, either through a pre-recorded walkthrough video or a live call so they can ask questions & give me real-time feedback.
Flexibility is important to me, and even though I prefer the live calls (always) myself because they essentially waste less time & make sure I have a better ‘read’ on what the client really thinks of the design –– I also want to make sure I’m working with their schedule & ensuring that my clients feel comfortable giving feedback. (And I realize that live calls might give them a bit of pressure they’re not used to!)
This stage is all about collaboration and ensuring the client's vision is actually coming to life in a way that fits them and their business & surpasses their expectations. It's a pivotal moment where we fine-tune the design direction of the project & shows them I understand what they need, even if they’ve not been able to explain it well so far.
Most clients aren’t great at conveying what they want, so it’s up to us to find ways to ‘pull’ it out of them & read between the lines! My client homework helps me do exactly that, and this first draft presentation usually seals the deal.
It’s rare at this stage (for me), but if there are any revision requests, for simpler ones I usually screen share on the call and make them live while they watch so they can help me adjust or confirm the changes right then & there.
For more complex changes, I’ll write them down & do them before I move on to the remaining pages, then send the client a link to comment or approve the edits.
This ultimately makes our clients more comfortable in our ability to take their constructive criticism and also shows them that while we’re leading the design, we’re still creating it for THEM and their opinions do matter in this process.
Pro tip: Keep this revision window SHORT. Like, one-day or half a day, short. You’ve got other pages to design and you can’t get bogged down in revisions to the home page that will prevent you from reaching the next goal post.
Stage 8: Full Website Presentation 🌟
With the homepage in the bag, it's time to tackle the rest of the website.
By Friday of the first week, it's showtime! In a presentation call, I walk clients through the entire website. I take the lead by sharing my screen and showing them every single page & custom feature, explaining my design choices, and asking for their immediate gut reactions. It's an interactive session where questions and feedback are encouraged.
Many clients are stunned into silence, grinning from ear to ear & saying things like ‘Wow’ over and over while they wrap their brain around this amazing thing we just created out of nothing, just for them!
Others are unsure how to convey their feedback (afraid to say the wrong thing & hurt our feelings), so you may have to literally tell them it’s okay to be honest. After all, if they’re not honest, everything will go downhill from here, and no one will be happy.
If they’re unsure how they feel about it or have trouble voicing their feedback, remind them that constructive criticism is LITERALLY part of our job and we are (or will be, ––for you newbies!) used to hearing requests for changes; that this design was created for them, and we want them to like it as much as we do!
I’ll share my thoughts on completing revisions we don’t agree with in the next stage.
The full website presentation is a moment of truth and that’s why I insist that it be done ‘live’ on a call together (or in person, if you’re both local), so you can get a more accurate read on their response to your creation.
This design is ultimately a testament to the hard work and collaboration that's gone into the whole process so far, and you want to celebrate this achievement together!
On that note, make sure you RECORD this presentation. Not only can you ask for permission to use clips from it as a review later, but you can also replay it later if you need to reference something that was discussed on the call.
Stage 9: Revisions ✏️
The presentation is over, the project is halfway done, and the weekend is about to begin! Before you sign off or mentally clock out for the weekend, make sure to send your client access to the draft so they can look it over and start submitting their feedback.
I use Markup.io for this and talk about how I use Markup on website project revisions in this post.
MANAGING THE NUMBER OF REVISIONS
Counting “Revision Rounds” has never been my thing. I don’t like to do it, and I don’t want to do it! So here’s what I do instead.
In my contract, it states that the revisions to the design cannot exceed the time it took to create the design in the first place, which establishes the limitation on clients potentially asking for 5,000,001 revisions and allowing the project to drag out.
Since I give my clients access to their Markup during (& show them how to use Markup to leave feedback) or after the presentation call, they have a little extra time to go through the draft with a fine-toothed comb.
The revision period officially STARTS on Monday of the second week of the project (though if they get access on the previous Friday, they’ll also have the weekend if they choose to use it) and ENDS at the end of the day on Wednesday that second week. So, if they use the weekend, they’ll have a full 5-6 days to submit all their revision requests (part of Friday, through the following Wednesday).
In between that time, I do not count revisions technically, though Markup does count the number of comments added so you can track them if you wish.
MANAGING REVISIONS DURING THOSE DAYS
As the client leaves these requests, starting on Monday (for me) I will complete & resolve each request as it’s submitted or in chunks throughout each day, so they have a chance to see the revised design and request further edits to that bit before moving on.
I don’t stay glued to the screen the whole time though; it’s enough to check it 2-3x a day, make some quick changes, and resolve the comments in groups.
MANAGING ‘BAD’ REVISION REQUESTS
If the client has requested something I can’t do, Squarespace can’t do, or I believe is unadvisable… I will respond to the comment with my thoughts on why I don’t think we should do x, y, z, ––and offer an alternate solution wherever possible. If they insist & ‘that thing’ they want is possible, I have no problem telling them that I don’t think it’s a good idea, but I will if they insist.
After all, it’s their project and if we have it in writing that we advised them against it and they still persisted… then that’s on them and we don’t have to put that design project in our portfolio.
Ultimately, it’s more important to make sure they’re happy with the end result because it’s their business, their website, and their money; we were just hired to provide our expertise & in these cases, if you warned them, you did!
Stage 10: Launch Preparations 🚀
With the finish line now in sight, it's time for launch preparations. I go through a detailed checklist of my own, making sure everything's in tip-top shape, from site settings to mobile responsiveness checks, ––no stone is left purposefully unturned.
I use Responsively to check how the design looks on mobile and make adjustments as needed. If you want to learn more about that process, check out this video to see how I used Responsively on a client site.
I will use SEOSpace* to implement & double-check my implementation of SEO basics, but (at least as of October 2023) you can’t scan draft sites with it. So, for now, I’m going through my SEO checklist, checking things like alt text on all images, image sizes are all under 250-500kb (each), headings are in an order that makes sense as an outline of the content on the page, url slugs and page titles include good keywords, and SEO titles & descriptions are in place.
Along with those things, I’m often also creating a newsletter email template in the client’s email marketing software, installing Termageddon policies for the website legalese, adding URL redirects for site migrations (to avoid broken links!), or double-checking all the links (again).
If we haven’t already at this point, I’ll be installing email subscribe forms or testing out all the form processes to make sure the form submission & whatever follow-up process is implemented, is actually working & going to the right person/people.
The meticulousness in these basic preparations is about ensuring that the website not only looks stunning but functions flawlessly. It's about delivering a product that exceeds expectations.
Stage 11: Launch Day 🚀
And here it is, the moment we've all been waiting for –- launch day! On the second (last) Friday of the project, it’s time to get on the last call with our client and LAUNCH THE DAMN THING. (See what I did there??!) 😂
First things first, we discuss any last-minute things like wrapping up their Termageddon policies, helping them connect social media profiles (different than Social Links in Settings), asking if they have any questions or concerns, double-checking that they got our form tests, etc.
The next step is to make it LIVE. 😳 Are they ready? Or do they need to wait?
Some clients have a brand photoshoot following the project and want to swap out a couple of their photos, or maybe they want to finish a few more blog posts or plan a marketing launch to announce the new website to their audience.
If they’re ready to make it live right then, then these are the steps for brand new sites:
for NEW websites:
add the client as a contributor to the website in Settings → Permissions
when they accept that invite, transfer ownership of the design to them (also in Permissions, from your account)
once they’re the owner, guide them to the Billing area where they can pick a hosting plan with Squarespace, enter their card details, and pay
then go to Settings → Site Availability and make the site PUBLIC
then go to Settings → Domains and help them buy, or connect their domain, if not purchased in Squarespace
that’s it!
As the original site owner, you will be an Admin by default when ownership is transferred to your client. If you want to stay on as an Admin, edit your own notification settings in your Squarespace account dashboard so you won’t have to see things like new orders or comments. If you don’t, then make sure to remove yourself from the permissions (which you can do from the dashboard of your main account) or ask them to remove you right then so you can show them where/how to do it.
For websites that are just moving from one site in Squarespace to another, here are the steps:
for migrated websites within Squarespace:
add the client as a contributor to the website in Settings → Permissions
when they accept that invite, transfer ownership of the design to them (also in Permissions, from your account)
once they’re the owner, guide them to the Billing area where they can pick a hosting plan with Squarespace, enter their card details, and pay for the new website
then go to Settings → Site Availability and make the site PUBLIC.
next, go open the old Squarespace website in a new tab –you’ll want them open at the same time to make it a little simpler to go back & forth!
in the old site, go to Settings → Domains and select one of the domains to MOVE to the new website
if they bought the domain in Squarespace this will be cake; just select it, then from that domain’s settings panel in Squarespace, select “Move Domain” to pick a website in their account to move it to (this is why we transfer ownership to them first!)
if they bought it outside of Squarespace and it’s still connected to the old site, then select it anyway, and click Disconnect; then connect their domain in the new site immediately afterward so the website will only be ‘down’ for about 5 minutes.
to connect a domain to the new site after it’s been disconnected from the old one, you’ll go to the new site and select the Use a Domain I Own option, then follow the prompts
don’t feel bad if you have to contact support (Squarespace, GoDaddy, Namecheap, etc) to verify that you’re doing this correctly; every domain host works a bit differently and the steps vary just enough to be annoying!
one the domain is connected to the new site, you can repeat the process to move any additional domains from the old site to the new one
NOW, you can cancel the hosting plan the old site is still on so they won’t be paying for two websites; if the client isn’t quite ready for that, they can just turn off auto-renew for now
to get a pro-rated refund of whatever remaining time is left on the old subscription, contact Squarespace support and tell them the client has not left Squarespace, just moved to a newer site in Squarespace, and they will issue a refund for the unused time on that subscription plan.
to get the refund, the new site MUST be on a paid plan FIRST
that’s it!
Please make sure you communicate to your client that the new site will not be able to keep the pricing their old site had, so the hosting plan rates may differ. However, because you started the design in your account, you can pass along your Circle Member discount of 20% to their first payment and help them ease into it, if their pricing has changed!
Not a Circle Member yet? Apply here when you’ve become a contributor on 3 websites with active payment plans!
Whether it's connecting a domain or transferring it, I guide clients through the final steps to make the websites live.
AFTER the site ‘launches’ or becomes live, I switch to Training and hit ‘record’ on the call, ensuring the client's sensitive information is protected & they have a replay of the training session.
Stage 12: Post-Launch Training and Empowerment 🛠️
On the same launch call, I walk clients through the ins and outs of their new website, from swapping out photos, to basic content editing, to tracking progress in the analytics panel and connecting Google Search Console. I even have a secret Client Resource Hub just for them & give them a tour!
My goal is to empower clients to take charge of their website so they won’t feel forced to rely on me for minor updates & maintenance. I’m only one person, so I want to give them the tools and knowledge they need to succeed independently of my services.
My Client Resource Hub is a treasure trove of resources tailored to their specific needs & the resources they may be looking for as their website & business grows!
Stage 13: Transitioning to their Support Period 🌟
Lastly, at the end of the call I remind them that their Support period begins on Monday (the first business day after their project ends), that I’ll be sending access to all their project’s deliverables by the following Friday (usually via Dropbox or Playbook links so they can download the files remotely).
I also ensure my clients are set up for success beyond the project with an included 30-day support period while they wrap up final website related tasks.
My support period is almost entirely automated between ClickUp automations and Dubsado Workflows, with reminders and review requests scheduled to go out at intervals throughout the 30-day window. The ClickUp portion is a form (created in ClickUp) so that new form submissions show up in my account as a task with a due date, and automations let the submitter know that I’ve received, and update them when I begin working on (change the status of) the task.
It's a neat way to wrap things up and let the client know they're ready to soar on their own, ––but that I’m also here for backup if they need it. 😉
The 30-day support period is there to… well, SUPPORT each client while they get their sea legs, and it's a testament to my commitment to their long-term satisfaction.
what next?
There you have it! All my secrets. 😂
Who am I kidding, there’s a LOT more to divulge, but that wouldn’t be a blog post anymore –it’d be a whole COURSE.
I hope you enjoyed this deep dive into my comprehensive two-week client journey. Each stage is meticulously designed to provide a seamless and satisfying experience for both me and my clients. If you're curious about any specific stage or want to learn more, leave a comment below with your questions.
