Enabling Cooperative Educational Game Design on the Web

Size: px

Start display at page:

Download "Enabling Cooperative Educational Game Design on the Web"

Rodger Ray
5 years ago
Views:

1 Enabling Cooperative Educational Game Design on the Web Navid Ahmadi, Mehdi Jazayeri, and Monica Landoni Faculty of Informatics, University of Lugano, Lugano, Switzerland Abstract. Educational game design environments enable end users to create computer games and are used as an engaging medium to teach programming to novice programmers. Although the cooperative dimension of end-user programming has been recognized and collaboration among novice programmers is advised, educational game design environments have remained solitary and desktop based, with only limited support for sharing at most through a supplementary Website. Inspired by cooperation benefits of Web 2.0, we have developed AgentWeb, a fully Webbased game design environment that incorporates cooperation tools into the game design process. Coupled with the participative nature of Web 2.0 applications, AgentWeb enables a richer class of learning and collaboration in which the download-upload operations are unnecessary and users are given instant access to the design and implementation of other games. The sharing of design is an enabling ingredient for cooperative design. We present a preliminary evaluation of AgentWeb s usability. Keywords: End-user programming, collaborative design, educational game design, Web 2.0, cooperative applications 1 Introduction Tempted by the possibilities offered by Web applications and cloud computing, many applications are migrating from the desktop to the Web [1]. Computer games have been popular applications on the Web but their design has always been done on the desktop. If we can move the design process to the Web, we open the possibility of collaboration on the design of games. Computer games have applications not only in entertainment but also in education and they are being adopted increasingly for game-based learning purposes in public schools [2]. A subset of these applications include game design environments such as AgentSheets [3], Alice [4], GameMaker [5] and Scratch [6], which have long been used to enable non-programmers to develop their own computer games. These game design environments are also employed as an engaging medium to teach computer programming concepts such as objects, agents, instances, behavior, and interaction to school and college students [7]. The usual audience of mentioned game design environments are users with no or little programming skills who are known as novice programmers [7], or in short novices,

2 2 Navid Ahmadi, Mehdi Jazayeri, and Monica Landoni who also are known as end users if they are not interested in programming per se. In this paper we may use these terms interchangeably. End users are known to seek help from their peers to solve their programming and in general computational problems [8]. Collaboration in the form of pair programming among students attending an introductory computer science course has proven to improve their learning [9]. Peer learning settings have been successful also in teaching introductory computer science courses. Despite this evidence, existing game design environments are solitary desktop-based applications. Such environments have no or very limited support for collaboration [7]. The focus of our work is to help end users learn basic programming skills by cooperating on game design. In this paper we report on our effort to build a Web-based cooperative game design environment called AgentWeb. Agent- Web is implemented completely with open-web technologies and runs entirely in modern browsers browsers that support HTML5. Enjoying the benefits of Web 2.0 technologies, AgentWeb transcends the solitary boundaries of desktopbased applications by offering users to not only play games but also design them and collaborate with others in game design. AgentWeb consists of the following components: A fully Web-based game design environment created using open-web standards, which brings global platform-independent access to the software with zero installation cost, enabling the game design process to take place on the Web. A Website around the game design environment that supports cooperation and community building, and provides basic integration with existing social networking applications. The rest of the paper is structured as follows. We review the related work in the next section. In Section 3 we present the game design environment. Section 4 discusses how the Website around the game design environment enables cooperation among game designers. Sections 5 evaluates initial usability testing of AgentWeb. Section 6 concludes the paper. 2 Related Work Cloud-based applications have provided global access to software [1]. In particular, Web 2.0 [10] has been recognized as a medium that supports social learning [11]. Several game design communities, commercial and educational, have employed Web 2.0 methods to form a community around the game design environment. Game sharing Web sites have facilitated collecting and sharing the games developed by users regardless of their learning context. Early on, Behavior Exchange let users share AgentSheets games through the Web [12]. YoYo Games 1 provides an online community for Game Maker users to share their games, although online playing or exploration of the games is not possible. Game Salad

3 Enabling Cooperative Educational Game Design on the Web 3 enables online play of the game using a browser-specific plugin that should be installed on the desktop. Little big planet is known for its online community of end users developing their own levels for the game 3. The Scratch Web site 4 has collected millions of user-created games and lets users play the games online, though for exploring the game objects and programming, the game has to be downloaded to the desktop. In the existing game communities, online users can play the games and write comments on or rate them from inside the Web browser. However, the game design process is not supported by collaborative and social modalities. These Web sites at best render the game as the final product in the browser using Rich Internet Application platforms [13] such as Java or Flash, i.e., the games are shared as a black box that can only be played on line. In order to explore the inside of the game to learn how a game was created, users have to download the game and open it in the game design environment. Such interfaces draw a line between playing the game as the entertaining artifact and exploring the game components as the educational artifact in the online social environment of the user. As the game design process takes place on the desktop of individuals, rather than in the game sharing environment, such Web sites fail to incorporate the game design activities into the social context of the online community. In contrast to existing desktop-based game design environments, our approach is to leverage open-web technologies to seamlessly incorporate the game design activities into the cloud. The natural sharing supported by cloud storage enables the users to create and explore the game objects together. 3 Web-based Game Design for Novice Programmers As mentioned earlier, sharing the design of the game among novices is traditionally constrained by the upload/download barrier. Users have to download a game to open it with the corresponding application on the desktop and in case they modify the game they should upload it again. In order to enable cooperation among novices to the same extent provided by existing Web 2.0 applications such as blogs and Wikis, it is crucial to provide the novices with a Web-based application in which upload-download operations are eliminated. As a result, users creations are instantly shared with the others. There are also other advantages of Web-based applications compared to desktop-based applications that enhance the user experience, including global platform-independent access to the application, zero installation cost, and cloud-based storage of user data. Accordingly, we designed and implemented AgentWeb as a fully Web-based game design environment 5. Being built using open-web technologies, i.e., HTML5, JavaScript, and CSS, AgentWeb transcends the need to install any software on the desktop. Users design, store and play the games in the cloud which eliminates A proof-of-concept Website is available at

AgentSheets has been successfully used in schools to teach game design to middle school students [14].

4 4 Navid Ahmadi, Mehdi Jazayeri, and Monica Landoni the barrier of uploading/downloading games from/to the desktop. 6 AgentWeb s game design and programming model is inspired by AgentSheets, an end-user authoring tool for creating agent-based computer games and scientific simulations [3]. AgentSheets has been successfully used in schools to teach game design to middle school students [14]. With AgentWeb, users are capable of creating 2D games and scientific simulations such as Sokoban, Pac Man, Space Invaders, and Game of Life. AgentWeb provides users with an Integrated Development Environment (IDE) to create the game objects, draw their depictions, program them, and put them together in the game scene, all from inside the Web browser. Figure 1 shows the layout of the IDE, which consists of four main panes. Agent Gallery maintains the game objects, called agents, and their assigned depictions. Each agent may have several depictions. Image Editor lets users draw depictions for the agents 7. Programming Environment lets users program the agents using a visual programming language. Scene Editor lets users create the game scene by instantiating the game objects and executing them. AgentWeb Game Design Environment Toolbar Depiction Editor Scene Editor Agent Gallery Visual Programming Environment Fig. 1. The AgentWeb IDE layout shows the main user interface components of the browser-based game design environment. The environment may be accessed at AgentWeb supports novices with a visual rule-based programming environment, following the tactile programming paradigm [15]. Each agent contains its own program that consists of a set of methods. The desired functionality of each method is achieved by composing the game design instructions using drag-anddrop. AgentWeb facilitates the game design process by providing novices with a direct manipulation user interface [16]. For instance, as soon as an agent de- 6 The current version of AgentWeb runs in Google Chrome, Mozilla FireFox and Apple Safari browsers, which together count for more than 60% of worldwide browser usage share according to the statistics provided by StatCounter as of April AgentWeb employs PaintWeb, an open source Web native image editor.

5 Enabling Cooperative Educational Game Design on the Web 5 piction is modified in the image editor, the modification is instantly applied in the other panes including programming environment and the scene editor, even while the game is running. To achieve a responsive game design environment, we have decided that 8 the games must be executed without relying on server communication. Therefore, a client-side compiler translates the visual program into JavaScript which is then executed by the AgentWeb runtime system. The runtime system includes a game engine, graphics engine and mouse and keyboard controllers designed specifically for games. AgentWeb facilitates game programming for game designers using interactive programming techniques. Game designers are able to modify the agent program while the game is running and the changes are immediately applied into the execution. Interactive programming provides immediate feedback on agent behavior at run time. A typical game design use-case of interactive programming is in tuning the speed of moving objects in the game. In the absence of interactive programming, a game designer would have to recompile the program manually after a modification and re-run the game to explore if the agent behavior is satisfactory. 4 Enabling Cooperation Among Game Designers Enabling the game design from inside the browser is a stepping-stone towards integrating the cooperation and social benefits of the Web into the application. Unlike the desktop-based game design environments in which the game design is a solitary activity, unless in a face-to-face context, AgentWeb enables users to cooperate around game design activities. In this section we report on how a Website created around the game design environment facilitates cooperation among game designers. The Website lets users create personal accounts with which they can create, design, and store their own games. The Website exposes all the games created by all users and provides search and categorization functionalities. Users may examine the code of games and modify them to observe the new behavior in the game (however, saving the modifications is limited to authorized members of the game design community). We call this kind of design sharing open-source design. Traditional desktops use a closed-source model in which users have access to the game only as players. They do not have access to the design of the game as a shared entity. Unlike the existing game sharing portals, in which every game can be modified only by its owner, the AgentWeb Website allows other users to join as a designer of that game, and upon approval of the game owner, they will have access to modify and save the new version of the game. As a result, each game can have a community of game designers who will work on the same game at different times (concurrent modification of a game is disallowed to avoid conflicts). 8 For space reasons, we omit from this paper the rationale for our architectural design decisions.

6 6 Navid Ahmadi, Mehdi Jazayeri, and Monica Landoni The Website provides users with both asynchronous and synchronous communication and cooperation tools. Asynchronous tools include forums in which users can share their questions with others, rate, and comment on the games. Authenticated users can use instant messaging and chatrooms to communicate with each other. The chat facility is available on all the pages of the Website, as an overlay, which lets users cooperate while designing a game. The Website provides basic integration with social networking applications, which enables users to share and collaborate within their own social network. Users login to the AgentWeb Website using their Facebook account. Furthermore, they can share their game design and play activities on several social networks right from inside the Website. By situating the game design into the user s online social activities, we facilitate the process of learning to program [17]. 5 Preliminary Usability Evaluation To study the usability of the game design environment, initially we conducted an evaluation with four highschool Informatics teachers using cognitive jogthrough method [18]. The feedback from teachers was used to improve the support for computational thinking in informal learning contexts and design the collaborative features of the Website accordingly. Subsequently, we conducted a one-day workshop with 13 high-school students in the age range of 15 and 20. Participants were given 90 minutes of hands-on tutorial on how to create a frogger game. Next, they were given 60 minutes to improve their games. The workshop setting was a round-table in a classroom. A total of 40 students had originally applied to take part in the workshop and among them only 13 were selected. After a brief introduction, each student was asked to fill a brief questionnaire about age, education and preferred subjects, from which it emerged that the majority was inclined towards science, mathematics and informatics. The students showed their interest and dedication by engaging deeply equally during the tutorial part and even more so while working on their games; they kept working even during breaks. At the end of the workshop participants were asked to fill in a questionnaire regarding their overall game design experience. Figure 2 shows the mean user experience measured using likert scale in three aspects: use of computer during the workshop, the game design environment, and the cooperative Website. All students commented on how easy and fun the system was and a third of them mentioned how much they enjoyed the possibility to share their work with their peers. This is in line with their behavior during the game design session. Even if students did not ask many questions directly from tutors and limited their active participation during the workshop taking an active role in a class and showing genuine interest in a topic is seen as showing off and not cool still, more than half of them enjoyed publishing their earlier work during development, showing how much they liked to share their new achievements with their peers and valuing this option.

Enabling Cooperative Educational Game Design on the Web 7 Strongly Agree5" Agree4" Not Sure3" Disagree2" Strongly Disagree1" Fun Interesting Frustrating Boring Computer Use Confusing Cool Annoying

As the students were collocated and the number of participants was low we can not state any statistically valid conclusions.

7 Enabling Cooperative Educational Game Design on the Web 7 Strongly Agree5" Agree4" Not Sure3" Disagree2" Strongly Disagree1" Fun Interesting Frustrating Boring Computer Use Confusing Cool Annoying Easy to learn Game Design Environment Entertaining Confusing Cool Annoying Easy to learn Cooperative Website Entertaining Fig. 2. Mode of participants rating based on the likert scale. As the students were collocated and the number of participants was low we can not state any statistically valid conclusions. However, we observed that most of the participants naturally cooperated with their adjacent participants to solve their own problems. Even though all the participants were physically in the same location, a few used chat to seek help from other participants. We are planning comprehensive studies to understand the mechanics of cooperation and socialization among novice game designers and how the Web-based cooperative game design experience affects the user s game design and learning process in comparison to existing non-cooperative environment. We are going to investigate the different facets of collaboration, going beyond traditional exchange of messages, textual and spoken communication. Students could see the advantages of sharing their work as a direct way to start a collaboration and get help while establishing themselves and let their game represent them. We will explore how to take this type of collaboration further and what kind of support students would need in order to assert themselves and become active participants in the game design community. 6 Conclusions The paper has introduced a cooperative game design environment, called Agent- Web, which enables novice programmers to design and share computer games right from inside their browser. AgentWeb has a visual user interface appropriate for use by novice programmers. It runs in the Web, and entirely in the client s browser. The cooperative Website around the game design environment enables (end) users to share, and collaborate in, the design of a game. Using the metaphor of Web 2.0, we argue that AgentWeb represents a new generation of game design environments that we characterize as Game Design 2.0.

8 8 Navid Ahmadi, Mehdi Jazayeri, and Monica Landoni References 1. Jazayeri, M.: Some Trends in Web Application Development Future of Software Engineering (FOSE 07) (May 2007) Honey, M.A., Hilton, M.: Learning Science Through Computer Games and Simulations. The National Academies Press (January 2011) Repenning, A.: Agentsheets: a Tool for Building Domain-Oriented Dynamic, Visual Environments. PhD thesis, University of Colorado (1993) 4. Cooper, S., Dann, W., Pausch, R.: Alice: a 3-D tool for introductory programming concepts. Journal of Computing Sciences in Colleges 15(5) (2000) Overmars, M.: Teaching computer science through game design. Computer 37(4) (2004) Resnick, M., Silverman, B., Kafai, Y., Maloney, J., Monroy-Hernández, A., Rusk, N., Eastmond, E., Brennan, K., Millner, A., Rosenbaum, E., Silver, J.: Scratch: Programming for All. Communications of the ACM 52(11) (November 2009) Kelleher, C., Pausch, R.: Lowering the barriers to programming: A taxonomy of programming environments and languages for novice programmers. ACM Computing Surveys 37(2) (June 2005) Nardi, B.: A Small Matter of Programming: Perspectives on End User Computing. MIT Press (December 1992) 9. Williams, L., Wiebe, E., Yang, K., Ferzli, M., Miller, C.: In Support of Pair Programming in the Introductory Computer Science Course. Computer Science Education 12(3) (January 2002) O Reilly, T.: What is Web Design patterns and business models for the next generation of software. (2005) 11. McLoughlin, C., Lee, M.J.: Social software and participatory learning: Pedagogical choices with technology affordances in the Web 2.0 era. In: Proceedings ASCILITE Singapore (2007) Repenning, A., Ambach, J.: The agentsheets behavior exchange: supporting social behavior processing. CHI 97 extended abstracts on Human factors in computing systems: looking to the future (1997) Toffetti, G., Comai, S., Preciado, J., Linaje, M.: State-of-the Art and Trends in the Systematic Development of Rich Internet Applications. Journal of Web Engineering 10(1) (2011) Repenning, A.: Programming goes back to school. Commun. ACM 55(5) (2012) Repenning, A., Ambach, J.: Tactile programming: A unified manipulation paradigm supporting program comprehension, composition and sharing. Proceedings of the 1996 IEEE Symposium on Visual Languages (1996) Shneiderman, B.: Direct manipulation for comprehensible, predictable and controllable user interfaces. Proceedings of the 2nd international conference on Intelligent user interfaces (1997) Wills, C., Finkel, D., Gennert, M., Ward, M.: Peer learning in an introductory computer science course. ACM SIGCSE Bulletin 26(1) (March 1994) Ahmadi, N., Jazayeri, M., Landoni, M.: Helping Novice Programmers to Bootstrap in the Cloud: Incorporating Support for Computational Thinking into the Game Design Process. Advanced Learning Technologies, IEEE International Conference on (2012)

Issue Article Vol.30 No.2, April 1998 Article Issue

Issue Article Vol.30 No.2, April 1998 Article Issue Tailorable Groupware Issues, Methods, and Architectures Report of a Workshop held at GROUP'97, Phoenix, AZ, 16th November 1997 Anders Mørch, Oliver Stiemerlieng,