14
The Design of Web Games for Helping Young High-Functioning Autistics in Learning How to Manage Money Serena Caria 1 & Fabio Paternò 1 & Carmen Santoro 1 & Valentina Semucci 2 # Springer Science+Business Media, LLC, part of Springer Nature 2018 Abstract We describe the design of a Web-based game application aimed to support high-functioning individuals affected by Autism Spectrum Disorder in gaining skills that can help them understand the concept of money and apply it in practical life situations. In order to evaluate the effectiveness and usability of the games, a user study involving six high-functioning ASD individuals in their teens and above was carried out. Preliminary results were encouraging and showed the potential advantages of such a system for training end users on practical life skills. We report on the redesign of the application that has been performed taking into account also the feedback gathered in the empirical validation. During the redesign we also added a more realistic game involving interaction with a vending machine, a tool that is commonly used by teenagers to buy snacks or drinks. Keywords Accessibility . Autism Spectrum Disorder . Serious games . Web 1 Introduction Autism Spectrum Disorder (ASD) refers to a broad range of neurodevelopmental disorders characterized by difficulties with social communication and interaction as well as restrict- ed, repetitive and stereotyped patterns of behaviour [1]. While the exact causes of ASD are unknown, it is believed that both genetic and environmental factors play a role in its develop- ment [2]. The term Bspectrum^ refers to the wide range of symptoms and levels of functional disability displayed by peo- ple affected by it. Three levels of functioning (low, medium, and high) are identified according to the severity of the disor- der and thus the extent to which quality of life is negatively impacted. People who are affected most are called Blow functioning^, and they have quite severe impairments in all the three areas of reciprocal social interaction, communica- tion, and repetitive behaviour. On the other extreme there are those whose quality of life is impacted less (BHigh Functioning^ or HF): although they have a close to normal IQ (some even exhibit exceptional skills in specific areas), and language development can be normal, they have reduced social relationships connected with difficulties in starting or maintaining conversations, lack of emotional expression and recognition, limited range of in- terests, as well as troubles with organizational skills and ab- stract thinking. There is significant evidence [3, 4] that interactive technol- ogies can be valuable tools in supporting computer-based learning of the core problematic areas of ASD (e.g. commu- nication, affective and interactional skills). Indeed, there are currently several technological solutions for supporting autis- tic people [3]: it has been noted that many individuals on the spectrum have a natural affinity with computers [5] due to the predictable and repeatable nature of technology that can create controlled environments, and which thus appeals to those who feel relieved by stability and routine. In addition, people with autism have strong visual processing skills, making them good candidates for approaches such as Augmentative and Alternative Communication (AAC) [6] and video modelling [7]. However, in spite of the growing attention paid to devel- oping assistive applications for autistic people, we noted that so far most tools mainly address children developmental * Carmen Santoro [email protected] Serena Caria [email protected] Fabio Paternò [email protected] Valentina Semucci [email protected] 1 HIIS Lab, CNR-ISTI, Via G. Moruzzi, 1, 56124 Pisa, Italy 2 Azienda USL Toscana Nord Ovest, Via G. Garibaldi, 198, 56124 Pisa, Italy Mobile Networks and Applications https://doi.org/10.1007/s11036-018-1069-0

TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

  • Upload
    others

  • View
    0

  • Download
    0

Embed Size (px)

Citation preview

Page 1: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

The Design of Web Games for Helping Young High-Functioning Autisticsin Learning How to Manage Money

Serena Caria1 & Fabio Paternò1& Carmen Santoro1

& Valentina Semucci2

# Springer Science+Business Media, LLC, part of Springer Nature 2018

AbstractWe describe the design of a Web-based game application aimed to support high-functioning individuals affected by AutismSpectrumDisorder in gaining skills that can help them understand the concept of money and apply it in practical life situations. Inorder to evaluate the effectiveness and usability of the games, a user study involving six high-functioning ASD individuals intheir teens and above was carried out. Preliminary results were encouraging and showed the potential advantages of such a systemfor training end users on practical life skills. We report on the redesign of the application that has been performed taking intoaccount also the feedback gathered in the empirical validation. During the redesign we also added a more realistic game involvinginteraction with a vending machine, a tool that is commonly used by teenagers to buy snacks or drinks.

Keywords Accessibility . Autism SpectrumDisorder . Serious games .Web

1 Introduction

Autism Spectrum Disorder (ASD) refers to a broad range ofneurodevelopmental disorders characterized by difficultieswith social communication and interaction as well as restrict-ed, repetitive and stereotyped patterns of behaviour [1]. Whilethe exact causes of ASD are unknown, it is believed that bothgenetic and environmental factors play a role in its develop-ment [2]. The term Bspectrum^ refers to the wide range ofsymptoms and levels of functional disability displayed by peo-ple affected by it. Three levels of functioning (low, medium,and high) are identified according to the severity of the disor-der and thus the extent to which quality of life is negativelyimpacted. People who are affected most are called Blow

functioning^, and they have quite severe impairments in allthe three areas of reciprocal social interaction, communica-tion, and repetitive behaviour.

On the other extreme there are those whose quality of life isimpacted less (BHigh Functioning^ or HF): although theyhave a close to normal IQ (some even exhibit exceptionalskills in specific areas), and language development can benormal, they have reduced social relationships connected withdifficulties in starting or maintaining conversations, lackof emotional expression and recognition, limited range of in-terests, as well as troubles with organizational skills and ab-stract thinking.

There is significant evidence [3, 4] that interactive technol-ogies can be valuable tools in supporting computer-basedlearning of the core problematic areas of ASD (e.g. commu-nication, affective and interactional skills). Indeed, there arecurrently several technological solutions for supporting autis-tic people [3]: it has been noted that many individuals on thespectrum have a natural affinity with computers [5] due to thepredictable and repeatable nature of technology that can createcontrolled environments, and which thus appeals to those whofeel relieved by stability and routine. In addition, people withautism have strong visual processing skills, making themgood candidates for approaches such as Augmentative andAlternative Communication (AAC) [6] and video modelling[7]. However, in spite of the growing attention paid to devel-oping assistive applications for autistic people, we noted thatso far most tools mainly address children developmental

* Carmen [email protected]

Serena [email protected]

Fabio Paternò[email protected]

Valentina [email protected]

1 HIIS Lab, CNR-ISTI, Via G. Moruzzi, 1, 56124 Pisa, Italy2 Azienda USL Toscana Nord Ovest, Via G. Garibaldi, 198,

56124 Pisa, Italy

Mobile Networks and Applicationshttps://doi.org/10.1007/s11036-018-1069-0

Page 2: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

disabilities (social, cognitive, emotional, motor) within theASD spectrum (see e.g. [8]). This may be due to the fact thatearliest interventions (even starting from childhood: a first di-agnosis can usually be made by the age of two) can give thehighest chances to improve the core behavioural symptoms ofautism. Thus, most work has concentrated to this age range.Less attention has been dedicated so far to other groups ofautistic individuals [9] which might need to gain different typesof skills. This is the case of ASD adolescents and early adults,especially those characterised by a high functioning level. Forsuch people, interventions might be needed helping them toachieve a more autonomous management of practical problemsof daily living, for instance managing money and purchasingthings, which can involve non-trivial aspects of cognition (rec-ognize currency notes), decision-making (decide whether theobject and the cost are congruous) and evenmathematical com-petences (calculate exact change). The reason for the lowerinterest in this category of users may be that their high func-tioning nature makes their condition less visible to society,often leaving them with no support for coping with real lifeproblems [10] during their transition to early adulthood. Suchchallenges, often connected with e.g. increased demands ofsocial relationships, self-determination/self-efficacy and moreindependent living, make adolescence and young adulthoodone of the most difficult developmental periods in the life ofthese individuals. This situation is also exacerbated by the factthat public services tend to decline for ASD individuals afterthey leave high school, which is in turn frequently associatedwith substantial reduction (or even absence) of daytime activ-ities such as higher education or work, and a disappointinglyreduced decrease of ASD symptoms for HFA (HighFunctioning Autism) individuals during those developmentalperiods [11].

To alleviate these issues, we have designed and developedwith the support of relevant stakeholders and users a set ofgames aimed at helping HFA autistic adolescents and earlyadults to more autonomously manage their life, more specifi-cally to learn money management and associated mathemati-cal skills, which are both much needed by these users [12, 13].

In particular, the goal is for them to understand money-related concepts and how to apply them in practical situa-tions, so that they can carry out everyday activities related toit. The games have been organised in a responsive Webapplication with multiple difficulty levels to support gradu-al learning. The paper is organized as follows: next sectionpresents related work, then in Section 3 we describe relevantrequirements that have driven the design of the applicationand how they were gathered. Section 4 presents the imple-mented prototype while Section 5 reports an evaluation con-ducted with six HFA individuals. Section 6 describes howthe application was redesigned according to the feedbackcollected during the test. Finally, we conclude with someremarks and plans for future work.

2 Related work

In recent years there has been a sharp rise in the number ofresearch work specifically developed for the ASD population.However, as highlighted in [14], everyone diagnosed with theASD disorder is remarkably different. Thus, on the one hand itis extremely difficult to make generalizations, on the otherhand developing new software and technologies for this in-credibly diverse population is really a challenge.

In the autism spectrum scale of functioning levels, HFApeople represent the sub-group which suffer the least severeform of disability, generally characterized by the absence oflanguage and cognitive impairments. As such, their disabilitycan be less visible to others. We also noted that many contri-butions have focused on children and their learning and devel-opmental related issues [15] because earliest interventions havethe highest possibility to achieve the most benefits. Less studiessupport high-functioning teenagers/early adults in more auton-omously managing their everyday life by means of trainingthem in skills that can be generalizable and transferable topractical everyday situations (e.g. shopping) [16]. Another is-sue that should be taken into account when addressing HFAindividuals is the fact that, although they do not show anyspecific problem on language, they often exhibit lack of abilityin basic mathematics instructions and calculations [13, 17],which can have implications in practical situations such asmoney computation. The problem of training ASD people onshopping skills has been considered in Kirana [18], a gesture-based application that simulates a real world scenario to teachpractical skills to individuals with developmental disabilities.The findings suggest that applications that employ gesture-based interaction to simulate real world scenarios in a safeand controlled environment can provide learning that is trans-latable from virtual worlds to the real one. However, in contrastwith our case, the range of people considered in their tests wasvery variegated because it included individuals with Downsyndrome, mental retardation, autism, and cerebral palsy.

In [10] an application aimed at assisting autistic teenagersin organizing their lives and enhancing the communicationbetween autistic teenagers and their caregivers is proposed.In [19] authors focus on the fact that adolescents with ASDoften have enhanced spatial cognitive abilities but less effi-cient hand-eye coordination. Thus, their main research ques-tion is to understand whether adolescents with ASD perform3D interaction tasks differently than typically developed ado-lescents. To address this question, they present a user studyincluding adolescents without ASD (used as controls) pairedwith adolescents with HFA. Participants performed a series ofbasic 3D rotation and translation matching tasks. Results sug-gest that the ASD group’s deficits in hand-eye coordinationmay have influenced their 3D interaction performance morethan their spatial ability did.While this work gives insight intothe usability of 3D interaction for adolescents with ASD, it

Mobile Netw Appl

Page 3: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

focuses on a peculiar type of applications and, as such, theirresults cannot be easily transferable to more common userinterfaces such as Web applications, which have been consid-ered in our solution.

3 Requirements

In order to define appropriate requirements, we involved rele-vant stakeholders in the process, mainly speech therapists andpsychologists with experience providing care to ASD people.

In particular, we had five meetings with a speech therapistinvolved in educational and therapeutic activities for autisticpeople in a local health centre. Thanks to her knowledge of theneeds of autistic people, we were able to collect several re-quirements that have driven the co-design and development ofthe application. We started by identifying current gaps, focus-ing on topics and skills that are currently difficult to teach (orare not taught at all) to HFA people in their teens or above withtraditional methods, and the potential benefits thatpersonalised and motivating computer-based exercises canbring to such people, also because they can practice themautonomously (e.g. without the support of the caregiver) evenin their family settings. The approach used was iterative andwe progressed from ideas just sketched out at the beginning,to more refined design concepts which were then implement-ed in prototypes that we discussed during such meetings. Assuch, the application was designed in a participatory manner:caregivers (e.g. the speech therapist) participated in all thephases of the application development (while end users wereinvolved only during evaluation) and we progressivelydiscussed and captured caregivers’ reactions to the applicationwe were going to develop. In particular, during such meetingsthe speech therapist provided us with useful insights abouttypical challenges HFA users have to deal with when they facereal life activities such as managing money. She also pointedout typical difficulties such individuals encounter wheninteracting with a computer, for instance difficulties with textcomprehension and risks of distractions. In addition, she alsoreported typical strategies that therapists use to avoid upsettingtheir users in their care while smoothly progressing towardsexpected learning objectives. For instance, they try to avoidexplicitly disagreeing with their patients or saying ‘no’ tothem, also because HFA individuals do not have advancedcoping strategies to deal with frustration and regulate theiremotions. In addition, we also discussed with the speech ther-apist typical exercises that trainers usually provide to HFAusers in order to improve skills they need, and which currentlyare often carried out by interacting with paper-based tools withthe help of caregivers.

Other requirements arose from discussions withpsychologists/educators that helped us recruit HFA peoplefor the test: we also involved them to get further requirements,

so that their feedback could inform the development. For in-stance, a requirement clearly identified by them was to intro-duce clear specifications of what the user is expected to do atthe beginning of each game session.

Moreover, in creating software applications for disabledusers, it is crucial to follow certain already established acces-sibility guidelines and principles. Thus, in order to gather fur-ther requirements, we checked the literature for existing sets ofguidelines [20–22] specific for developing applications forpeople with ASD, since users with autism may have a differ-ent worldview than designers. Indeed, for this group of users itis particularly important that the user interface design aims toreduce the software complexity and create an easy, natural,efficient and enjoyable environment to work with. For in-stance, among the guidelines that we applied, there is the needto simplify texts, which we exploited when explaining whatthe user should do to solve the exercise (this text was alsoaccompanied by a corresponding audio to provide users withan alternative interaction channel). To improve the readabilityof theWeb user interface, we also used clear fonts and avoidedbackground images.

To sum up, the requirements we identified in the end werethe following ones:

& The visual channel as the primary modality. The Webapplication should be mainly visual. In general, the num-ber of elements in the page (e.g. text elements) should bekept to a minimum to limit the sensorial stimuli, so reduc-ing the possibility of users’ distractions

& Support for help. Help should be provided to users so thatthey can be aided in critical points or when they are stuckin the application (e.g. by explaining what they have to dofor proceeding in the game, how to interact with it)

& Multimodal rendering. Textual elements appearing in thegame should also be rendered vocally in order to bettersupport people having difficulties in reading.More in gen-eral, the system should provide alternative ways ofinteractions.

& Explain complex procedures. Complex activities shouldbe explained by thoroughly demonstrating and highlight-ing the key points, also dividing them in smaller chunks.One example is the change concept, which was explainedby using a video modelling technique.

& Highlight key aspects. It is important to highlight key el-ements in the application (e.g. adding a border aroundimages on mouse hovering) so as to make them morevisible. Another technique that was used in our case wasto use colours as a supplementary means to better empha-sise some information.

& Support personalisation. Due to the large variability inskills presented by autistic people, tutors should have thepossibility to personalise the application to better copewith the specific needs and characteristics of the user at

Mobile Netw Appl

Page 4: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

hand (e.g. customize the feedback by selecting betweensounds or emoticons according to the user preferences).Different levels of personalisation should be allowed tothe two types of users of the system (tutors and students)

& Support a number of learning objectives connected withthe concept of money. This requirement covers a numberof sub-goals: recognition of the different coins and bank-notes not only in terms of their visual properties (e.g. col-our, shapes), but also in terms of their name and actualvalue; support in understanding the things that can bereasonably and realistically be bought with a specificamount of money; support in learning the mathematicalconcepts of addition and subtraction which are needed tocompletely master the concept of money [23].

Starting from these requirements, we designed the applica-tion that we describe in the next section. The application wasdeveloped using standardWeb technologies and it used respon-sive design to make it effectively rendered on different devices.

4 The games

The resulting application was organised in such a way to re-flect the main learning objectives that we identified (see Fig. 1,left part): recognise the main currency denominations

(banknotes and coins); learn how to manage the change due;learn what can realistically be purchased with a specificamount of money. For the sake of simplicity, we only showthe front view of banknotes and coins.

For consistency reasons some elements are common to allthe exercises of the application. For instance, before the userstarts to play the game, the application shows a text (accom-panied by an audio) explaining what the user is supposed to doto solve that exercise. In addition, for all the games there is aBHelp^ button through which it is possible to activate a videothat shows what to do for solving the game, by showing anexample of use that considers values different from the onesinvolved in the game, so as not to provide solutions to theexercises. In addition, each page contains buttons to navigatethrough the application (e.g. go forward/backward), and abutton to exit.

Smiley faces have been included in all the games of theapplication, also accompanied by special sounds indicatingeither error or success. A yellow smiley face appears only atthe end of a successfully solved game, while a red unhappyemoticon is shown after each error. After the user makes twoerrors the position of the images on the bottom of the page isautomatically shuffled so that the user cannot give answer bymemorizing the positions of the images. The shuffling strate-gy was applied to all the games in this section except for theSum, since in this game the coins rendered on the bottom are

Fig. 1 On the top: The three maingames. On the bottom: The threetypes of exercises included in theBMoney^ game

Mobile Netw Appl

Page 5: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

all the same, thus, applying a shuffling strategy would notbring about any change. The decision not to shuffle after thefirst error was suggested by the therapist, with the aim ofproviding users with a (simpler) Bsecond possibility^ to solvethe game by themselves, while at the same time reducing thelikelihood of failures.

The BMoney^ game was developed to train people recog-nize different currency denominations. When the user ac-cesses this game, s/he can select one of three types of includedgames: BImage and image^, BImage and text^, and BSum^(see Fig. 1, top part). Image and Image presented 12 levelsof difficulty, the other ones only 8 levels. This was done be-cause the speech therapist suggested trying to have the samenumber of difficulty levels for each game in the same gamesection (BMoney^ in this case). Since 8 was the maximumnumber of combinations allowed by the BImage and Text^exercise, we decided having 8 levels, with the only exceptionfor the BImage and Image^ exercise, where at least 12 levelswere needed to show all the considered coins and banknotes(from 1 cent to 10 euro).

Image and image The first game (Image and Image) supportslearning how to identify the main currency denominations andforms in terms of coins and banknotes. The technique used tosupport learning of money denominations is association: thepage is divided into two rows, and the user has to drag eachcoin or banknote visualised in the bottom row onto the corre-sponding similar coin or banknote shown in the top row(Fig. 2 -left). If the user successfully completes the task, theassociated coin/banknote is removed from the bottom row,and the application shows a smiling yellow emoticon at theend of the exercise. If the user makes an error, a smiling redface is shown. This game presents twelve levels of increasingdifficulty, i.e. the games become more challenging as soon asthe user progresses in solving them. The level of difficulty isconnected both to the number of elements to associate (i.e. thehigher the number, the more difficult the task is), as well as tothe similarity between the elements contained in the two rows.Once the user selects the BImage and image^ game, the userhas to solve the first level (the simplest one), which presentsonly three images (one in the bottom row and two in the toprow). Each level of this game presents a series of 4 gameswith the same difficulty. The second level presents a totalof five images (two in the bottom row and three in the toprow). The last level includes six images (three at the bottomand three at the top).

Image and textWhile the previous game aimed to help peoplelearn how to distinguish between the various coins and bank-notes, this game is aimed at assisting HFA students to learntheir names by using image-text associations: the user has todrag the coin or the banknote on its corresponding name (e.g.B10 euro^). As you can see from Fig. 2 (bottom), in this game

decimals of euro were presented as Bcents^, while the curren-cy unit was presented as Beuro^. This game has eight levels ofcomplexity.

Sum It aims to help users learn that, by combining coins andbanknotes, it is possible to obtain further money values. Alsoin this case we used associations. In the top row the applica-tion shows a sequence of coins and banknotes with a B+^ signin between them, while at the end of this sequence, after theB=^ symbol (see Fig. 3-top) the image of an open wallet isvisualized, with two buttons available: one (initially de-activated) to play again the game, the other one to signal thatthe exercise is finished.

To solve the game, the user has to drag in the wallet theprecise amount of money needed to correctly solve the sumand then select the BFinish^ button used to signal that the userhas completed the selection of coins. If the exercise is correct-ly solved, a smiling yellow face will appear, otherwise a redface will be shown and the BRetry^ button will be enabled.Also in this case, various levels of difficulty have been pro-vided, ranging from the simplest one (where only two coinsare combined), to the most complex ones in which also bank-notes are included.

The BMoney Change^ game is dedicated to teaching theconcept of money change. Differently from the previousgames, at the beginning the application asks the user to selecta video model [7] of interest and, only after this, s/he canaccess the game. Video models are videos depicting exempla-ry behaviour: the user is expected to observe a videotape of amodel doing the task (or the skill) the teacher wishes to teach,and then such model is subsequently practiced and imitated.Video modelling is a behavioural technique which has beenshown as being particularly valuable for autistic people. In ourcase two video models were prepared, one having a male actorand another one with a female one, to better suit the preferenceof the user: both of them showed how potential customersshould behave to buy items in a stationery store. During suchvideos some ‘focus’ elements were also used to emphasisekey steps/objects on which users should concentrate their at-tention (‘focus’ objects are generally rendered in the video at areduced speed and by zooming in them). After watching thevideo, the user could access the game, which was presented ina problem-like manner.

The application shows some scenarios of everyday life, andin each of them there is a purchasing action implying a change:the user has to solve the mathematical subtraction associatedwith the considered scenario (see Fig. 3-bottom) by means ofselecting, among the images available in the bottom part of theuser interface, the one representing the right solution. In thevideos we built, a customer wanted to buy a pen. Four ‘focus’elements were used: i) the hand of the shop assistant when s/hesays how much the pen costs (in this case: 1 euro). Whileproviding the customer with the information about the cost of

Mobile Netw Appl

Page 6: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

the pen, the shop assistant indicates with his/her finger the ‘1’number; ii) the second focus element is centred on the pen,which is concretely given to the customer in order to betterreinforce the concept of purchasing; the remaining two focuselements are both directed towards the money: iii) the customergives to the shop assistant 5 euros to pay the pen and then thereis a zoom on the banknote and on the gesture of the customerwhile providing the money; iv) the last focus element is on thechange that the shop assistant gives to the customer, to empha-sise that, before exiting the shop, the customer should take thechange. Also this game presents eight levels of difficulty.

The BBuy It!^ game allows the student to learn what canrealistically be purchased with a specific amount of money, bysimulating a real situation. At the start of the game the user ispresented with a BWhat can I buy with…^ text in the top partof the UI, together with the amount of money considered. Thequestion is further emphasized by an emoticon showing athinking face (see Fig. 4).

Then the user has to select among three different images(shown in the bottom part) the one that should correspond tothe indicated amount of money. This game is the last one inthe series of exercises since it implies that the user has already

got the skills needed to solve the previous ones. It provideddifferent levels of difficulty, smiling faces to indicate success/error, and a shuffling strategy applied after two user errors. Insuch games, we purposefully tried to include objects thatcould be of interests of such people (e.g. objects they couldreasonably like to have), so as to make them learn skills help-ing them in deciding whether they would afford to buy some-thing that they would like, so progressively understanding andgetting a sense of what can be reasonably be bought with aspecific amount of money.

5 Evaluation

We tested the application to assess to what extent it helps usersin understanding the concepts associated with moneymanage-ment. The test was divided into three steps. We first submitteda pre-test questionnaire to gather demographic data. Then, theparticipants had to carry out five tasks (each task associatedwith a type of game) using the application. Finally, they had tofill in a System Usability Scale (SUS) questionnaire [24], formeasuring the usability of the application. SUS is a 10 item

Fig. 2 Money game - Image andImage exercise (on the top);Image and Text exercise (on thebottom)

Mobile Netw Appl

Page 7: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

questionnaire with five response options for respondents, fromBstrongly agree^ to Bstrongly disagree^.

We tested the application at the premises of an associationsupporting ASD individuals. The test involved six male HFAindividuals, indicated in the following with a set of pseudo-nyms: Francesco, Jacopo, Gabriele, Giulio, Andrea, Mattia.All of them had been diagnosed with high functioning ASD(although some of them presented traits that would better

locate them towards the lowest edge of the high-functioninglevel). Their age ranged from 16 to 22 years (M = 18.5; SD =2.2). In order to better coordinate the participants during theevaluation, we divided them into two groups consisting ofthree members each, depending on their age.

One group (Francesco, Jacopo and Gabriele) was composedof three young adults (age range 20–22), all having a highschool diploma. Their level of use of technological devices is

Fig. 3 Money game: Sumexercise (on the top); MoneyChange (on the bottom)

Fig. 4 The Buy it! game

Mobile Netw Appl

Page 8: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

high, the most used device is the smartphone, exploited forbrowsing the Web. Two users use both tablets and PC devices,one user never used tablets and he uses the PC just a few timesa week. All of them use such devices to browse the Web andplay games. The three remaining users (Giulio, Andrea andMattia) are teenagers (16–17 years old) still finishing secondaryschool. Their familiarity with devices was rather varied. Whileone user was particularly familiar with technology (havingeven some knowledge of JavaScript), another user occasionallyuses a smartphone (e.g. to call his mother) and he did not haveany experience with PCs. The last user had low familiarity withsmartphones (used only for photos and Web browsing) andtablets, and very good familiarity with PCs (used for Webbrowsing and games).

The tasks assigned to the users were to access and completeevery level of the five games developed in the application(Task1: Money/Image and Image game; Task2: Money/Imageand Text game; Task3: Money/Sum game; Task4: Changegame; Task5: Buy it! game). Participants had to use the appli-cation twice: the second try was carried out 1 week after thefirst one. This was done to understand whether any improve-ments in using the application could be detected over time. Forevaluation goals, the web application was enhanced with alogging tool (implemented in JavaScript), which was mainlyused to log user interaction times during the test. The test wascarried out by using a Windows-based laptop having a 15,6″monitor with a 1366 × 768 resolution, and a AMD Quad-CoreA8-6410 processor. Each participant was informed that hewould be allowed to interact with each exercise for at maxi-mum of 5 min. Since they had to solve five tasks, the totalduration of the study for each user was about half an hour.

Task success The BTask success^ metric is used to verifywhether and how users completed the assigned tasks. Foursuccess levels were identified: we assigned a B1^ score if theuser did not have any problem, B2^ when just a small prob-lem was found (e.g. two slight errors occurred and then theuser was able to continue the interaction), B3^when the usermade more serious errors, and B4^ when the user was notable to solve the exercise at all. Figure 5 shows two stackedbar charts indicating the success level for each task in bothtests. During the second try we obtained higher scores thanin the first one.

In particular, in the second trial, we had a higher number oftasks successfully carried out by users, and the number of errorsdue to major problems were less than in the first trial. Only forthe last task (task 5) a fewmajor problems occurred in the secondtrial and not in the first one. This happened mainly becauseFrancesco was a bit tired and considered the game easy, thushe did not pay sufficient attention in the task performance.

Time on taskData related to this metric was collected by usinga logging script, mainly to record interaction times.

We gave amaximum of fiveminutes to solve each task, andthen we verified whether in this interval of time the user wasable to solve the exercise. If not, the evaluator recorded the lastlevel reached by the user. Levels reached during the two trialswere then compared to each other. In this comparison, otherfactors were also considered, e.g. errors made and requests forhelp. Regarding the levels reached, we obtained improve-ments in this metric for all the tasks over the two tests.

For task1, task2, and task5, all users reached the maximumlevel in both tests; for task3 and task4, four users (out of 6)reached the maximum level in the second test; the remainingtwo users (namely: Andrea and Giulio) both reached the pen-ultimate level in one task and the last level in the other one.This also confirmed the fact that the 5 min assigned for com-pleting each task was overall reasonable. The results on thetask performance timemetric gathered in both trails are shownin Fig. 6 (top and bottom), where the X axis refers to tasks andY axis refers to time on task in seconds. Lower and upperbounds were also calculated on such data: apart from one caseassociated with lower bound values on Task 2 (namely: 72 s inthe second session and 61.2 s in the first session), time on taskimproved overall between the two sessions.

Errors We also counted the number of errors made by theparticipants and also in this case, overall, we obtained im-provements, since it decreased between the two evaluationsessions (see Fig. 7 top and bottom). The only exceptionregarded Francesco, who in the first trial made just two errorsin the whole test, while in the second session he made twoerrors in the last three tasks. In the execution of the second test,the moderator reported that Francesco, probably due to hisprevious experience with the application (in the first try),may have felt a bit overconfident, which in the end could havecompromised the resulting accuracy in solving the games.

Satisfaction In order to assess user satisfaction, we adminis-tered the SUS questionnaire, which was filled in by users atthe end of each session. According to Jacopo, Francesco andAndrea, the application was not very usable (they got 50, 52.5and 60 marks respectively), whereas the other three usersjudged it usable (the scores were 100, 85, and 77.2). In thisregard, the moderator noticed that, while filling in the ques-tionnaire, users seemed a bit tired and not very motivated tospend time and effort on an activity which was not strictlyrelated to using the application.

In the first trial the group composed of Francesco, Jacopoand Gabriele showed difficulties with calculations (some ofthem even used the calculator during the test). Another prob-lem was connected with reading the texts included in theBImage and Text^ game, which particularly affected the per-formance of one user. Just one user indicated the need formore time to solve the games (i.e. longer than the allowedone: 5 min). Another user complained about the smiley faces

Mobile Netw Appl

Page 9: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

used in the games. Users found the BImage and Image^ andBImage and Text^ games too simple, whereas the BSum^ gamewas found a bit too difficult. During the second session someof them showed some progress.

Regarding the other group (Giulio, Andrea and Mattia),contrasting comments came from them in the first trial. Twoof them evaluated the application nice but not particularlyengaging in some points, whereas one found the applicationboth valuable and stimulating. Giulio and Andrea had prob-lems with calculations (in the Sum and Money Changegames). Mattia had just one concern in the Buy it! game ashe thought that different things shown in the game could bebought with the same amount of money. Mattia and Francescodid not like the provided audio feedback much. During thesecond test, two of them showed evident improvements inperformance.

6 Revised application design

A revision of the application design was motivated by thecomments received through the user test, which encouragedus to make some changes, since not all users were completely

satisfied. For instance, some users felt a bit annoyed by thesounds that were provided as positive or negative feedback(although other users did not express any particular negativefeeling about such sounds). However, taking into account thepeculiar diversity that characterizes ASD individuals, wejudged it relevant to add for the tutor the possibility to person-alize the application according to user preferences. To thisgoal, within the tutor page showing the information associatedwith the students, we included a checkbox (see Fig. 8) toactivate (or deactivate) the playing of such sounds for eachuser. This setting did not affect the vocal support provided inthe game to explain the students the tasks to do, which wasprovided in any case. In addition, the tutor can select specificaudio files to use in the games, as well as set the most suitablevolume level, according to the preferences of the concerneduser.

Another aspect that was involved in the customisation isthe colour of the pages. Although we did not gather any spe-cific comment in the user test on this aspect, we judged ituseful to add it in the customisation support. By default, theapplication has a white background, a neutral colour chosen toavoid bothering or distracting users. Given that ASD individ-uals can show specific (and sometimes atypical, see e.g. [25])

Fig. 5 Task success – First test(top) and second test (bottom)

Mobile Netw Appl

Page 10: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

preferences or aversion for some colours, we gave the tutoralso the possibility to change the colour of the games based onthe user preferences. To do this, a colour selection palette wasadded to the tutor page: when the tutor chooses a specificcolour, the background colour of the panel containing theimages of the game changes, whereas the background colourof the whole page remains unchanged. Another customizationoption that we gave to tutors was the possibility to choosespecific images for providing positive and negative reinforce-ments. By default, they are colorful (happy and unhappy)smileys, but tutors can choose other images (i.e. from theirlocal disks).

An additional modification was the inclusion of a furthergame to assess the capability of users to exploit the skillslearned through the application in more realistic settings.Indeed, HFA individuals have problems with abstract ideasand conceptual thinking, with difficulties in generalizing whatthey learned from one setting to another one. Thus, teachingthrough multiple examples across various settings in whichskills can be used should help them in applying learned con-cepts to different situations and more easily making

connections between the various learned abstract concepts(connected to e.g. maths and money) and their concrete expe-riences in everyday situations. As such, we judged it relevantto offer such students another scenario in which they couldpractise the acquired money-related skills. Following the sug-gestion of the speech therapist, we considered the interactionwith a vending machine as the scenario for the additionalgame we developed for the application, since vending ma-chines (to buy e.g. soft drinks or snacks) are very popularamong adolescents who are at a stage in life in which theyexperience increased autonomy, even in terms of some discre-tionary availability of money. Thus, this was judged a relevantsituation for HFA teenagers/early adults to be confronted with.

The structure of the new game mostly exploited the visualmodality to facilitate ASD learning. When the student ac-cesses the game, the image of a vending machine is rendered,showing various types of products, i.e. chips, chocolates anddrinks. By selecting one of the various images representingthe products offered by the machine, the corresponding iden-tification number associated to each product appears. Whenthe user finds an item s/he is interested in purchasing, s/he

Fig. 6 Time on Task in the firsttest (top) and in the second test(bottom)

Mobile Netw Appl

Page 11: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

Fig. 7 Errors in the first test (top)and in the second test (bottom)

Fig. 8 Support for customization

Mobile Netw Appl

Page 12: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

selects the related image, types the associated identificationnumber by using the numerical keypad, and then selects thebutton to confirm the entered number. At that point, variouscoins appear below the image of the product. We decided touse only coins because it is more common to insert them in avending machine than banknotes. Above such coins there isthe image of the product that the user selected, accompaniedby its price. In order to purchase a product, the user must enterthe appropriate amount of money.

The game has various levels of difficulty, associated notonly with the number of coins needed to purchase a certainproduct (i.e. for basic levels users need to insert just one coin),but also with the fact that when users enter too much money,they must indicate how much they would get as change.Although this does not completely reflect what typically hap-pens with real vending machines, it was included as a furtherexercise to practise the concept of change due. In particular, incase of simple games the user has the possibility to insert twotypes of coins: one is correct and the other one is wrong.Whenthe user enters the correct amount, a green tick appears next tothe slot indicating that the student has provided the correctanswer, otherwise a red cross appears. For the games thatprovide the opportunity to get the change there are two typesof amounts that the user can enter, one Bwrong^ and one right.Since there are various coins to be inserted, every time the userdrags the coin into the slot, a counter appears above the slotshowing the amount the user has currently inserted in themachine. When the amount entered by the user is higher thanthe actual price of the product, the following sentence appears:BYou have entered. How much change is due?^. Under thissentence two types of coins that correspond to the changeappear, one is right and one is wrong (see Fig. 9). When the

user provides the right answer, the green tick appears next tothe correct coin, otherwise a red cross appears next to thewrong coin.

Regardless of the difficulty of the game, when the user hasto insert the coins in the slow, the slot is visualised as enlargedand, to further draw user attention towards it, an arrow indi-cating the slot also appears.

The techniques used for supporting the game are matchingand selection. In order to insert the amount inside the vendingmachine, the user should drag the coins into the slot, imitatingalso a real gesture. Instead, when the user has to indicate thechange, the answer modality is different because in this case s/he has to select the correct coin.

The new game added to the application was designedto continue the initial training through which users canlearn the various sizes of money and their names. At theend they can test the skills acquired using the vendingmachine, an instrument that they can really use in theirdaily life.

7 Conclusions and future work

In this paper we present a game-based Web application aimedat supporting high functioning ASD people in their teens andabove to gain practical life skills connected with money man-agement. A user study was conducted with six high function-ing ASD individuals to assess its effectiveness and usability.Overall, the test shows encouraging results in the potentialityof training high functioning ASD individuals in acquiringskills associated with money management. In addition, beinga Web application, it can be autonomously exploited by users

Fig. 9 The vending machinegame

Mobile Netw Appl

Page 13: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

whenever they want, and at their own pace, without the needof being supported by caregivers.

The results gathered in the user tests, while promising,encouraged us to revise the design of the application, byincluding a customisation support for enabling tutors toconfigure specific settings according to which the appli-cation is adapted. In addition, a further game was includedto make students practise the learned concepts in a sce-nario that resembles a situation which they should be fa-miliar with. The redesigned application has not been em-pirically validated.

For future work, we plan to conduct further user stud-ies to assess the effectiveness and usability of theredesigned application, and to carry out additional workto make the application more personalised and adaptive touser’s needs, preferences and behaviour. We also plan toevaluate whether and how students will actually be able toapply the skills acquired through the games in real con-texts. Indeed, it is a well-known issue that ASD peoplewho undergo specific learning interventions typically donot show the ability to generalize and transfer the learnedskills to novel, different, practical situations of real life.Thus, further studies (e.g. with larger samples, includingcontrol groups, lasting longer treatment periods) are need-ed to attain deeper knowledge of the efficacy of suchcomputer-based interventions in supporting users’ abilityto apply the learned money-related concepts to practicalreal-life contexts, and to understand the long term effectsof such interventions to assess whether changes remainstable in time. In such future tests, we also plan to con-sider other types of evaluation tools, even in combinationwith each other, e.g. video recording, eye tracking, tohave more comprehensive information on user behaviour,while avoiding relying too much on user-reported data.

References

1. American Psychiatric Association (2013) Diagnostic and statisticalmanual of mental disorders, 5th edn. American PsychiatricAssociation, Washington, D.C.

2. National Institute of Neurological Disorders and Stroke. Autismspectrum disorder fact sheet. Available at: https://www.ninds.nih.gov/Disorders/Patient-Caregiver-Education/Fact-Sheets/Autism-Spectrum-Disorder-Fact-Sheet.

3. Aresti-Bartolome N, Garcia-Zapirain B (2014) Technologies assupport tools for persons with autistic Spectrum disorder: a system-atic review. Int J Environ Res Public Health 11(8):7767–7802.https://doi.org/10.3390/ijerph110807767

4. Bossavit B, Parsons S (2016) Designing an educational game forand with teenagers with high functioning autism. In: Bossen C,Smith RC, Kanstrup AM, McDonnell J, Teli M, Bødker K (eds)Proceedings of the 14th participatory design conference: full papers- volume 1 (PDC '16), vol 1. ACM, New York, pp 11–20. https://doi.org/10.1145/2940299.2940313

5. Moore D (1998) Computers and people with autism / Aspergersyndrome, in communication (the magazine of the NationalAutistic Society), pp 20–21

6. Cafiero J (2005) Meaningful exchanges for people with autism: anintroduction to augmentative & alternative communication.Woodbine House, Bethesda

7. Delano ME (2016) Video modeling interventions for individualswith autism. Remedial Spec Educ 28(1):33–42

8. Bernardini S, Porayska-Pomsta K, Smith TJ (2014) ECHOES: anintelligent serious game for fostering social communication in chil-dren with autism. J Inf Sci 264:41–60

9. Odom SL, Thompson JL, Hedges S, Boyd BA, Dykstra JR, DudaMA, Szidon KL, Smith LE, Bord A (2015) Technology-aided in-terventions and instruction for adolescents with autism spectrumdisorder. J Autism Dev Disord 45:3805–3819. https://doi.org/10.1007/s10803-014-2320-6

10. Hong APCI, van Heugten S, Kooken T, Vinke N, Vromans M,Shahid S The augenda: structuring the lives of autistic teen-agers. In: Proceedings of the 12th international ACMSIGACCESS conference on computers and accessibility(ASSETS '10). ACM, New York, pp 283–284. https://doi.org/10.1145/1878803.1878872

11. Shattuck PT,WagnerM,Narendorf S, Sterzing P, HensleyM (2011)Post-high school service use among young adults with an autismspectrum. Arch Pediatr Adolesc Med 165(2):141–146

12. Waters HE, Boon RT (2011) Teaching money computationskills to high school students with mild intellectual disabilitiesvia the TouchMath© program: a multi-sensory approach.ETADD 46(4):544–555

13. Schaefer Whitby PJ (2013) Teaching mathematics to students withhigh functioning autism. AGUIDE to teaching students with autismspectrum disorders

14. Morris RR, Kirschbaum CR, Picard RW Broadening accessibilitythrough special interests: a new approach for software customiza-tion. In: Proceed. ASSETS '10. ACM, pp 171–178. https://doi.org/10.1145/1878803.1878834

15. Ploog BO, Scharf A, Nelson D, Brooks PJ (2013) Use of computer-assisted technologies (CAT) to enhance social, communicative, andlanguage development in children with autism spectrum disorders. JAutism Dev Disord 43:301–322. https://doi.org/10.1007/s10803-012-1571-3

16. Kapp SK, Gantman A, Laugeson EA (2011) Transition to adult-hood for high-functioning individuals with autism spectrum disor-ders. University of California, Los Angeles

17. Donaldson JB, Zager D (2010) Mathematics interventions for stu-dents with high functioning autism/Asperger's syndrome. TeachExcept Child 42(6):40–46

18. Sharma S, Srivastava S, Achary K, Varkey B, Heimonen T,Hakulinen J, Turunen M, Rajput N (2016) Gesture-based inter-action for individuals with developmental disabilities in India.In: Proceedings of the 18th international ACM SIGACCESSconference on computers and accessibility (ASSETS '16).ACM, New York, pp 61–70. https://doi.org/10.1145/2982142.2982166

19. Mei C, Mason L, Quarles J (2014) Usability issues with 3D userinterfaces for adolescents with high functioning autism. In:Proceedings of the 16th international ACM SIGACCESS confer-ence on Computers & accessibility (ASSETS '14). ACM, NewYork, pp 99–106. https://doi.org/10.1145/2661334.2661379

20. Kamaruzaman MF, Rani NM, Md Nor H, Haji Azahari MH (2016)Developing user interface design application for children with au-tism. Procedia Soc Behav Sci 217:887–894

21. Pavlov N (2014) User Interface for people with autism spectrumdisorders. J Softw Eng Appl 7(2):Article ID:43152,7 pages. https://doi.org/10.4236/jsea.2014.72014

Mobile Netw Appl

Page 14: TheDesignofWebGamesforHelpingYoungHigh ...giove.isti.cnr.it/AssetsSitoLab/publications/cariaMNA2018.pdf · autism have strong visual processing skills, making them good candidates

22. Pagani Britto TC, Pizzolato EB (2016) Towards web accessi-bility guidelines of interaction and interface design for peoplewith autism spectrum disorder. Proceedings of the ninth inter-national conference on advances in computer-humaninteractions

23. Malagoli M (2001) Laboratorio euro, Edizioni Centro StudiErickson S.p.A, Trento

24. Brooke J (1996) SUS: a "quick and dirty" usability scale. In: JordanPW, Thomas B, Weerdmeester BA, McClelland AL (eds) Usabilityevaluation in industry. Taylor and Francis, London

25. Grandgeorge M, Masataka N (2016) Atypical color preference inchildren with autism spectrum disorder. Front Psychol 7:1976.https://doi.org/10.3389/fpsyg.2016.01976

Mobile Netw Appl