Key Takeaway

This week our lecture was cancelled so we had a week to work on our projects. As it had came up during the design critique for the autonomous vehicle UI, I decided to take an in-depth look at designing for children. As well as what techniques I could use to make my design more appealing to children.

Design for Children

I started my look at designing for children with a look at this web page (https://developers.google.com/building-for-kids/designing-engaging-apps) which was created by Google as part of their resources for developers. This page specifically looks at how to make apps engaging for children.

One point I noticed come up more than once as part of the advice was remembering that children under 5 cannot read and therefore you need to include audio and other visual cues for interactions as well as text. Text only buttons are not a good choice, and many children are familiar with common icons such as home and back arrows, therefore it is good to include these to aid navigation. Children will also appreciate feedback to let them know the result of the interaction and if they have made a mistake using visual cues to direct them to the correct action to take will improve their experience.

A lot of the advice on this page emphasised the importance of making the experience clear and simple, and this covered lot of different elements from navigation, gesture controls and instructions. By keeping things simple and easy to understand it is less likely that children will encounter roadblocks in their experience and therefore will enjoy it more. Another key point is to remember that children’s motor skills are not a developed as adults, therefore as well as avoiding the requirement for complex gesture controls making touch target that little bit bigger can help children who are still developing those skills. As in any design accessibility is key, with 11% of children in the UK having some form of disability designing for accessibility is just as important when designing for children as any other age group.

Another thing to consider is making the design enjoyable for parents as well, this is to make it more likely that children and parents will use the design together. This will make them more likely to enjoy using it and as such use it more often. Considering parents as users as well during the design will ensure that elements that will appeal to both can be embedded within the design. This is particularly important in my product where the whole idea is for parents and children to spend quality time together.

I feel this advice has given me some great tips on how to design my user interface, but I also want to look at what visual style appeals to children and makes a design more appealing to them. I feel form the previous advice I will want to stick to good accessible fonts and icons, so I am mainly looking for ideas for a child-friendly colour palette.

I found this short piece (https://blog.prototypr.io/week-8-using-colour-to-design-for-children-da5b98594a2a)  about using colour in apps for children. It made the interesting point that while children love bright and vibrant colours, if you use these everywhere in a UI the user experience will suffer as children will not be able to tell interactive components from non-interactive ones. This could cause frustration as users do not get the action, they expect from tapping on a component they expect to be interactive that isn’t. From this I think it will be a good idea for me to keep the bright colours for interactive elements and use more muted colours for the non-interactive elements.

The next article I found was a much more in-depth piece around the differences in designing for children versus adults and it covered a huge range of topics. (https://medium.com/fruto/digital-design-considerations-for-child-vs-adult-user-groups-8ea55389ffa0)

This article was based on the author’s experience conducting user research as well as designing for children. As I was concentrating on learning more about visual design for children at this point, I will concentrate on those points here.

When discussing using colour in design for children the main point was that it is not about just simply throwing every colour in the rainbow at the interface, this is much more likely to cause confusion around interactive and non-interactive elements as mentioned previously. A lot of preconceptions about designing for children is to use bright, vibrant colours but this mainly concerns very young children as children get older, they appreciate different colours and more subtlety. Bright colours can still work well they just need to be used appropriately and with care. Again, accessibility with colour is very important and all colours used need to be checked with a colour contrast checker for proper contrast.

Typography for children is another area where the preconception that fun and wacky fonts will be best, and this is something I have fell foul of as well. In this article the point is made that as children’s reading is only developing the most suitable fonts are those that match the fonts used in education that children learn to read using. Children rely on the shape of individual letters in their reading more than adults so having letters that are the shape children expect is a key thing to look for when choosing a font. It is also important to select a font where similar letter shapes have features which can be used to differentiate between them. For example, the p and q in this image:

Untitled

Source: https://medium.com/fruto/digital-design-considerations-for-child-vs-adult-user-groups-8ea55389ffa0 (Last Accessed 30/12/23)

The fact that the “q” has that extra flick on the descender prevents the two letters being confused as otherwise they are simply mirror images of each other.

Another very useful piece of information I found in this article was the advice for how to size buttons for children. Apple’s Human Interface Guidelines advise 44x44 pixels as the minimum size for a button, but this is for adults and this article suggests a size of at least 75x75 pixels for children. This is a decent increase, but it falls short of simply making all buttons massive, a useful increase in size and accompanying safe space between buttons and any other interactive elements will provide the best opportunity for successful results.

It is also important to ensure that buttons look like they are there to be pressed, use of subtle cues such as a gradient, drop shadow or simple animation can make that much clearer to a user.

I also found this very useful table which compares some of the differences of adult users compared to child users:

Untitled