Study of framer.com promo video

I was recently pointed to framer.com. The homepage does an excellent job of marketing the product. By this, I mean that after visiting it, I wanted to use/buy the product. I didn’t actually have a great idea of what the product is for, but I wanted to use it. This, I want to use the product, is the aim of good advertising.

How does the homepage achieve this? First, it’s a full screen autoplay video. It begins silently, but has the option of “Replay with sound”. This avoids the risk of annoying your visitor with unwanted sound.

The entire video is 40 seconds. Short enough to keep my attention for the novelty of it.

When the video finishes, it seamlessly gives way to the website. Effectively, the “hero” text of the homepage is the last slide of the video.

Key to the video is music. It’s punchy, energetic and makes the product seem cool. It has a very strong beat. The slides and animations of the video are timed to the beat.

The bass starts 5 seconds in. At 16 seconds, and again at 26 seconds, there is silence for one bar of the music. This breaks up the video and adds surprise.

It starts and ends with the Framer logo.

The first 27 seconds are animations of the product. The product itself makes animation stuff, so demos of the product itself are visually engaging. This gives way to the final 13 seconds which are mostly pure text slides. Here are the slides:

These are too short and simple to be informative. They’re just words vaguely related to the product. They set the scene, much like the music and brief clips of the product just set the scene. All these elements say, “This is how the product feels. It makes you feel good.” Once the user likes how the product feels, they go on to find out what it is.

Tagged #framer.com, #video, #animation, #design, #marketing, #ux.
👋 I'm Jim, a full-stack product engineer. Want to build an amazing product and a profitable business? Read more about me or Get in touch!

Similar posts

MP4 can encode superwhite and superblack, thanks to analog TV
Screen recording accidentally encoded superwhite/superblack due to obsolete yuv420p(tv) color space; rescaling fixes it. 2021-01-13
A cat walk cycle
A pixel art animation of a “walk cycle”, created using GIMP, for use in a retro game. 2018-12-28
Page margins in principle and practice external link
2010-01-25
It might not need a label
Often, content is self-labelling. Removing its label can make the content more scannable. Programmers often over-label. 2024-03-20
Les Aventures De Toupac - a pixel art game
A pixel art game developed over Christmas, with code on GitHub and development on Glitch. 2019-12-28
How to draw sprites on an HTML canvas
I demonstrate animating a cat walk cycle on an HTML canvas using a sprite sheet image and the drawImage method. 2018-12-29

Similar posts

MP4 can encode superwhite and superblack, thanks to analog TV
Screen recording accidentally encoded superwhite/superblack due to obsolete yuv420p(tv) color space; rescaling fixes it. 2021-01-13
A cat walk cycle
A pixel art animation of a “walk cycle”, created using GIMP, for use in a retro game. 2018-12-28
Les Aventures De Toupac - a pixel art game
A pixel art game developed over Christmas, with code on GitHub and development on Glitch. 2019-12-28
How to draw sprites on an HTML canvas
I demonstrate animating a cat walk cycle on an HTML canvas using a sprite sheet image and the drawImage method. 2018-12-29
Page margins in principle and practice external link
2010-01-25
It might not need a label
Often, content is self-labelling. Removing its label can make the content more scannable. Programmers often over-label. 2024-03-20

More by Jim

What does the dot do in JavaScript?
foo.bar, foo.bar(), or foo.bar = baz - what do they mean? A deep dive into prototypical inheritance and getters/setters. 2020-11-01
Smear phishing: a new Android vulnerability
Trick Android to display an SMS as coming from any contact. Convincing phishing vuln, but still unpatched. 2020-08-06
A probabilistic pub quiz for nerds
A “true or false” quiz where you respond with your confidence level, and the optimal strategy is to report your true belief. 2020-04-26
Time is running out to catch COVID-19
Simulation shows it’s rational to deliberately infect yourself with COVID-19 early on to get treatment, but after healthcare capacity is exceeded, it’s better to avoid infection. Includes interactive parameters and visualizations. 2020-03-14
The inception bar: a new phishing method
A new phishing technique that displays a fake URL bar in Chrome for mobile. A key innovation is the “scroll jail” that traps the user in a fake browser. 2019-04-27
The hacker hype cycle
I got started with simple web development, but because enamored with increasingly esoteric programming concepts, leading to a “trough of hipster technologies” before returning to more productive work. 2019-03-23
Project C-43: the lost origins of asymmetric crypto
Bob invents asymmetric cryptography by playing loud white noise to obscure Alice’s message, which he can cancel out but an eavesdropper cannot. This idea, published in 1944 by Walter Koenig Jr., is the forgotten origin of asymmetric crypto. 2019-02-16
How Hacker News stays interesting
Hacker News buried my post on conspiracy theories in my family due to overheated discussion, not censorship. Moderation keeps the site focused on interesting technical content. 2019-01-26
My parents are Flat-Earthers
For decades, my parents have been working up to Flat-Earther beliefs. From Egyptology to Jehovah’s Witnesses to theories that human built the Moon billions of years in the future. Surprisingly, it doesn’t affect their successful lives very much. For me, it’s a fun family pastime. 2019-01-20
The dots do matter: how to scam a Gmail user
Gmail’s “dots don’t matter” feature lets scammers create an account on, say, Netflix, with your email address but different dots. Results in convincing phishing emails. 2018-04-07
The sorry state of OpenSSL usability
OpenSSL’s inadequate documentation, confusing key formats, and deprecated interfaces make it difficult to use, despite its importance. 2017-12-02
I hate telephones
I hate telephones. Some rational reasons: lack of authentication, no spam filtering, forced synchronous communication. But also just a visceral fear. 2017-11-08
The Three Ts of Time, Thought and Typing: measuring cost on the web
Businesses often tout “free” services, but the real costs come in terms of time, thought, and typing required from users. Reducing these “Three Ts” is key to improving sign-up flows and increasing conversions. 2017-10-26
Granddad died today
Granddad died. The unspoken practice of death-by-dehydration in the NHS. The Liverpool Care Pathway. Assisted dying in the UK. The importance of planning in end-of-life care. 2017-05-19
How do I call a program in C, setting up standard pipes?
A C function to create a new process, set up its standard input/output/error pipes, and return a struct containing the process ID and pipe file descriptors. 2017-02-17
Your syntax highlighter is wrong
Syntax highlighters make value judgments about code. Most highlighters judge that comments are cruft, and try to hide them. Most diff viewers judge that code deletions are bad. 2014-05-11

This page copyright James Fisher 2017. Content is not associated with my employer. Found an error? Edit this page.

Jim Fisher
CV
Speaking
Blogroll
RSS
TigYog
Kickabout