Need advice/assessment on the creation of training videos

Good morning.

Not long ago I recorded a test video:

In the video there is no voice, only have a kind of subtitles.
I would like to know whether to continue, overall assessment, and of course, tips on how to do better.

Going to rewrite video with voice, paying more attention to proper implementation, and to the reasons why the implementation is made so and not otherwise.
Test recording with voice
Full version coloring games
Development version toys for training videos
October 3rd 19 at 03:56
2 answers
October 3rd 19 at 03:58
A set of code quite difficult to read in a long video, but it's a long video. View the angular way, it makes no sense to print from scratch, you can type a minimum and show how it works and go on to show what will happen if things change, but here's something to add.
You have the right lost a bunch of places, it was possible to open the browser and build the video so that it was clear there what's going on.
The pause should be cut, in my experience video is shortened by 30%.
The sound is normal, just either get a pop filter, or make it themselves.
And so the ideal for me has always been railscasts.comgreat flow, good sound, and length ~10 minutes.
October 3rd 19 at 04:00
Drawing tool is very simple, although training possible and plus, but on habré have been somewhere about painter on Canvas in a more advanced variant.
The game loads my weak computer a little less than 100%, apparently rendering issues. Generally vskidku can assume and understand from one RAID because of time constraints, did not work, what do you have each frame on the screen is redrawn, and it is known a deadly sin in the world of JS/canvas and I advise you to run with it in the first place.
And in a strange way to look at the page text without html tags/body/head etc. I certainly understand that not all of them work, but you position the code for people who want to learn something, and it's a little requires )
I understand, according to this you even all hex's every time redrawn according to this:
 this.draw = function() {
 if (!list) {
 list = [];
 ctx.clearRect(-this.offset.x, -this.offset.y, canvas.the width of the canvas.height);
 for(var x in data) {
 for(var y in data[x]) {
 var hex = data[x][y];
 list.sort(function(a, b) {
 return b.q - a.q;
} {
 var fill = null;
 if (game.selected.unit && game.selected.unit == hex.unit) {
 fill = "rgba(200, 255, 255, 0.5)";
 } else if (hex == game.hovered) {
 fill = "rgba(255, 255, 200, 0.5)";
 var options = {};
 options.texture = true;
 hex.draw(fill, options);
 // alert("P");

In this case, it is probably easier to have each object-hex to have any field (e.g. redraw) which will make the true value depending on whether the shifted screen appeared over it someone. Ie to redraw on the canvas a picture only if it is really needed (redraw === true). And debugging probably still be the console.log to do, and not alerts but this is about something else entirely) - carolanne.Weissn commented on October 3rd 19 at 04:03
html/body lowered because, as you rightly pointed out, without them everything works. Less code to read/write easier, and you can add more later.
The code is still very raw. Caching the whole map and other things will do later.
Now everything is on the stage of "it works" in order to demonstrate how the game will look in General.
Alert is needed in order to block the main loop. console.log in this case. - clemens commented on October 3rd 19 at 04:06
Good that everything will still be completed and rewritten, I will wait for the tutorial) And on my desktop single core is not playable) - carolanne.Weissn commented on October 3rd 19 at 04:09
The game was originally conceived as an illustration for the video. But at the moment I think it came out too complicated.
Still hexagonal mesh and a-star is not the most trivial things. - clemens commented on October 3rd 19 at 04:12

Find more questions by tags CanvasJavaScript