What does that have to do with oranges? They're just orange. I owe it to Habr. Two years ago I wrote an article "Web-technologies for designers - why and how", and did not publish the continuation of the article.
And finally, I can repay part of that debt. All November in the mornings and on weekends I recorded training videos about JS for designers. In the course of the project, I experimented with different formats, equipment and post-processing. In this post, I will sum up the results of the month of work on the course and tell you what I learned while writing it.
There were twotasks before the course:
Help designers see how technical knowledge can help them in their daily work;
For those designers who want to learn technology, give an easy start.
For the first task, I recorded a few short videos to help designers see new approaches to work:
Fighting routine in Sketch with Kraft and JSON
How to take data from the site, turn it into JSON and feed it to the sketch
An easy way to create a prototype of a new version of the product with Stylish
How to create a browser extension
These videos were watched and liked by people. Everything looked like you could start to look at the topic in more detail. That's why I created an example of data template cation and recorded an introductory video about it, "Lesson #1: Why don't dizaynerov manage to study web technologies". The video was watched 1296 times, 83 times liked and 7 times disclaimed.
I wanted the example to look like a real one. But most of the viewers thought it was too complicated. To explain how it works, I wrote down a simplified example: "A simplified example of data template cation.
The next plan was to analyze different topics about JS on the basis of this example so that the example becomes clearer and clearer with each lesson. And then, when people understand the basics - rewrite the example from pure JS to React and start the course about it.
And I started recording the first videos:
Syntax JS
Variables
Functions
Objects
Arrays
JSON
The videos were long, 15-20 minutes each, and few people could watch them to the end. So I started to split the topics into smaller ones. For example, the analysis of conditional operators looked like this:
Conditional operators: Fundamentals
Boolean values and comparison operators
Bringing types to logical
Logic operations
Ternary operator
Conditional assignment
Homework parsing
I also recorded the same set of videos about the basics of working with DOM:
DOM: Fundamentals
Searching for nodes on the page
Reading the properties of nodes and their contents
Editing nodes
True bypass
Homework parsing
Despite the fact that the video became shorter and easier, the number of views fell. The video is still too complicated to watch in between. And for those people who are ready to take the time to watch, it's easier to watch a whole video than a set of short videos. Besides, the videos have just become more boring.
What to do with the course is not quite clear yet. On the one hand, dozens of views show that the interest in the topic is to sit down. On the other hand, I am not satisfied with the quality of the materials, which are obtained and the amount of time it takes to create them.
In any case, creating a course was an interesting experience for me, which taught me a few things:
I found a great code sandbox: codesandbox.io. You can create not only separate pieces of it as in codepen.io but also whole projects with file structure.
I learned how to work with ScreenFlow program, which turned out to be very convenient for the installation of screenshots.
Writing sound in everyday conditions is better on a buttonhole than on a large microphone. It is much easier to achieve a bearable quality because you don't have to fight the echo from the walls.
You can write video to your phone, but you need some skill. For example, in recent videos, I have a very poor recording quality and the picture is constantly jumping. This seems to be a feature of Note 9's video stabilization.
You have to buy light right away. Two softboxes with AliExpress cost 3000₽ and the quality of the video became noticeably better.
I found out that all my life I called "ternanr" operator "trinar" wrong.
Before recording the video, it is better to check the pronunciation of all foreign words, or then it will be a shame. :)
Thank you for reading through. If you have any thoughts on how to make this course better - I will be glad to any comments. The course is designed to popularize technology with designers, not developers. That's why I omit performance issues and sometimes intentionally "teach the bad" because performance and purity are seldom important in prototypes.
