For the Make It Real challenge, I’m submitting a Squarespace landing page for Design Forward, a four‑week live bootcamp for web designers exploring how AI can streamline the tedious parts of their process. This site is built entirely with Squarespace’s native design tools, with NO custom CSS, JavaScript, or extensions.

The landing page invites interested designers to join our waitlist for the September launch, built on a visual identity I’ve been crafting with my talented friend Edinah of Wildlogic.

My goal for the experience is to guide the user’s attention while reinforcing the brand’s message. Design Forward is catered to multilayered creatives who are ready to push boundaries, so I wanted those unexpected layers to reveal themselves as you scroll. The overall feeling is optimism and artful play; brought to life with Squarespace’s new Finish Layers feature.

How I used Squarespace’s Finish Layers

🩶 Font uploads The Design Forward type system pairs vivacious 1960s letterforms with fashion‑forward contemporary typefaces. Using the Font Upload feature, I applied four custom fonts across the site without any added code. The Scale Text feature helps achieve both visual coherence and proper heading hierarchy, supporting both SEO and accessibility. 🩶 Block Transforms and Animations

I combined block animations, transforms, and the pin block feature not only to introduce movement, but also to transition smoothly from one color theme to another — blurring the boundaries. The animations are carefully sequenced based on scroll progress so the story unfolds one scene at a time.

For the horizontal scroll section and scrolling banners, I layered scale and offset animations to move the composition across the screen and add visual interest. 🩶 Stacks Stacks are the backbone of the layered editorial cards and complex yet responsive layouts. I nested stacks within stacks to achieve the editorial composition and animated each stack. Because stacks can include any element, I used video blocks inside these cards for accessibility and flexibility—perfecting one card and then duplicating it for consistent motion and layout.

🩶 Mobile overrides Independent mobile settings let me adjust transform values, timing, and layout specifically for smaller screens, creating a streamlined mobile flow without compromising the desktop experience.

Live site: https://designforward.live

Social Posts

🩶 Post on X

🩶 Post on Instagram

🩶 Post on Youtube Additional walkthroughs

- Full homepage recording

- Process snapshots

Platform: Squarespace

Approach: 100% no‑code. Purely using Squarespace's native tools. No custom CSS, JavaScript, or third‑party extensions

Image and video assets from DTS and AI generation.

A homepage is one of the worst places to send paid traffic. One mistake I see companies make all the time is spending a lot of money getting people to click an ad, only to send them straight to the homepage. Imagine clicking on a Netflix trailer for a movie that looks amazing. You're excited, you hit Play... but instead of taking you to that movie, Netflix drops you on the homepage. Sure, the movie is somewhere on the platform. But now you're the one searching through categories, recommendations, and thumbnails to find the very thing you clicked for in the first place. That's exactly what many landing pages feel like. Your ad and your landing page should tell the same story. An ad is built around a single promise, so when someone clicks it, the landing page should immediately continue that promise instead of asking visitors to navigate your website and connect the dots themselves. One of my favorite landing page principles is simple: Give people what they came for as quickly as possible. Every extra second they spend figuring things out is friction, and friction is one of the easiest ways to lose a potential customer. For this speculative Notch campaign, every ad revolved around one promise: resolving customer support tickets. Running those ads to the homepage wouldn't make much sense. The homepage has to explain everything Notch does, while the ads are only making one promise. That's why I designed a dedicated landing page focused entirely on ticket resolution, allowing the message from the ads to continue seamlessly instead of starting over. In my next post, I'll break down how I developed the ad campaign using my EPAC framework and why each creative plays a different role in the buyer journey. If you'd like to explore the full campaign, I've left the link in the comments.

Great design with great visuals!