tw-rl

Today, we introduce the new @frame_io brand. This was an intense labor of love, and I'm so very proud to stand behind the work. Our in-house Brand Studio designed nearly every aspect of this rebrand. I’m blown away by what our small team was able to accomplish. A thread…

First, a preamble. The work you see here represents only a *tiny* fraction of this effort. There were countless creative explorations left on the cutting room floor, and the sheer volume of creative execution happening behind the scenes was nothing short of remarkable.

We scrutinized every detail to an excruciating degree, and it was admittedly a painful process. But we made it through to the other side—together. I am so grateful for our team, and I’m honored to be working with them.

Logo. Refined, yet it continues to pay homage to our original mark and company origins.

Color. Our primary palette is derived from our product’s visual language to ensure consistency in user experience—both in our communication and the service our product provides to millions of filmmakers around the world.

Type. Our custom typeface, Frame Gothic, is a modernist sans serif. Designed in partnership with Monotype.

Spotlight. Derived from the tip of our mark, our Spotlight is a distinctive visual element of our brand language. It can be cropped and positioned in endless orientations. It is always able to be new.

Area light. Light is an essential part of film and cinema, and we use light in distinct ways to showcase our brand and bring content to life. Capturing the ambience of a filmic workspace—a darkened edit bay or soundstage.

Cast light. Cast light reflects the dominant colors in an asset and often radiates beyond its boundaries for a heightened presence on the page.

Photography. Our photography and art direction is about aspirational realness. It should feel cinematic, immersive, and striking. Whether on set or in an edit bay—we craft highly considered worlds that inspire the craft of storytelling.

That’s a wrap. We made a little microsite to share our brand assets and celebrate the launch. https://brand.frame.io/ Finally, a *massive* thank you to our Brand Studio team. I appreciate each one of you 🖤

I audit 100's of webflow sites every month. Here's the #1 deadly mistake I see on some of the best webflow sites in the world. Read this 3-minute tutorial & you'll learn: - What it is - How to fix it Thread 🧵

BONUS This thread is the best I can do via text. But you'll learn a lot more from watching the 7-minute video version I recorded for you. Like & comment "horiz" under the 1st tweet (above) & I'll DM it to you

I've seen it on so many great sites Look at the photo below. There's an unnecessary horizontal bar at the bottom of the screen. Is it on your site? It's creating a really poor user experience. Why?

Horiz scrolling is making your pages "sticky" Users are trying to scroll. But when they do, the page won't move. This is making people leave & it's KILLING your conversion rates. But it's SO EASY to fix. If you're using webflow, you probably haven't noticed it because...

It’s a sneaky problem that doesn’t show up when you preview the page. But click publish and BOOM! It’s right there. How do you know you have the scroll issue? Watch this:

Unnecessary horiz scroll happens when: 📍 Your site has multiple sections with different widths, and 📍 Your VH & VW values are set to fixed widths But you can fix this in one of 2 ways. Here they are:

2 things you can do to remove unnecessary horiz scroll from your webfow site: 1. Change the style of the page 2. Change the section width to 100% Let's dive in:

1. Change the style of the page Change the Body, VH and VW values of your page to Auto. This will auto expand the pages to fit the width of the screen. Just make sure the parent section does not have any style added (like flex or grid) See below:

2. Swap viewport fixed widths for %'s Locate the Size option and change VW to 100% You can also use 100 VW But VW used with flex styling gives the same scroll issue.

Quick tip 100 VW works well when you have single pages, a pop-up, or an overlay Basically anything that doesn’t need you to scroll But when the page has different sections, the scroll issue comes up. So it’s advisable not to use VW for sections

BONUS This thread is the best I can do via text. But you'll learn a lot more from watching the 7-minute video version I recorded for you. Like & comment "horiz" under the 1st tweet (below) & I'll DM it to you

Ailín Tobin • 10-Day Webflow Dev 🇮🇪 @tobinthe2ndI audit 100's of webflow sites every month. Here's the #1 deadly mistake I see on some of the best webflow sites in the world. Read this 3-minute tutorial & you'll learn: - What it is - How to fix it Thread 🧵 twitter.com