Interview

How Matt Studdert grew Frontend Mentor to $6k monthly revenue

matt_studdert
Matt Studdert - Frontend Mentor

In the January edition of our London founder interview series, we spoke to Matt Studdert on growing Frontend Mentor to $6k monthly revenue.

Hey Matt! Great to chat to you. To get started, how would you describe Frontend Mentor?

Hey Charlie, thanks for the interview! Frontend Mentor is an online learning community for front-end web development. However, instead of offering tutorials, we provide realistic challenges for people to practice on and improve their skills by building projects. You can submit your solutions on the platform and get feedback from others on the platform.

Can you tell us a little about your background and how you got into building products?

Sure! I’ve had a very winding journey to get where I am today. Growing up I loved playing sports, so when it got time to apply for university there was only one subject I wanted to study and one location where I wanted to study it: Sports & Exercise Science at Loughborough University.

I was lucky enough to get in and completed my degree there before setting up my own personal training business. As the business grew, I started to get frustrated with the time for money trade off that is part and parcel of being a personal trainer. I got to a point where I was fully-booked and needed to make decisions on how I was going to scale. One option was to buy a gym, but the overheads and the competition are crazy, so that would be extremely high risk. Another was to take on other PTs to work with me, but I had experience of sending clients to other PTs for a commission and they would end up just taking the clients after 6 months or so and any commissions would dry up. So I felt like I had hit a ceiling on where I could take it. 

As soon as I came to that realisation I started having new ideas for potential businesses, however they were always online business ideas. I decided to move back to London to try and find a new career path and managed to get a role as the first employee at a health & nutrition product company called PROMiXX. However, after only 6 months there I missed having my own business. Seeing as all the ideas I was having were online businesses, I decided to start learning to code. Soon enough I saw an ad for General Assembly in London and decided that I should enroll in their bootcamp to get a solid grounding in the fundamentals.

So at the age of 28, I made another big career change with the aim of becoming a developer and being able to build my own products later down the line. Making that change is the best professional decision I’ve ever made. I had never been exposed to coding growing up but as soon as I started I wondered where it had been all my life!

The first product I tried to create myself was an epic failure. I didn’t even get close to launching anything. The idea behind it was to create a “Zapier for fitness”. People would be able to link all their various fitness accounts (MyFitnessPal, Strava, smart weighing scales, etc) and connect them all up to get useful data aggregation and visualisation of their lifestyle. I never fully validated it, I just jumped into building it. 6 months later I still wasn’t anywhere close to launching.

Out of sheer frustration I decided to launch something that I knew would help people, no matter how small. Which led me to register frontendmentor.io where I first simply put up a list of resources for front-end developers that I had found useful over the years.

Where did the idea for Frontend Mentor come from, and how did you validate it?

After putting the resource list live on frontendmentor.io it gave me such a big motivational boost. I shared it around on LinkedIn and a few other places and got some great feedback. It had only taken me a day to create, but people were already using it and thanking me for putting it together.

Riding on that high I started to think of other things Frontend Mentor could be used for. One thought that popped into my mind was that my students at General Assembly (where I was now a contract instructor) would always ask me where they could go to practice building websites. My answer had always been to build their own projects or try to recreate Dribbble shots. But I was never satisfied with this answer. Developers are typically not good designers, so the websites they create from scratch don’t often look the best. Also, Dribbble is made for designers, not developers, so it can be hard to find a shot that is possible to recreate. So I thought I’d see if people would be interested in building projects based on professional designs. After all, this is how developers work on a day-to-day basis, so it would help build applicable skills while also creating a portfolio of high-quality projects.

I immediately started searching for design resources and came across a site called Sketch App Sources that allows you to download free Sketch designs. I found a small component design and emailed the designer to make sure they were happy with me using their design and put it up on the site. Another article and a few social posts later and people were downloading the design! Sure enough, a few days later people started sharing their solutions to show their work and try to get feedback.

This validated my hypothesis that given a professional design people would download it, build it, share it, and try to get feedback. With this knowledge, I knew that there could be something there for a community to grow out of focused on collaborative learning through building projects and giving feedback.

At this point, there was no business model. My focus was to build a community and a platform and see if a business model could organically grow out of it.

Can you tell us about your business model? 

Frontend Mentor runs as a freemium learning community. The vast majority of people on the platform take our free challenges and don’t pay. But for the people who want our highest quality challenges and access to the design files we launched a paid subscription in August. This is perfect for people wanting to become professional developers or who already are professional developers and are wanting to improve their skills further. You can see everything about our PRO subscription here.

I took a while to properly monetise the platform as I wanted to make sure I did it the right way and didn’t force a business model. People often ask about being able to pay for senior developers to review their code, which could have been a direction to go in. But I decided against it as there are too many moving parts and it would be too hard to find a price point that would be affordable to the community but still worthwhile to the developers.

What’s the vision for Frontend Mentor?

There are lots of potential directions I’ve thought about for the platform. On a B2C level I want to keep building out the PRO offering and keep giving our community the tools to gain real experience building projects. There is so much room for growth beyond the standard tutorial approach which I’m looking forward to exploring further.

Although I’ve not done any interviews or in-depth research, I’m sure there will be B2B routes that could open up as well. By building our projects developers end up with incredible portfolios. I’d love to see if we can help close the gap between learning, practicing and then getting hired. So going down the route of turning the platform into a verticalised LinkedIn for front-end devs could be interesting. Essentially a Dribbble but for front-end devs! 

Frontend Mentor could also be an incredible training tool for development teams. So exploring the possibility of offering companies their own private version of Frontend Mentor to help train up their front-end developers could be another avenue.

At the moment, I’ll continue to focus on the B2C platform though and see what happens as things evolve. There are still a number of big changes I want to make before I’m happy with how it is.

What’s your tech stack?

We use Node.js and Express on the back-end with a Next.js (React) front-end. There are a bunch of services we use in addition like Digital Ocean for hosting, MongoDB for the database, Cloudinary for image hosting, and a number of other tools. For subscription management, we use Chargebee which then uses Stripe and PayPal for the payment gateways. I can’t say enough good things about Chargebee!

What growth tactics did and didn’t work for you?

The shareable nature of the projects has been the major growth mechanism for the platform. The more people that sign up, the more people take the challenges, the more people share their solutions on social networks, the more people discover the challenges and the platform. In the starter code for the free challenges I add a little attribution that says “Design by Frontend Mentor. Coded by [YOUR NAME HERE]”. It’s completely optional to keep it in, but a lot of people do. The “Frontend Mentor” part is a link to the site, so we get good traffic from that when people come across other people’s projects.

I’ve also started building great relationships with YouTubers who live stream themselves building Frontend Mentor challenges. This has been an awesome source of traffic as it’s such a good demonstration of the platform and the challenges. It’s a perfect win-win as the challenges provide them with great content for their audience!

I’m not sure about what hasn’t worked as I haven’t experimented too much. I’ve just seen what things people were doing and then focused on them. For example, I knew people were sharing the solutions around so I added the attribution text. I also noticed a few people pick up the challenges for YouTube live streams, so started building relationships with them. I definitely need to try more things but I’ve been happy with the steady growth rate, so I’ve been more focused making sure the platform suits the community’s needs.

What has worked by order of success

The biggest success by far has been giving the community the tools to build things they’re unbelievably proud of and want to share. All of our growth to this point has come from word of mouth with people sharing their projects and telling their friends and networks about Frontend Mentor. Although I already had this in place before reading this book, Badass: Make Users Awesome by Kathy Sierra sums this approach up perfectly. When I read this book it clarified everything around word of mouth growth for me so much.

What hasn’t worked

The things that haven’t worked are all the things I haven’t tried! There are so many areas that I’ve not even spent time on that I’ll need to in order to get the platform to the next step. I’ve been very inwardly focused on the platform and the community so I haven’t started things like getting myself out there, content marketing, SEO, having a coherent social media strategy, and everything else I need to consider at some point. 

What I want to try more of

I need to get better at getting the platform in front of more people. I’m awful at marketing and social media, so I’ve done a terrible job at being proactive about getting more eyeballs on the site. It does come back to the fact that I’m happy with the current growth rate though, so I’m focused on refining the platform, talking to the community, and strategising about where to take the platform next.

I place a large importance on staying in control of my time and remaining extremely focused on a small number of tasks. It’s far too easy to get pulled in lots of different directions, plus I’m extremely bad at multitasking and context-switching!

What was your lowest point in building Frontend Mentor so far, and how did you get out?

There hasn’t been one defining moment that I can think of. But building something can be a lonely journey where your motivation will ebb and flow. So you need to find ways to cope. For me, communities like Indie London have been a great help. 

On days where my motivation is lacking, I often just focus on other things and take my mind off Frontend Mentor. I’ve had a number of ideas for the platform and the community by simply doing other things. For example, I recently realised having objectives on the platform will be an amazing way to help the community explore new areas of the platform and drive engagement. Most just complete the challenges but there is so much to learn by giving feedback to others and analysing other people’s code. So having objectives like giving feedback to others which unlock rewards will be a great way to show people different actions they can take. We could also have time-sensitive objectives for specific tasks like giving answers to unanswered questions on solutions that are more than one-month old. This would give people an incentive to track down older solutions and could drive re-engagement if people didn’t come back to the platform after not receiving feedback initially. This idea came after a day of playing FIFA21!

I used to beat myself up if I took a day off or finished early for the day. But I’ve learned to embrace it and I feel much better for it.

How do you stay focused and avoid distractions?

I’m a very list-orientated person. So I have lists for everything. We’ve also got 3 stages of Trello boards that get more granular with each step. There’s an Ideas & Requests board which captures all new ideas. A Product Backlog board of accepted features/fixes/ideas ordered by Now, Next, Later columns. The Now column then feeds into the Sprint Backlog board which is the most granular and is set up in the traditional Kanban of Todo, Doing, Done, with a few levels in between. Nothing gets added to the Sprint Backlog without first going through the Product Backlog. Probably overkill for the size of the team (2 people part-time), but it works well!

At the end of each week I plan the next week based on what’s in the Sprint Backlog. I block out time each day for tasks so my calendar is full, even if I have no “scheduled” appointments/meetings. I then try and stick to the calendar as much as possible. But as I mentioned above, if I don’t feel motivated on any given day I’m not against diverting from the schedule.

The fact that I love working on Frontend Mentor and I love the community is by far and away the biggest motivator to stay focused and continue making progress though.

How would you have done things differently if you started again?

I would have launched premium challenges much much earlier. It was over a year before the first premium challenge was on the site! Once a valid business model that I was happy with did appear, I didn’t validate it anywhere near early enough. I could probably have gone full-time on it much earlier if I had!

What are the most common mistakes you see Indie Hackers make early on?

Not validating their business model early enough, like me!

Apart from that, I often see people giving up very quickly. Obviously, if there are no signs of life, then you might need to think of another idea. But I’ve seen people with some traction giving up because their project isn’t meeting some arbitrary goals they’ve set for it.

I think building a successful business is often a case of staying alive long enough to succeed. As long as you’re continuously reviewing progress and you feel things are moving in the right direction your main focus should be keeping your project alive however you can. 

Last year I went to New York to see a friend who was living out there. On the off-chance I emailed Ben Halpern, the founder of dev.to, to see if he’d be interested in meeting for a coffee. He wrote back and said yes! So we had a great chat and he essentially said the exact same thing. It was something like 5 years before dev.to started showing real signs of life and then they experienced unbelievable growth.

So don’t be too quick to let go of your ideas. Even if it’s making slow progress, as long as you’re happy working on it and it’s moving in the right direction try to keep it going.

What else have you built before Frontend Mentor, and what were the biggest lessons from those experiences?

The only thing I tried building before Frontend Mentor was that fitness app. I bit off way more than I could chew and hadn’t validated the idea at all. Yet I still spent nearly 6 months trying to build it!

I learned my lesson from that by launching the first version of Frontend Mentor in a day, which was just a resource list. Then when I had the idea for the design-led challenges I got a single challenge up on the site after another day. So I was sure to test things as quickly as possible. I definitely took too long to monetise, but I was also happy with the progress and in no rush to force anything. I’ve been sure to continuously test ideas and get feedback from the community along the way.

Quickfire round

Favourite indie products? 

ManyPixels has been a huge reason why we can offer such great designs for our challenges, so they have to get a big shoutout.

Also, Fathom Analytics. They’re a great privacy-first analytics tool!

Favourite apps on your homescreen? 

ProfitWell to keep track of growth, Apple News (underrated subscription!), and, dare I say it, Slack to stay in touch with the Frontend Mentor community.

Favourite podcasts? 

- Syntax.fm for web development

- Indie Hackers (obviously)

- Startups For The Rest Of Us by Rob Walling

- The Bootstrapped Founder by Arvid Kahl

- Above Board by Paul Jarvis and Jack Ellis (Fathom Analytics founders)

- Really enjoying Indie Bites by James McKinven

- Fantasy Football Scout to get my FPL fix!

Where can people stay updated on you and your projects?

Email: matt@frontendmentor.io

Twitter: https://twitter.com/_mattstuddert

LinkedIn: https://www.linkedin.com/in/matthewstuddert/