Landing page design process
From a business idea to a storyframe, to a Figma design, and a final landing page presenting my UX design micro-consultation offer.
I previously wrote an article on how I used “storyframing” to clarify the story of the landing page I was about to create about my UX design micro-consulting offer. It’s linked below in case you have not seen it.
The page is now live and I wanted to summarize the full process so I can remember what I did, and maybe anyone can get some tips and tricks as well.
- Storyframe — To clarify the idea and to structure the web page
- Copywriting — Based on the storyframe I wrote the complete copy for the page. No formatting except headlines and bullets and CTA (call-to-actions)
- Layout — Made in Figma with the copy, added an illustration from Unsplash, added buttons, lists etc
- Web design — Set up the page in my Wordpress-powered site, using the Semplice theme (which offers a nice drag-and-drop design experience)
- Calendly integration — connecting the free 15-minute meet-and-greet to a Calendly page where users can book a slot.
Nothing strange really when it comes to the process. I think the storyframe was an excellent way to collect my thoughts, sharpen the story, and remove any unnecessary clutter.
Where the process was not as straightforward, as when I got into Figma. Only then I realized that some headlines maybe should not be headlines, some copy needed to be split into blocks etc.
Basically, the challenge was to make the page not so repetitive from a visual point of view. So I went back and forth between copywriting and visual design. This makes it obvious to me that those need to be created in close collaboration if done by more than one person.
For me, this has been partly a design exercise, and partly a potential business. For the moment I prioritized getting the page up, rather to add all features I planned for.
I currently offer a 15-minute free meet-and-greet (more of a lead generator) and a “contact me to get an offer”. The reason I have not connected the paid micro-consulting options (besides I needed to upgrade Calendly) is mainly that I am looking for learnings on how to drive users to the page and the process of creating content for a page, rather than the potential revenue.
Next steps for my landing page
- Get a better understanding of Google Ads
- Get insights into how small to medium businesses would search for my type of service, especially micro-consulting.
- Learn what users are doing on my page. For that, I will look into heatmaps and other tools offered by Hotjar.
