SDC 1.0 User Guide
⚠️ Update April 2023 ⚠️
This onboarding guide is for Squarespace Design Course 1.0. If you enrolled in the course after April 2023, please refer to the Squarespace Design Course 2.0 Onboarding Guide.
⚠️ Update April 2023 ⚠️
This onboarding guide is for Squarespace Design Course 1.0. If you enrolled in the course after April 2023, please refer to the Squarespace Design Course 2.0 Onboarding Guide.
If this is not the portal you’re seeing you might be in the new Course Portal. If that’s the case, check out Onboarding Guide for the latest version of the course!
First of all, make sure you’re using Google Chrome (you’ll need it for Level 1 anyways).
Then, use this link to login to the course portal.
Still having trouble? Email us at hello@ilovecreatives.com.
Say hi to your astronaut avatar. 👋 Yup, that's you! Click your mouse to move the astronaut around and click the blue orb button to play the first video. Once you close the video—voilà! You’ll see a staircase appear and you can enter the archway to watch the lesson video.
To return to the main portal, click the orb button to the right of your astronaut's desk.
You'll have a few browser tabs open to:
Watch the videos
Reference a Squarespace template or inspo website
Your website
View other resources, images, check up on Discord, etc.
Yes and yes! Click the ⚙️ settings gear to change the speed of the video.
Next to the settings gear is the “Chapters” timestamps — this allows you to jump to different sections. Our videos are hosted on Wistia, so you can also use their handy keyboard short-cuts to start, stop, fast forward, rewind, etc.
The Resource Library can be accessed through the portal menu and the button below. There’s some good stuff in here including course events info, Level guides, and past Live Office Hours videos. You’ll want to bookmark it so you can easily refer to it!
⚠️ Also, TAs will be reviewing your work with a lot of detail so please make sure you get a good nights rest before you submit! The next day, double-check your work, thennnnnn submit. If you need any help, advice or just a pep-talk, reach out to us on Discord.
Level 1: Template Deconstruction aka Brine into Pedro (7.0)
Puno will walk you through how to turn one template (Brine) into another (Pedro). After this level, we want students to feel comfortable with the Squarespace platform and using the Developer Tool.
Level 2: 7.0 Template Master
Students will learn the main differences and key features of each Squarespace 7.0 template.
Level 3: Design Three Websites
In this level, students will:
(1) Learn 7.1 by recreating the Halcyon template (with an introduction to CSS)
(2) Recreate an inspiration website
(3) Design a custom website
Once you’ve completed all three websites, Puno and the TAs will provide feedback on your design work and tips for how to improve.
Level 4: Freelancing
This level is all about figuring out your hourly rate, how to find clients, client on-boarding, and all the tools you need to begin freelancing.
You'll need four:
Level 1 – Brine into Pedro
Level 3.1 – Halcyon
Level 3.2 – Inspiration Site
Level 3.3 – Custom Site
For Level 1 make sure to start with a 7.0 Brine template.
This is a trick we LOVE to use. Once your trial site expires, add /config/extendtrial to your built-in domain.
So if your built-in domain is name.squarespace.com, then you’ll type in name.squarespace.com/config/extendtrial in your browser.
You can use this indefinitely for any site, but you'll have to remember to renew it every time it expires after the 14-day trial period.
📹Watch: How to extend your trial
Ruh-roh! When in doubt, follow the template. Squarespace is consistently improving its platform and sometimes we don’t catch everything.
Keep an 👀 eye out for a small note on the top right of the video. We’ll note updates and what to do. If you see other discrepancies, let us know the timestamp in the #level1 Discord channel!
You should receive feedback within 72 business hours (not including weekends), and be notified over Discord and email. Still haven't heard back? Let us know in the #level1 Discord channel.
While you wait, feel free to move to Level 2!
So... we're going to be honest here — we strict! Like, down to the font-style and line-height strict. Seriously, our graders really get into Chrome Developer Tools to double check your work.
In the design world, being detail-oriented is what sets you apart from the green. It's also, pretty much expected. We want you to leave this course feeling confident about your skills and ready to get that dough. So we provide you with the highest level of feedback possible! We know it can feel like a lot, but it will really help set you up for success.👏
We look for 90% accuracy in the following areas:
Content
Does this site have all of the pages (Homepage, Shop, Blog, Info and at least 3 Product Pages?). Check that all copy, headers, images and buttons are there.
Layout
Is the content designed like the original? How are the margins, columns, font sizes and line-heights? Does this site use all the correct blocks?
Fonts, Colors & Images
Now check that the regular AND overlay fonts are correct. Do the colors have the right hex codes (psst, have you checked the cart quantity color? 👀). Each product image should also be the right aspect ratio.
Attention to Detail (aka Typos)
Overall, was this site reviewed for any typos, spacing issues or incorrect content? Do the quote blocks have extra quotation marks or dashes? What about each product image — do they correspond to the correct price?
Mobile View
Is mobile site view as accurate as the desktop version? Check that hamburger menu!
This level is supposed to be hard! If you have any questions or get stumped:
First take a deep breath.
Drink some water! 💦
Then, take a walk (aka hard refresh).
If you still need support after coming back to a problem, share your question in the #Level1 Discord channel. Screen record your issue (we 💖 CloudApp!) so other students can help you out and learn with you!
You can reference the Level 1 - Transforming Brine into Pedro resource which goes over common feedback TAs give when grading.
Track your time! We mean it!
If you're ready to submit your site, make sure to:
Double-check your work. Go over the common feedback list to ensure you didn’t miss anything. If you need to sleep on it to get one final set of eyes, go ahead. This is a self-paced course!
Make the site password-protected and set the password to backandforth
Submit your URL in the Online Course Portal AND drop it in the #Level1 Discord channel. We want to celebrate you and your accomplishment! 🎉
If you've already received feedback and need to resubmit, you can do so in the Course Portal!
Yeahhh congrats! 🙌 Before you start Level 3, you'll need to start a new Squarespace Trial. That way, you can start Level 3 while you wait for your Level 1 Brine into Pedro to get graded. For Level 3.1 make sure to start with a 7.1 Essex template.
In Level 3, you'll be submitting the following three sites for review:
Recreation of Halcyon (a custom template Puno created)
Recreation of an inspirational website
Your own custom website
This one is a doozy, but we wanted you to get a feel of what it’s like to juggle three projects. Dat Freelance Life. We highly suggest that you make a calendar, track your time, and reach out anytime you feel stuck.
For Halcyon (3.1), you'll receive feedback similar to Level 1. There will be a lot more CSS with this one!
For your inspiration site (3.2), pick a website that you included in your intro. Some people go ham and build out the entire site (Ask Nayadé — she recreated Another, which inspired one of the Cookie Rewards), but we’ll also be fine with recreating 1-3 pages. If you’re serious about freelance, we suggest to go off! Once you submit, Puno will review your site and give you feedback.
For your custom website (3.3), Puno will provide detailed actionable suggestions in a recorded video. This takes sometime for her to review so give her 1-2 weeks.
Yes! Actually, we would rather not have real client work. You need to satisfy your client and that might go against Puno’s design suggestions. Design is subjective after all!
Instead, create a fictional business or pick a real business that could use a redesign.
Farrah B. Fox redesigned Maven-Made and then cold emailed the brand's owner. Guess what?! They decided to move forward with her design! We can’t guarantee it’ll always work out, but you can definitely put it on portfolio as a Spec Site. Art students do this all the time. 😉
📹 Watch the video to see Bronze’s feedback for Mary Kate Hayden's custom website.
Think of Discord like our student center, cafeteria… The Max from Saved by the Bell if you will. This is where you'll connect with your fellow students and graduates. Each channel starts with a # sign, and is a dedicated space for a specific topic or level.
Discord is sort of crazy / fun / cool / big so just get in there and play around. Everyone in the course is in this Discord community — including students who’ve already completed the course.
First, tell us a bit about yourself with the #intros tag, and read everyone else’s intros and websites they love. We HIGHLY encourage you to comment and ask/answer questions. So many great things have come out of students engaging — job opportunities, collaborations, friendships!
We love Discord because it's really what our community makes of it.
Some things you can do:
#sdc-announcements – Hear about Squarespace Design Course announcements
#squarespace-design-course– Ask specific questions about each level
#gig-alerts – Post or ask for collaborations and work opportunities
#pep-talk – Digitally vent, or ask for some words of encouragement
#work-questions – Ask your non-course related work questions here
#internet-gems – Share your completed 3.3 and non-course related work sites
VERY good question. This is Discord Etiquette 101. If you ever find yourself in a team of designers or developers, this is how they work 😉.
When asking a question:
Make sure your website setting is Visibility: Password Protected and answer the following:
🖥Website URL:
🔑Website Password:
🤔What’s the issue?:
Include a screenshot or screen-recording of what you’re experiencing (we love to use Cloudapp, it's free!). This is a super efficient, time-saving tip for any designer. Tell your future clients to do this too!
Emojis are also super fun and helpful! Once your question is answered, add a ✅ reaction to the main thread so everyone knows you've been helped.
When answering a question:
Please, reply to the thread so we can keep conversations nice and tidy! We often link to threads, but it’s hard when they aren’t in one thread.
Also, @mention them in your answer so they're notified. We LOVE it when students help each other.