1. Introduction

Autism is one of the neurodevelopmental disorders. Autism mainly leads to obstacles in communication, social interaction, and behavioral cognition, which are manifested as reluctance to communication, avoidance of eye and body contact, inability to correctly perceive emotions, stereotyped and repetitive actions, abnormal perception, etc [1]. According to the statistics, the prevalence of autism has increased from 1 in 10,000 in 1970 to 1 in 44 in 2018 [2]. The possibility of children suffering from autism is increasing year by year, and social attention is also increasing. At the same time, most parents of autistic children are diagnosed with poor psychological well-being, including the high levels of parenting stress and depressive symptoms, which greatly affect the emotional quality of relationship between parents and children [3]. Therefore, both autistic children and their parents need to be taken into consideration seriously.

Today, the typical approach is using the principles of Applied Behavior Analysis (ABA) to intervene with autistic children. However, with the difficulties in economic and geographical distance, many parents can’t offer autistic children this treatment. Children suffering from autism will bring a great deal of the cost on medical treatment and special education, which will add a significant burden to the family [4]. Besides, because of the geographical distance due to busy work, parents can’t always stay with their children. Nowadays, with the popularization of electronic devices, the age that children get in touch with electronic devices is gradually decreasing. One-third of the children are exposed to smartphones when they are 0-2 years old [5], playing games and watching videos on various applications. Autistic children have great interest in electronic devices. They can operate the tablets without guidance and be immersed in the content with enthusiasm [6]. Autism can be diagnosed when children are 18 months old [1]. It’s prospective to intervene in autistic children with applications on electronic devices. By adopting the application on electronic devices, which doesn’t limit the time and places of use, and saving money, it’s convenient for autistic children to treat autism in childhood.

The design of an application requires not only good functions, but also proper interface design. The interface is the user’s immediate impression of an application. Only when the design of the interface meets the user’s needs and habits of interaction, can the user’s experience be improved, which raises their interest to continue to get in touch with the application. For some special needs of autistic children, we need to analyze their characteristics of using deeply and summarize the design methods that suit their preferences, which will eliminate the obstacles they may encounter when using the application. This article analyzes the preferences and perception habits of autistic children in the aspects of vision and interaction, aiming to design an application that helps autistic children solve problems in stereotyped repetitive behaviors and communication difficulties. At the same time, with the participation of their parents, autistic children can interact with their parents in different ways. The parents can also grasp the learning progress of their children, which will reduce anxiety and improve the relationship between parents and children.

2. Characteristics of Autistic Children

The application’s design needs to meet the requirements and habits of the users. Through a comprehensive analysis of the user’s characteristics, this study will summarize the design method that meets the user’s habits and preferences. Autistic children have different thought patterns and cognitive habits compared with other children. To offer a better experience to autistic children, it’s essential to analyze their habits and preferences in visual perception and interactive methods from psychological and physical aspects.

2.1. Visual Habits of Autistic Children

2.1.1. Color

Autistic children are sensitive to color [7], but their perception of color isn’t accurate [8]. The hue, saturation, lightness, and contrast of the colors in the interface will affect their perception and comfort of the interface.

The first step is to analyze the preference of autistic children for a single color. When autistic children recognize things in pictures, the reading speed increases a lot by using color overlays. Among these colors, green (yellow and blue overlay) was chosen as the best color to improve the text clarity by autistic children [9]. In addition, compared with usual children, autistic children tend to like brown and dislike yellow. And there is no significant difference in preferences for red, blue, and pink. The reason why they don’t like yellow probably is the high brightness of yellow, which is too irritating and not mild enough for their eyes [10]. In general, the order of autistic children’s preferred colors is: green, brown, blue, red, purple, orange, and yellow. They preferred cool tone because it doesn’t lead to much aversion and discomfort [11].

The second step is to analyze the preference of autistic children for color matching. Most autistic children respond negatively to treatment, and monotonous colors will make them feel uneasy. Therefore, neutral colors should be used, and the saturation, lightness and contrast shouldn’t be too high, which will prevent autistic children from severe stimulation. It can also relieve their tension and tiredness, as well as attract them to participate [12].

All in all, the color of the user interface should be dominated by cool colors, mainly using green, brown, blue, red, purple, orange, and colors that are similar to them, reducing the use of light yellow. And the saturation, lightness, and contrast of the colors shouldn’t be too high. Also, the differences between colors shouldn’t be too little, and too many kinds of colors shouldn’t be used, decreasing the possibility of being difficult to identify and distinguish.

2.1.2. Pattern

The patterns in the children’s applications are usually presented in the form of cartoons and animations, and most of them use cartoon images of animals as the protagonists. Like other children, autistic children are less interested in images of people and objects and more interested in pictures of animals [13]. Nowadays, people will use Animal-Assisted Intervention (AAI) to assist autistic children with treatment. Compared with humans, the behaviors of animals aren’t complicated, and they can express specific behavioral intentions through a few basic actions. It will provide a feeling of safe and comfortable, which attracts autistic children to approach and communicate with the animals. After getting in touch with animals, the emotions of autistic children will become more stable, and they will be more willing to communicate with parents and therapists [14]. Among these animals, dogs are one of the animals that are more likely to be in contact with autistic children. Dog’s ways of expression can make it easy for autistic children to understand their intentions and attract autistic children to communicate and play with dogs [13].

In short, it’s helpful to use cartoon images of animals, mainly dogs, to communicate with autistic children. It may also be possible to anthropomorphize animals, and the actions of animals in reality can be designed as animations. In this way, the design of the images may provide the same feeling of safety and comfort when autistic children get in touch with real animals.

2.1.3. Layout

The collocation and position of elements in the interface will affect the recognition of the content by autistic children. The layout of each part needs to conform to the recognition habits of autistic children, so that they can understand the meaning of each part based on being able to recognize the meaning of each element. And then, they can carry out the operation of each step under the guidance and continue to play the game.

If there are too many elements, complex background images, and low transparent images in the interface, the readability of the interface will reduce a lot. It’s difficult for autistic children to recognize and understand the meaning of the content when the design of the interface is too complex. Large and easy-to-understand pictures and texts should be used, and the pictures and texts should be put together to explain the meaning of each other. Sometimes, using wireframes to separate each part will make the interface more clear and concise, which will be easier for autistic children to understand the function of each component, enhancing good feelings while using [15].

2.2. Cognitive and Interaction Habits of Autistic Children

This application is designed to assist in the intervention of autistic children who have stereotypical behaviors and social reluctance in daily life. Therefore, it is necessary to analyze the characteristics and intervention methods of autistic children in terms of behavioral habits and communication habits and design an application that can encourage autistic children to participate in it and improve the defects in these two aspects.

2.2.1. Behavior Guidance

Autistic children can’t tolerate changes in daily life and will persist in stereotyped behaviors and fixed interests (RRBIs). For example, they will only play with certain toys and cover the blanket in a fixed way. This stereotyped and repetitive behavior can affect the self-care and social skills of autistic children in their daily lives [16].

When completing tasks in daily life, giving voice prompts before each step can effectively guide autistic children to complete this step. Offering autistic children with auditory prompts can enhance their abilities to complete tasks independently. For example, when brushing teeth, prompting steps such as “take out the toothbrush”, “squeeze toothpaste”, and “brush your teeth” can help autistic children complete the entire process step by step rather than ignoring some steps in the procedure and getting in a mess. Therefore, it’s effective to use voice prompts to induce the behavior of autistic children and cultivate their self-care abilities [17].

In addition, tasks and social stories can be combined to help autistic children complete tasks. First of all, social stories allow autistic children to immerse themselves in the story and arise interest in what might happen next. In this case, they can complete the tasks while following story’s plot happily. Guided by pictures and sounds, autistic children will be attracted by stories visually and audibly, which not only helps them memorize what they have learned, but also increases their interests and initiative. Besides, stories can calm autistic children down and divert their attention to participating in the story rather than having to complete specific tasks. It can reduce the anxiety of learning new things and completing tasks. Lastly, social stories can also enhance creativity and motor coordination. It can help autistic children develop good living habits, as well as increase their understanding of the world outside, improve their social skills and social adaptability [18].

All in all, the interaction mode of the application needs to be designed to guide autistic children to complete the tasks step by step with social stories as the background and voice prompt as encouragement. It will benefit a lot for the cultivation of their daily life habits.

2.2.2. Communication Guidance

The communication difficulties of autistic children are mainly manifested as limited attention to speaking, unwillingness to actively express and share, lack of eye contact, facial expressions, and voices. It not only hinders them from expressing their thoughts and emotions, but also makes it difficult for others to understand them, which is not conducive to further intervention and treatment.

Because of their poor understanding ability, autistic children need sufficient reaction time after being given language prompts. It can reduce the pressure on vocalization and encourage them to express their ideas. Moreover, autistic children are weak in imitation and will not imitate others actively. But autistic children will participate in communication and explore ways to finish the tasks if they are appropriately guided to imitate others gradually. It will help autistic children raise more confidence in their behaviors, as well as facilitate their communication skills [19]. In addition, as things mentioned above, the interest and sense of the interaction of autistic children can also be enhanced through social stories, gestures, and action guidance. It is also necessary to motivate and praise them properly, giving them a sense of accomplishment and self-recognition after completing tasks [20].

However, the guidance of autistic children needs special skills. Since the application is designed to let autistic children interact with their parents, training for parents is required. Behavioral Skills Training (BST) is a proven method of teaching new skills to parents. Oral guidance, role-playing exercises, and other training for parents in the early stage ensure that parents can guide and interact with autistic children properly. Besides, parents will reduce their stress and increase their optimism in caring for their children during the training process and the interaction with children [21].

In short, when guiding autistic children to participate in activities, parents need to give autistic children enough time for thinking and trying. And parents should use proper words and pictures to encourage their children to participate in the activities after professional training.

3. Design in the APP Structure

3.1. Sitemap

This application connects autistic children with their parents remotely through the internet. In this way, autistic children and their parents can complete the tasks together. During this process, the works of storytelling and guidance are completed by the voice prompts of parents, and the autistic children will complete the tasks under the guidance of parents. Besides, autistic children can also save the screenshots in the collection after completing the tasks.

Figure 1 shows the sitemap and structure of the APP.

On the homepage, there are two options: “PLAY” and “PARENTS”. Autistic children and parents need to click on the corresponding options to enter.

On the children’s page, there are two options: “CONNECT” and “COLLECTION”. Autistic children can click on “CONNECT” to connect with parents through the internet and click on “COLLECTION” to view the screenshots of the games before.

On the parents’ page, there are two options: “CONNECT” and “TUTORIAL”. Parents can click on “CONNECT” to connect with autistic children through the internet and click on “TUTORIAL” to get relevant training with professional instructors. And if necessary, parents can get synchronous guidance during the process.

On the selection page, there are options for various games about daily habits. After clicking on them, autistic children can enter the corresponding games.

In each game, autistic children and their parents will each randomly act as an animal. With the development of the storyline and the voice prompts, the autistic children will complete each step of the game.

3.2. Color Palette

Figure 2 and Figure 3 show the color selection of the APP. The UI adopts colors that are not too light and not in high saturation, which makes the interface look soft.

Figure 2: The color palette of main pages.

Figure 3: The color palette of the example of game pages.

3.3. User Interface Design

3.3.1. Homepage

Figure 4 shows the homepage of the APP. Because the application is designed to let autistic children and their parents play games together, two puppies are designed on the page to welcome them.

The “PLAY” button adopts yellow which has a low brightness and saturability, which can reduce visual stimulation to autistic children. Besides, green, blue, and red is also adopted to accord with the preference of autistic children.

The button is designed to be large, with two puppies pointing to the button, which plays a guiding role in autistic children’s recognition. The “PARENTS” cloud in the upper right corner is the button to enter the parents’ page. The background is designed to be simple, which will not interrupt the recognition of other symbols.

Figure 4: Homepage.

3.3.2. Children&Parents-Selection Page

Figure 5 shows the children’s selection page of the APP. This is the children's selection page after clicking on “PLAY”. Autistic children can click on “CONNECT” to connect with parents and enter the game. They can also click on “COLLECTION” to view previous screenshots of the games.

Figure 5: Children’s selection page.

Figure 6: Collection page.

Figure 6 shows the collection page of the APP. This is the collection page after clicking on “COLLECTION”. Autistic children can view screenshots of previous games. The title at the top of the page can indicate the name of the page. The color of the words is dark, so the distraction on recognition will be reduced.

Figure 7: Parents’ selection page.

Figure 7 shows the parents’ selection page of the APP. This is the parents’ selection page after clicking on “PARENTS”. Parents can click on “CONNECT” to connect with their children. They can also click on “TUTORIAL” to enter the tutorial page.

3.3.3. Connection Page

Figure 8 and Figure 9 show the connection page of the APP. After clicking on “CONNECT”, it will display “LOADING” when connecting. After connecting successfully, it will display “SUCCESS”.

Figure 8. Connection page-Loading

Figure 9: Connection page-Connect successfully.

3.3.4. Game Selection Page

Figure 10: Game selection page.

Figure 10 shows the games’ selection page of the APP. Autistic children can enter the game they want to play. They can swipe left and right to view more options on the page.

3.3.5. Game Page

Here is a detailed description of one example to solve the problem of insisting on covering the same blanket in the same way as the example.

Figure 11: Game pages.

Figure 11 shows an example of the game pages of the APP. This game tells a story that a cold wind chills two owls at night, and they need blankets to keep warm. Parents encourage their children to paint a blanket, cover the owls with blankets and then turn off the lights. In this way, autistic children will be taught to cover their blankets in different ways.

Children act as the red owl on the left, and parents act as the purple owl on the right. While parents and children speak, the corresponding owl’s beak or entire body changes shape or size to remind which owl they are acting as. The emoji of the crying faces and smiling faces in the picture can remind autistic children of the owls’ emotions and help them understand different emotions and feelings. The APP can also add corresponding laughter and crying sound to help them understand. A small number of animations can be added to the page, which should be at a low speed to prevent recognition troubles. When the button is clicked, the button will become larger, indicating that the click is effective. The colors of the whole page are relatively mild. It doesn’t use bright colors, and there is a degree of distinction between colors. The background is moderately blurred to highlight the main part and reduce the interference on visual recognition.

4. Conclusion

The application designed in this article aims to assist in the treatment of autistic children’s problems with stereotypical repetitive behaviors and poor communication. Although the UI design is more inclined to cartoon animation in order to meet children’s preferences, the color selection and layout still need to be analyzed and summarized carefully according to the characteristics of autistic children. Through the analysis and design above, the author has a more comprehensive and in-depth understanding of the cognitive characteristics and habits of autistic children, which lays a solid foundation to the following design.

At the same time, the emergence of applications designed for autistic children can also raise society’s concern for autistic children and assist in the rehabilitation of autistic children. It can remind the majority of designers that when designing the UI of the application, they should consider the unique needs of these minority groups, which can reduce the obstacles and inconvenience of using. In this way, the application can not only be used by ordinary people, but also by special people. It will make the application more accessible and inclusive.