Of course we use Buzzy ourselves! When we say "Built by designers and developers that know things should be easier" - we really are our own target audience. 😊
When we wanted to promote a limited free trial license for Buzzy via a series of online ads, we needed a landing page with an email signup form that the ads could direct a user towards.
The signup form submission would redirect to whole new page that outlined the next steps for the user. At the backend, the submitted email addresses needed to be added to the correct Buzzy user lists, and trigger an automated email response.
All of which adds up to complexity and time, which we didn't have. The landing page had to go out now, to coincide with a window of opportunity for our ad campaign.
Figma + Buzzy to the rescue
Luckily, there's a simple solution available - and we just happen to build it. Since we were already wire-framing and designing in Figma, it made sense to use the Buzzy plugin to markup and deploy our Figma design as the actual landing page, complete with working signup form.
Here's our initial wireframe cut-&-pasted together in Figma. Ugly but did its job.
That was refined and worked up into this design (still in Figma)...
...which was marked up and deployed with the Buzzy plugin. We haven't left Figma yet!
This could all be done by our designer, Rihan. So far so good! We've gone from an initial wireframe, to a deployed website with a working signup form that captures email addresses - all without leaving Figma.
The 'tricky' bit
Now for the 'tricky' stuff - redirecting submitted email addresses into SendGrid (an email delivery platform) to trigger an email response to the new user. This could be done via an API call in a Buzzy 'rule'.
Setting up the Buzzy 'rule' with an API call required a tiny bit of code work in the Buzzy CMS, which was easily taken care of by Adam (Buzzy founder and CEO).
When SendGrid received a call from the Buzzy landing page with a newly submitted email address, it would fire off an automated email response welcoming the new user and providing additional information. We already had email templates ready to go, so there was little effort involved here beyond defining a new SendGrid campaign , and tweaking some wording.
Job done? Not so fast.
The initial design was functional, but not the prettiest. We also wanted to refine the wording, and add some tracking code so we could monitor the campaign's effectiveness. No problem. We simply edited our Figma design, and hit re-publish - the changes were instantly deployed, with no interruption to our live landing page.
The end result
We managed to design and deploy a functional landing page extremely rapidly and we could work in Figma almost the entire time. Tech expertise (in this case Adam) was needed only for the API interaction with SendGrid - the design, production and deployment tasks could all be done in Figma by Rihan, the designer.
Need something similar? Happy to share
Best of all? A version of this landing page design is available as a Figma community file for you to copy, use and modify however you see fit. The design has already been marked up with the Buzzy plugin, all you need to do is grab the file, open the Buzzy plugin and hit publish!