My online design course
During the covid lock down I decided I would create an online design school. I felt that this was the perfect time to brush up on my skills, learn some new ones and set up an online boot camp in the process.
It has over 20 hours of content broken down into 68 videos, loads of downloadable course materials and it’s all created from scratch by myself.
One really good thing about this project was the variety of tools I used. I used all the basic design tools to create the course projects. Sketch and Figma for designing, photoshop for imagery, abstract for versioning and principle for prototyping. I used After effects and Screenflow for video editing and effects.
WordPress to create the website. I used teachable for the course hosting, Hotjar for heat maps and user testing and Mailchimp for email marketing.
Landing page funnel
Course Website
I designed and built the landing page in WordPress. I then set up Mailchimp for email leads. This is something I have never done before so was really interesting to learn how to use this product.
Another thing I did was to add Hotjar for heat maps and watching users on the site. By using Hotjar I could see how users were navigating and using the pages.
The Syllabus
I worked out what I think are the most important subjects in design and came up with 8. I then set about creating original projects, videos, materials and works sheets for my course.
Week 1: How to learn and improve
Learn how to become a great designer
What is a design dissection and how it will help you (2:06)
Learn UI/UX 2. Finding the grid (5:30)
Learn UI/UX 3. Finding fonts (6:53)
Learn UI 4. Finding colours (1:32)
Learn UX 5. The main dissection (28:08)
UI/UX 6. Master studies (24:28)
Weel 2: The Fundamentals of design
Principles & Fundamentals introduction (14:06)
design course 2. Balance (10:05)
Learn UI/UX 3. Alignment (7:22)
Learn UI/UX design 4. Hierarchy (5:28)
UI bootcamp 5. Rhythm (5:21)
UX bootcamp 6. Contrast (4:49)
UI Design 7. Repetition (3:52)
Digital design 8. Harmony and unity (2:22)
Visual design 9. Fundamentals creation (47:32)
minimal ui 10. Fundamentals animation (27:10)
Week 3: Typography
Intro to typography (23:09)
Anatomy of type (13:33)
Type classifications (10:48)
Type scale and line-height (25:21)
Alignment, orphans and widows (14:52)
Kerning & letter spacing (15:32)
Letter spacing continued (9:58)
Measure (6:41)
Tips (27:25)
Week 4: The principles of layout
Learn design layout 1. Layout: this week (3:28)
how to do UI design grids 2. Anatomy of a grid (9:07)
design 3. The baseline grid (9:05)
UI design 4. The 12 column grid (10:10)
The 8pt grid (29:10)
The golden canon grid (21:04)
Project design and build pt 1 (44:51)
What to learn for UI design
Project design and build pt 2 (45:09)
Week 5: Using colour
Colour theory (10:35)
Colour theory 2. Colour basics (11:51)
How to add colour to a UI design
Colour harmonies (16:24)
Accessibility (7:33)
Implementing colour (17:18)
Colour palette generator (59:57)
Week 6: User Experience design
Homework for this week (4:20)
What is UX design (8:35)
Design thinking (13:34)
The UX process (37:51)
Business and product goals (20:36)
Goals and needs (13:41)
Personas (34:37)
MVP (11:10)
User journey (24:19)
Userflows (22:00)
Site maps (5:19)
Putting it all together (7:45)
Week 7: User interface design
Intro to UI (7:11)
What does a UI designer do (10:15)
The principles of UI (8:54)
UI process (8:13)
Low fidelity wireframes (26:59)
Medium fidelity wireframes (71:57)
Atomic design systems (24:10)
Creating our final design (15:59)
The UI stacks and states (10:18)
Week 8: The Final project
Final project intro (8:20)
Low fidelity wireframe (17:17)
Styles (26:40)
Mobile-first high fidelity (51:19)
High fidelity desktop (51:18)
Final touches (17:54)
Week 9: Wrapping it all up
What’s next? (2:52)
8 Beautiful Course Projects
Students love it
In total it took me about 7 months to complete. It has over 20 hours of content broken down into 68 videos, loads of downloadable course materials and it’s all created from scratch by myself.
- 21.5 hours of videos lessons
- 20 downloadable resources
- Running for 4 years and still going
- Over 100 reviews with an average rating of 5 stars
1,090
Students Enrolled
1,154
Minutes Taught
106
Students Countries
What Students have said
Key Takeaways
How do you eat an elephant? One bite at a time!
When I decided to do this project I quickly became aware how much I would have to do and how much I would need to learn. Also, the annoying imposter in my head started whispering in my ear that I couldn’t do it.
I learnt that by just being methodical and showing up consistently, tasks that feel massively impossible at the start can quickly became less overwhelming and more doable. By clever planing and time chunking I had more hours in the day than I realised! It was a perfect chance to learn more and practice on the way.
This project was a great way of cementing new knowledge, brushing up on old skills and earning a few extra pennies on the side!
