Recently I did a video on whether you should become a webflow template designer and talked real numbers about what is involved and how much you can make. Today, I'm going to take you through the step-by-step process that I go through to create my Webflow templates.
I'm going to outline all the stages I go through, including idea generation, looking for inspiration, concepting the design, developing the template, all the admin pages to include, and finally marketing the template. So let's jump right in!
Finding Ideas
Idea generation can be one of the easiest or the hardest parts of being a creative. Some weeks you'll have plenty of new ideas and some weeks you'll have none. But there are a couple of ways that I make it easier to find great ideas for new templates.
Firstly I look on other template marketplaces, such as ThemeForest, Creative Market, UI8 or Template Monster, otherwise I browse the templates of other website builders, such as Wordpress, Squarespace, Shopify, Semplice, or Cargo.
When looking through all these marketplaces, I'm jotting down ideas for templates that I haven't seen before on the Webflow marketplace, or just in a style I haven't seen before.
This is because in the marketplace you can either build templates for popular categories where there are already plenty available, such as for portfolio sites, or you can fill a gap in the marketplace where there is a unique need that isn't being filled, which can be a little bit harder to think of and find.
For example, for pets, there are already templates for vets, and for pet insurance, and for adoption shelters, but none for pet food, dog trainers, or dog walkers.
Once I figured out exactly what I want to do the template for, I move onto finding inspiration.
Looking for inspiration
Now in some ways this can be similar to looking for ideas, but in this stage I'm looking for real world examples of websites in the category I'm designing for. I'll usually make a new tab group for inspiration and add to it to find great examples.
This is a pretty similar process that you might go through when looking for inspiration for building client sites, but you'll be looking for both design style, and also the actual pages to include in the website.
Restaurant websites will have a certain look to them, but they will also include pages that not many other kinds of websites do, such as a page for their menu and a page to book a reservation.
Through this inspiration process I'll also go on sites such as Dribbble and Behance and take screenshots of designs that might fit the style I'm going for. Then I'll collect them all in a Figma file where I also create assets for the website too.
Designing and developing the template
Once I have enough inspiration, I'll usually throw around some ideas in Figma to test overall ideas and themes without having to build them, but I don't design everything in Figma first like I might do with client projects, and this is usually a waste of time and I can still test out ideas once it's in Webflow anyway.
Once I have a rough idea of what I'm going for I'll get straight onto developing the main pages to see how it looks in Webflow and how it might adapt across the different screen sizes.
Webflow has quite strict guidelines around the naming system used, and so when building each template I always try to make the system inside of Webflow as simple as possible.
Using a system like Finsweets Client First approach doesn't really fit when creating templates as you have to make most of the sections quite multi-purpose, since you can't be exactly sure what content a customer is going to put in a given section.
