Tutorials

← Back to Content patterns

Structure

Each tutorial video should follow this 3-part structure.

  1. Quickly showcase the finished design in context of a polished site. This helps people understand what they’ll be building right off the bat. E.g. “I’m going to show you how to customize your website for different devices” (show final website, switching between different media queries to illustrate concept). Use one of your own templates, a Webflow template, or a community member’s design. Highlight the completed functionality in action (add an item to your cart, click through the slider, submit a form, whatever)
  2. Do a detailed, step-by-step walkthrough. Explain why you’re taking key steps, especially when it’ll help people apply your instructions to their own projects. E.g., if you’re replacing bits of code with dynamic parameters, take a second to say why you’re doing that.
  3. Finish by returning to the completed design. Sign off with something like “Good luck on your project, and if you run into any trouble, email us at support@webflow.com or ask the community for help at forum.webflow.com.”

Presentation

Crop out your browser’s chrome and blur or otherwise obscure the webflowtest domain when you go to publish.

Distribution

Keep in mind that people may be discovering Webflow for the first time via YouTube, so be sure to:

  1. Write descriptive text for the video (keeping search in mind)
  2. Include a link back to a relevant portion of the marketing site

Example, for a CMS-focused video

Learn more and get started for free at webflow.com/cms.

Tutorials

in use

Check out the Tutorials in our Help Center for tons of examples.

Tone

Speak as you would to a fellow creative professional or colleague. Our videos should educate, not market.  

Be:

  1. Professional but friendly
  2. Informative not salesy

Speak as if your viewers are sitting in the same room as you, not as if you’re evangelizing. If your voice rises and falls a lot, you might sound salesy.

Readers' feelings

Wow, that was such a clear and detailed walkthrough! I feel totally prepared to do this on my own site now.

Resource(s)

Nothing yet!