
Sites for children - is it easy to make a serious product “toy”
In a post I want to share the "best practices" of creating educational sites for children. I’ll make a reservation right away: by the term “children” I will not mean geeks who beat dads in chess and read all twelve volumes of the Children's Encyclopedia, but ordinary children who learn to read, count and comprehend elementary logic.
When creating a web site, it is tempting to create a standard set of pages: Contents, Help, Site Map - all this is necessary, but not for children, but for parents and a search server, therefore, links to them are better to set on the start page, where parents help children enter system, register. Maybe their parents will want to call support or send a resume. As soon as the system is logged in - everything, the children's part of the site begins.
Example
If you show your child a form with input fields and text prompts, he will think "why the game did not start, I'll go and call dad." There are two errors in this example:
Let's analyze in order:
if our little user does not notice the message - there is a way out, you need to pronounce this message. For the best effect, it is better to find a person with a pleasant voice and ask them to record several wav files. After - use the sound on the page.
or
So, like a path trodden - we can transmit information visually and through sound. Is the margin form still here? It would be necessary to transfer it to a part of the site for parents.
another example
Branching a site sometimes reaches incredible sizes. The site is aimed at children’s consumers, and children
Solution: we throw out the menu and other controls - and how to switch from one page to another? the program / site needs to be converted into a linear structure.
The conversion example
page contains a menu:
many branches, each has its own scenario.
transform into a linear structure:
sound message: Hello, let's start the lesson, press the button if you are ready to
continue the training session
sound message: Well done, now it's time to play, press the button if the
game is ready there is a
sound message: Well done, you broke your record and get trophies
sound message: click on the button to start a new task, or press “Exit” The
menu has been transformed into a sequence of actions, and most importantly, the games go not first, but for dessert. The program manages the educational process, it does not ask a lot of questions, does not ask to fill out forms, just sit and study.
It should be tangible, if for someone it’s not so important whether the button was highlighted when you hover over the misha, and if it’s important whether the amount was transferred from account to account after clicking, then for children it is important that this button not only lights up when you hover, but also makes a sound when pressed - this makes the baby understand that he hit the button.
When a game starts, you cannot start it this second, in the real world, little happens instantly. Therefore, it is necessary to warn: “start, attention, march” or “3 2 1” or at least a little longer to show the download progress (preloader)
For the work done you need to give a reward. Otherwise, positive motivation disappears, only negative remains “if you don’t do the task, you won’t get candy”
The prizes can be virtual “trophies” or pseudo-money, which you can then buy, for example, new antennas for a virtual robot.
Characters play an important role in perception. Beasts are a win-win option for both boys and girls. However, dividing users into boys and girls is not worth it; there are girls who are interested in robotics.
Of course, an artist is needed for a children's site.
Buttons, input fields - large, with highlighted focus. Driven letters and numbers are also large so that the user can easily get the mouse.
It’s not such a simple matter to make a simple children's site. Homework - think about what a children's social network would look like.
Giving up adult dogma
When creating a web site, it is tempting to create a standard set of pages: Contents, Help, Site Map - all this is necessary, but not for children, but for parents and a search server, therefore, links to them are better to set on the start page, where parents help children enter system, register. Maybe their parents will want to call support or send a resume. As soon as the system is logged in - everything, the children's part of the site begins.
Example
If you show your child a form with input fields and text prompts, he will think "why the game did not start, I'll go and call dad." There are two errors in this example:
- the child will not read messages, will not notice or will not want
- the child will not enter much data, even if he knows what to enter
Let's analyze in order:
if our little user does not notice the message - there is a way out, you need to pronounce this message. For the best effect, it is better to find a person with a pleasant voice and ask them to record several wav files. After - use the sound on the page.
or
var privetWav = new Audio('privet.wav');
privetWav.play();
So, like a path trodden - we can transmit information visually and through sound. Is the margin form still here? It would be necessary to transfer it to a part of the site for parents.
another example
Branching a site sometimes reaches incredible sizes. The site is aimed at children’s consumers, and children
- not used to using submenus, breadcrumbsm, sitemap
- often do not realize at what stage of the site they are
- children are not so fanatical about time as adults, accelerated access, hot keys do not need them
- children are not independent in the educational / developmental process, if you can play or study, they will prefer to play
Solution: we throw out the menu and other controls - and how to switch from one page to another? the program / site needs to be converted into a linear structure.
The conversion example
page contains a menu:
- take a lesson
- see your grades
- play a game
- complete classes
many branches, each has its own scenario.
transform into a linear structure:
sound message: Hello, let's start the lesson, press the button if you are ready to
continue the training session
sound message: Well done, now it's time to play, press the button if the
game is ready there is a
sound message: Well done, you broke your record and get trophies
sound message: click on the button to start a new task, or press “Exit” The
menu has been transformed into a sequence of actions, and most importantly, the games go not first, but for dessert. The program manages the educational process, it does not ask a lot of questions, does not ask to fill out forms, just sit and study.
We make the user interface "toy".
Button press.
It should be tangible, if for someone it’s not so important whether the button was highlighted when you hover over the misha, and if it’s important whether the amount was transferred from account to account after clicking, then for children it is important that this button not only lights up when you hover, but also makes a sound when pressed - this makes the baby understand that he hit the button.
effect “now something will be”.
When a game starts, you cannot start it this second, in the real world, little happens instantly. Therefore, it is necessary to warn: “start, attention, march” or “3 2 1” or at least a little longer to show the download progress (preloader)
reward.
For the work done you need to give a reward. Otherwise, positive motivation disappears, only negative remains “if you don’t do the task, you won’t get candy”
The prizes can be virtual “trophies” or pseudo-money, which you can then buy, for example, new antennas for a virtual robot.
Characters
Characters play an important role in perception. Beasts are a win-win option for both boys and girls. However, dividing users into boys and girls is not worth it; there are girls who are interested in robotics.
Of course, an artist is needed for a children's site.
Buttons, input fields - large, with highlighted focus. Driven letters and numbers are also large so that the user can easily get the mouse.
Instead of completing
It’s not such a simple matter to make a simple children's site. Homework - think about what a children's social network would look like.