I Make $6K Creating Website Animation Tutorials [Side Project]
Hello! Who are you and what business did you start?
My name is Donovan Hutchinson and I’m a website developer. I’ve been building for the web since the late ’90s, and I enjoy building side projects. My most recent project is a website, book, and course that helps people learn how to create beautiful and engaging web animations.
The core of the business is the website, CSSAnimation.rocks, which features in-depth tutorials that show people how to make fun and engaging animation using HTML and CSS. It also includes a weekly newsletter, an introductory (free) ebook, and a 4-hour in-depth video course.
What's your backstory and how did you come up with the idea?
I’ve always loved creating something using computers. Early in my career I explored creating music and art and then when the web came along, using HTML and CSS to create websites.
Something I’ve found very helpful when learning new techniques and technologies is to write about them as I learn. I have found blogging to be a great way to explore new ideas while also sharing them and helping others discover new things too.
Over the 20 or so years I’ve been in the industry I’ve learned a lot about web design, web development, and writing, and these skills were all useful when creating my online projects.
So when I wanted to learn more about how to bring websites to life using web technology, I decided to start a project that demonstrated interesting and novel approaches, in the form of long-form tutorials. I set up the domain CSSAnimation.rocks and created my initial posts, and the reception was fantastic.
A big part of my work is driven by the love of learning and sharing that with others. Bringing a willingness to learn has been very helpful when approaching areas that I might not have considered beforehand.
I knew I was onto something when the posts were quickly shared on social media and started turning up in tech newsletters.
At the time, I had a full-time job and this was very much a spare-time side project. I found time to write posts while commuting to work on the bus or while sitting watching TV in the evenings.
Take us through the process of designing, prototyping, and manufacturing your first product.
The core of CSSAnimation.rocks is the website. This was built using Jekyll and published for free on Github Pages. The only initial outlay for registering a domain name, and then the time needed to set up the tutorial website locally.
Designing, developing, and launching the website took about a month, in my spare time outside of work. The main effort went into making sure the blog was tidy and easy to read, the home page contained links to each article, and every article had links to my Twitter account and newsletter signup form.
Once the website was in place, I could start creating tutorials. These were also written in my spare time, each taking around a week to research, develop an idea, and write it. Copy editing also took a few days as there always seems to be more typos to discover.
Writing articles is a great way to generate shareable content, but I decided to branch out into other ways of sharing the knowledge. One was to write an ebook. This was achieved using markdown and the book itself is generated using Pandoc, a tool that runs locally to convert HTML files into the epub format. In the spirit of sharing knowledge, I published the source code and content for the book on Github where people can download the book in multiple formats for free.
My ebook, CSS Animation 101, was written to help people get started with CSS animation. It was mostly adapted from an email-based course I wrote while commuting each day to work. The content took about a month to write, as a series of 20 short tutorials, each targeting a specific topic within CSS animation.
Reusing content is a great way to expand into other areas, as by creating my email-based tutorials, I could adapt the same content into a book with very little change.
Free books and blog tutorials are both useful for building an audience, but aside from perhaps on-page advertising, are not monetized. For this, I created a professional video-based tutorial course called Level Up Your CSS Animation Skills.
To create this course I started working part-time and dedicated a day or two each week for 6 months to writing, recording, and editing the content needed for the 4-hour course. This involved investing in a decent microphone and video editing software (Screenflow), but the biggest investment was time. I spent a lot of time thinking up fun, engaging examples and writing the scripts explaining how to build the example animations.
While creating this course I also put some effort into audience-building, by starting a weekly newsletter called CSS Animation Weekly. This features tutorials, news, and inspiring examples of web animation.
I created the newsletter using Revue. This is now a free tool and can be set up to use custom domains and branding. I created a custom logo for the newsletter and each week I collect links and share them.
Describe the process of launching the business.
By the time I had created my course, I had built up a small but enthusiastic audience through my newsletter and Twitter accounts, which were helpful platforms from which to announce the course.
I had already taken the time to build up some audience interest through the website, free ebook, and newsletter, so the initial launch was reasonably successful, with about $5,000 of sales in the first weekend.
As a result, other than newsletter hosting fees, I had very little ongoing cost to run the project so there was no financing needed. The biggest investment was my time as I had to reduce my paid working hours to part-time while creating the course.
Since launch, what has worked to attract and retain customers?
Since launch, I have continued to publish a weekly newsletter, and have been experimenting with giving talks in-person at meetups. Since Covid, these talks have stopped but the newsletter has continued to be my main focus. It is now up to almost 10,000 subscribers.
I’ve tried quite a few approaches to growing this list, but for me, the most effective way has been to create unique content and add a call-to-action to suggest people subscribe to my newsletter for more content.
This content takes the form of articles published either on my site, CSSAnimation.rocks or published on other industry websites. While promoting work on my own site is great for long-term growth, it is helpful to write on other platforms from time to time as they often have a wider audience.
I have not had as much success with online advertising, and haven’t spent a massive amount of time optimizing for Facebook or Instagram, but there are big markets there so it could be worth promoting unique content on those channels. I do promote articles on Twitter, which I find quite helpful for interacting with people interested in my topic.
I would recommend starting with something you know at least a little about and care about, and expand your ideas from there. Waiting till the perfect idea lands is a dangerous gamble, as you never know where an idea might lead.
Another angle I tried was self-publishing with Amazon. I self-published my CSS Animation 101 book through their platform and I found it very easy to set up and put my book in front of an international audience, and it was a good experience. I feel it would take more work to promote my book on the Amazon platform but getting up and running with it was easy.
How are you doing today and what does the future look like?
Currently, my course is selling approximately $500 worth of courses per month, and I don’t have any short-term plans to extend my marketing as my time is mostly taken up with raising a family and carrying out a full-time job.
However, I’d love to take some of the lessons I’ve learned in launching this very niche educational platform and extending it to wider topics. I enjoy learning about all aspects of web design and development and look forward to continuing to share what I learn and looking for opportunities to create new ways of learning for my customers.
Through starting the business, have you learned anything particularly helpful or advantageous?
A big part of my work is driven by the love of learning and sharing that with others. Bringing a willingness to learn has been very helpful when approaching areas that I might not have considered beforehand, such as the time needed to build an audience, or learning how to produce and edit video lessons.
Jumping into the creative process has been massively useful. In terms of marketing and promotion, I didn’t just take it on by myself but took my first steps into the video lesson world by working with some existing brands such as SitePoint. I made my first course as a contract and learned a lot by collaborating with experienced editors. On top of which, they had an established audience.
As far as habits go, I always like to think of ways I can make use of the way I learn to create marketable content. If I am learning a new skill, I do so by writing a blog post about it, which then becomes a tool to help build up an audience.
What platform/tools do you use for your business?
I use Udemy to host my course. It’s an easy option as I don’t want to manage the pricing and promotions too closely. I have tried Teachable, which is more powerful, and something I’d use if I wanted to manage the course marketing more carefully.
To create courses I use Screenflow, along with a laptop and a decent microphone (Blue Yeti).
For audience building, I run a weekly newsletter hosted on Revue, and my website is a static-generated website hosted for free on Github, with Cloudflare to ensure it’s fast through their worldwide CDNs and free HTTPS tool.
What have been the most influential books, podcasts, or other resources?
When I was getting started, I was massively influenced by Paul Boag’s writing and podcasting. I really enjoy his ideas and energy.
On the subject of CSS animation, Val Head would be my favorite author.
For inspiration, I recommend the Codrops website and CodePen.
Advice for other entrepreneurs who want to get started or are just starting out?
I would recommend starting with something you know at least a little about and care about, and expand your ideas from there. Waiting till the perfect idea lands is a dangerous gamble, as you never know where an idea might lead.
Where can we go to learn more?
- CSS Animation
- CSS Animation Weekly Newsletter
- (Course) Level Up Your CSS Animation Skills
- My email
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.
Download the report and join our email newsletter packed with business ideas and money-making opportunities, backed by real-life case studies.