Webflow AMA 1-Pager

Webflow AMA 1-Pager

A dope 1-page website to be a resource and host an AMA meetup about Webflow.

Webflow AMA 1-Pager
Content

Define

I hosted an AMA meetup around Webflow and if it could help agencies and biz. I was initially going to do a simple slide deck presentation before the meetup to educate on my journey from WordPress to Webflow. However, I thought, "...why not be badass and make a presentation in Webflow since we are talking about Webflow?" The other aspects the 1-pager needed to accomplish were the following: show-off interactions, animations, bomb design, responsiveness, ease of use, and house resources that the AMA attendees could access later.

Homepage 'Slide 01'
More Menu Functionality

Design

The design direction was positioned for the following audiences: business owners and design agencies. I wanted to make the design like each section intentionally was a slide in a slide deck. Each section would animate in and show off various aspects of Webflow. The design was more modern to appeal to design agencies and provide a level of wow. We developed a technique of cutting out layers of the Webflow UI to form an illustration style that was appealing and flexible for the build. Overall, the design was to wow, create intrigue, and show off Webflow in a simple way. Nothing too flashy, but solid design.

Slide 02
'Slide 3' which also had the timeline animate.
'Slide 4'
'Slide 5'

Deliver

We built the site, implemented IX design in Webflow, and documented the build via screen share. We intend to create a ton of tutorial videos from this build, adding a layer of richness to the design by posting the tuts on the site in the resources section. For the design, we used Figma for the UI. In addition, we used images from Unsplash and edited them to be slightly bespoke. The headline and section label type we chose to use was Mint Grotesk. The body copy was Capito. Both type choices are from Future Fonts, our favorite spot to get some unique faces. 

Last 'Slide'