A Web App to Implement Gamification in the ClassroomProposal to K20David Smith, Adam Smith, and James SmithThe University of OklahomaApril 25, 2016

Executive SummaryEducators, especially those teaching kindergarten through high school, struggle to keep their students engaged. In response to that need, our team of three Computer Science majors from the University of Oklahoma would like to develop a web application for teachers to implement gamification in their classrooms. This application will allow teachers to manage their student’s achievements online and award accomplishments with any one of wide range of digital perks. These perks serve as the extrinsic motivation for students to participate in class. Moreover, our application will be both easy to use out-of-the-box with a set of default perks created in collaboration with educators experienced with gamification and also very customizable with the ability to create completely customizable perks. In addition to perks, users of this application can create economies in which perks can be traded and exchanged for other perks. In the same way as the perks, these economies will have both default and customizable settings. Because this application is targeted toward teachers, we are assuming a minimal level of technical expertise and monetary resource. Therefore, the application will be very intuitive to use, requiring no programming knowledge and minimal instruction. In order to achieve this, we will use an agile development methodology. We will develop the app in cycles, producing a testable prototype every couple weeks. Testing the application with educators, we will see the usability issues early on and ensure that the application is as intuitive as possible. To solve the financial burden on teachers, our application will be free and open source. This not only opens use of our app to anyone willing to use it, but also the open source nature allows anyone to contribute to the code and creation of perks and economies. By encouraging sharing of perks, economies, and feedback among teachers, our application will create a community of educators passionate about engaging their students. They will be able to share ideas both within and without the application, working together to more effectively teach.

Table of ContentsExecutive Summary.........................................................................................2Introduction.....................................................................................................4

Background.............................................................................................................4What is gamification?...........................................................................................4Applications of gamification.................................................................................4

Opportunity.............................................................................................................5Purposes.................................................................................................................. 5Interviews................................................................................................................6

Proposed Program...........................................................................................7Methodology............................................................................................................7Procedure................................................................................................................7Road Map (May - July)..............................................................................................7Feature List v0.1.....................................................................................................7Wire Frames............................................................................................................8

Implementation..................................................................................................10Testing...........................................................................................................11

Automated Testing.............................................................................................11Usability Testing.................................................................................................11Educator Use Cases............................................................................................11Student use cases..............................................................................................13

Budget & Qualifications.................................................................................14Budget................................................................................................................... 14Qualifications........................................................................................................15

References.....................................................................................................16Appendix........................................................................................................17

Introduction There is an epidemic today of disinterest among students. We would like to create a gamification application for teachers to increase engagement in the classroom. We are seeking grant funding to be able to see this application to creation. With our

funding, we would hire designers to collaborate with us on the design. We want to involve educators who use gamification so we can address their needs.

BackgroundWhat is gamification?Gamification is the application of turning undesirable activities into games. Because games are inherently entertaining, people will want to do them. We can therefore use gamification to get people to do things that they would otherwise not want to do. The most obvious example is in schools. Never has there been a majority of students that have enjoyed school. Gamification, however, allows us to turn that majority into a minority, by incentivizing students to do schoolwork under the semblance of a game.

Because games involve willful interaction, they encourage future interaction. Gamification cannot be a long-term solution. At some point, people just have to be professional and do what needs to be done. But starting this process can be very difficult. Gamification helps us ease people into this process by allowing people to do it under a more harmless setting. In essence, gamification is a tutorial that eases people into various settings. Over time, gamification elements can be stripped away as people learn to do the corresponding activity without thinking much about it. In the best scenarios, people retain the joy of doing the activity without any gamification elements.

Applications of gamificationThe ability of video games to captivate the attention of its audience has been noticed and used in a variety of fields. The attempt to emulate this retentiveness of users results in gamification - “enriching products, services, and information systems with game-design elements in order to positively influence motivation, productivity, and behavior of users” (Blohm and Leimeister 203, p. 1). Most notably in recent years, fitness apps like FitBit track steps and create competitions between friends. These programs award virtual awards or trophies when one reaches certain goals. Not only are these approaches innovative, but also extremely effective. NikeFuel “made two million users burn more than 68 bn. calories” (Blohm and Leimeister 203, p. 1). However, the effectiveness of gamification is not limited to fitness app. It has great potential and indeed has already shown its value in educational environments. Richard Landers, a professor at Old Dominion University used a gamification system called GradeCraft in his classroom and found that “across those approximately 400 students, 113 (28%!) willingly chose to take optional multiple choice quizzes” (Landers 2010). Gamification is an effective way to keep students engaged in the material. It is important to note that gamification describes adding a game-like structure around the existing elements of the classroom, as opposed to moving all the teaching into a game, or Game-based learning.

OpportunityAlthough gamification is not a new idea, it is a recent development in education. The youth has grown up with iPhone apps and games that are riddled with gamification. We would be speaking to motivation that they act on outside of class. A Gallup poll from 2015 shows student engagement in school dropping (Brenneman 2016). Only 32% of eleventh graders were engaged in the classroom. Keeping students interested has always been a goal of educators. In the modern world of constant stimulus from omnipresent technological devices, attention grows more difficult to attain. There is a need - now more than ever - for new tools to keep students interested in school. Engaging them with a world that gives them the possibility to expand and learn more encourages those actions. These assignments become more than a task that gives them a grade. We want to use this opportunity to form them into learners and feed their curiosity. Gamification tools work, but existing ones are difficult to use/too expensive. Education technology companies are jumping on this opportunity as an economical gain. Our success and value lies in these students having new ways to engage in the classroom. Our priority is getting a suitable platform in more teachers hands.

Purposes Create greater access to gamification platforms

Many people can benefit from gamification and we want to increase that benefit

Reduce the barrier to entry into gamification platformsCurrent gamification platforms can be difficult to get into. We want to decrease that difficulty.

Relieve pressure and time on educatorsCurrent educators spend a lot of time encouraging educational interest in youth. If they suddenly do not need to spend as much doing this, they are free to do other important things.

Promote long-term educational achievement in youthThis particular project will be designed for educators. We hope that our gamification platforms will help youth develop self-interest in education, achieving much far after they have stopped using the gamification platform

InterviewsWe interviewed Scott Hasselwood (@TeachFromHere - https://twitter.com/TeachFromHere). He is a math teacher who uses gamification in his classroom. He is a Phd. student at Oklahoma State University. Scott started by

building his own gamification setup through using google forms and sheets. This worked for a simple solution yet there was low automation and a large amount of upkeep. Google allowed him to have a free solution that did what he needed. His second solution was to use rezzly. This had quest and did some more automation for handing out achievements/badges. Rezzly did not however handle the economy. An underlying issue we realized that these gamification websites are lacking in design and organization. There were upsides to rezzly. We talked about how his high school students received the gamification change. Our discussion lead to good examples of gamification.

We talked with Keegan Long-Wheeler (@KeeganSLW). He is an Ed Technologist at OU CTE. Goblin is a gamification project he has been working on for a long time. It is used in a course he and others teach to educators on gamification. Yes, Goblin uses gamification to teach gamification. He showed us the incredible results he received from his character development system he had built. Keegan offered insights into how we could improve our platform. Taking the correct road to having a success open source platform is an area Keegan was able to help us with as goblin is open sourced.

Our gamification platform will create an extrinsic motivation source for students. The immediate reward system inherent to gamification reshapes students’ perspectives about school work. Dr. Patrick O'Connor, a professor at Chicago School of Professional Psychology, implemented gamification courses. His gamification was based on a website he built on top of his blackboard classroom. He gave students xp for participating and doing homework. They participated in a game that he created. Although he asserted that course included the heaviest workload, a survey of his students revealed that they felt the coursework had been light. Analyzing this effect, he believed that due to ownership, and self motivation, the students did not categorize the incremental approach as work. Students built up to larger assignments instead of being assigned a five page essay.

Proposed ProgramMethodologyOur software development methodology will be what software developers call Agile. Typically, development is very linear where there is well-defined stage of design, implementation, and testing. In agile development, however, these steps are sped through to allow multiple iterations of this cycle. This allows the stages of this cycle of the development to be reached several stages. For the first stage, this means adaptive planning.

In a single, long development iteration, changes will be difficult because resources have been devoted to a long-term, static design. This is slightly corrected in the

testing phase, but, for the most part, the majority of design does not change. However, in agile development, no long-term resources are devoted to anything and so it is easy to make slight changes without disrupting the entire system.

Procedure Road Map (May - July)

1. Review & Decide on MVP - 3 day2. Prioritize Features - 1 day3. Begin Initial Hosting, Server, Environment Setup - 2 day4. Develop UI and UX with Design Team - 1 and half weeks5. Launch Planning 6. Development - 2 months7. Release - End of July

Feature List v0.11. Classroom Creation

a. A teacher can upload an document included their roster with the student names. Alternatively, they can manually enter each student in the class.

b. A teacher can specify the class’s grade and name. 2. Perk Creation

a. Default packages available during on boarding. b. A teacher can create perks which have a name, cost, description, and

custom fields for advanced authoring. 3. Economy Creation

a. Default packages available during on boarding. b. A teacher can map out a set of point values to tasks, assignments,

extra credit, and more.4. Tasks/Assignment Creation

a. A teacher can create a entry which will have a name and category in the economy.

b. After creation, a teacher can assign the grades or completion for each student in her roster.

5. Roster Managementa. A teacher can view the following on her roster:

i. All of the students in the classii. Levels, XP gained of the students

6. Simple Student Portala. A student can see their profile which has their name, avatar, level,

xp/point accumulated, and perks purchased.

Wire Frames

Classes Overview:

Perk Creation:

On Boarding Process:

ImplementationThe implementation of our web application will be an open sourced library of ReactJS components that builds on top of either a basic web application or an open source content management system. Content Management Systems such as PageKit or Drupal could be used to create the structures of courses, class rosters, perks, avatars and more. Our gamification would sit on top of this platform and function as a plugin for gamification add-ons.

Our second option would be to create a completely separate web application using React router, ReactJS, webpack, post-css to build the web application. With this solution, we would use react native to build the mobile version of our platform. Business logic would be shared between the two libraries but the user interface would be separate.

Prototyping with PageKit is taking place right now using the hosting services of Create OU. Create OU allows students and faculty to host various systems on their subdomains. Rough wireframe samples can found later in this document. Our prototyping will be to see what will be the most efficient and lasting solution.

TestingAutomated TestingUse unit testing to simulate every unique way the code can run and find errors in logic. This will allow us to repair coding issues before presenting the application to a user. Therefore, we can focus on design issues in the usability tests.

Usability TestingWe will schedule testing days at the K20 center. Our team will coordinate with local secondary schools to have random sets of teachers participate in our usability tests. To connect with these schools, we will use our contacts to meet with administration to feel out the interest. These teachers have the ability to opt not to participate in our offer. Our incentive will be a training session afterwards that they can partake in to gain professional development hours with their schools.

● Testing Setup○ Three Sessions ○ Ten Educators per Session○ Hour of testing at K20 Center○ Facilitated by a proctor ○ Pre & Post Interviews

Educator Use Cases

Name Create a class

Description User creates a class on our web application to manage a class that he or she is teaching

Actions 1. User opens the application.2. User logs in to the site as an educator.3. User selects “Create new class” option.4. User adds a class title and optionally a

description.5. User selects “Create class” button.

Special Requirements

This action is only applicable to users who have educator accounts. Students may not create classes.

Post-Condition A new class with the specified name and description are added to this user's account

Name Add a section to a class

Description User creates a specific instance of a class that they teach. These can be different time slots of the same class or the same class offered during different semester.

Pre-condition The user has created at least one class

Actions 1. User opens the application.2. User logs in to the site as an educator.

3. User chooses a class from his or her list of classes.

4. User selects “Add section to class” option5. User inputs the dates that the section is offered

and the meeting times.6. Optionally, the user will add a nickname for this

section.7. Optionally, the user will add the roster of

students by email.

Special Requirements

This action is only applicable to users who have educator accounts. Students may not add sections.

Post-Condition A new section with the specified date and meeting and possibly nickname and roster is added to this user’s class.If a roster was added, invitations to join the class will be sent to the emails of the students on the roster.

Name Modify section roster

Description User creates a specific instance of a class that they teach. These can be different time slots of the same class or the same class offered during different semester.

Pre-condition The user has created at least one class

Actions 1. User opens the application.2. User logs in to the site as an educator.3. User chooses a class from his or her list of

classes.4. User selects “Add section to class” option5. User inputs the dates that the section is offered

and the meeting times.6. Optionally, the user will add a nickname for this

section.7. Optionally, the user will add the roster of

students with emails. This can be done by manual entry or file upload (csv, json, etc).

Special Requirements

This action is only applicable to users who have educator accounts. Students may not add sections.

Post-Condition A new section with the specified date and meeting and possibly nickname and roster is added to this user’s class.If a roster was added, invitations to join the class will

be sent to the emails of the students on the roster.

Name Create perk

Description User adds a perk to his or her account that can be added to any of this user's sections or optionally shared for any educators to use.

Actions 1. User opens the application.2. User logs in to the site as an educator.3. User selects “Create perk” option4. User specifies the name of the perk.5. Optionally, the user adds a image/badge for this

perk.6. Optionally, the user adds a description.

Special Requirements

This action is only applicable to users who have educator accounts. Students may not add sections.

Post-Condition A new perk is created and added to this user’s account for use in any of their classes.

Student use cases

Name Join section

Description The student joins the section of his or her class by an invite from the professor

Pre-Condition Student has been added to the roster of the section and an email invite has been sent

Actions 1. User starts email application.2. User opens email invite from this web

application.3. User clicks the link in the email to join the

section.4. The user logins to the web application if he or

she has an account.5. Otherwise, the user creates an account for the

web application.6. User views the section.

Post-Condition This student joins the section and is able to access the section info.

Budget & Qualifications

Budget

Expenses

Salaries DescriptionQuantity (Hrs) Cost Total

Software Developers - 3 Backend, Frontend, Mobile 960 32 $30,720Designer - 1 Create UI and UX 320 30 $9,600Education Consultant - 1 Consultant fee (hourly or flat) 200 20 $4,000Two monthsSub - total Salaries $43,040

Supplies Description Quantity Cost TotalTechnology & Software 1 1000 $1,000Sub-total Supplies $1,000

Indirect Costs Description Quantity Cost TotalOffice Space renting out an office 1 3500 $3,500Online Hosting 1 75 $75Office Furniture 1 400 $400

$0$0

Sub-total Events $3,975

Total Expense $49295

There are three software developers on the team. During this time, each developer will be paid an hourly salary of $32, or about $66,000/year. Over the two months of this project, a little over eight weeks, the three software developers will put in 960 hours of work. Each developer will work 40 hours a week for eight weeks, a total of 320 hours. That amounts to $10,240 per developer.

We will hire a designer to optimize the user experience of our web app. A professional web designer will ensure that our app is as usable as possible. The web developer will be paid an hourly salary of $30. Working full time for eight weeks, the developer will put in 320 hours and be paid a total of $9,600.

The education consultant will work in conjunction with us to create content for a web app. We will contract a teacher who uses gamification and understands the best ways to implement it. This information will allow us to create default perks for different education levels. In this way, our app will be functional for new user immediately, instead of requiring creation of his or her own perks.

Qualifications

Our team consists of Computer Science majors at the University of Oklahoma. Our degree has required us to take courses that prepare us for creating sustainable programming projects. We have studied multiprogramming in our Operating Systems course, where we learned to use the many processors found in modern computers to increase computer efficiency. These skills will be especially necessary as we expand our project and prepare to handle possibly thousands of requests instantly from people around the country. We built on these skills in Data Structures and are able to use various data structure to create fast and space-efficient programs. Through our course work, we have experience with Java, C, C++, Python, and Scheme. Most of these language are high-leveled, or far away from the computer detail, and therefore designed to handle highly abstract projects like those dealing with user interfaces.

We have also studied interfaces more closely in our Human Computer Interaction course. We have studied many elements and tools found in good user interfaces. We have also completed many projects and built our own user interfaces. We have completed all of these projects using different UI toolkits and thus have a lot of flexibility and power in regard to the types of UIs we are able to create.

David Smith’s fiance is currently student teaching and using gamification. She has given us insight into how gamification in her classroom works and what she needs. We will be able to run a pilot project in her classroom. David Smith works currently for an educational technology company here in Norman, NextThought. He is on the web development team. With this experience, he has worked on creating an online classroom platform used by universities all across the state. At NextThought, he has worked on the web application and an internal tool. He first built an internal content management system (CMS) using Plone, an Open Source CMS. With this internal tool, content authors were able to build out the structure of courses to go on to NextThought's platform.

This team member has also attended 5 Edcamps. Edcamps are unconference style professional development for educators. At the event, attendees go to various sessions on topics they choose. This gives our team not only connections to educators within Oklahoma but also experience in hearing how educators use technology in the classroom. This team member has connections with the State Superintendent of Public Instruction, countless education administrators, and other

educators across the state. This provides a pool for testers, a group of people for getting their input and feedback and much more.

One of our other members, Adam Smith, has some experience with teaching. He regularly helps and tutors his friends. He also has previously worked on project where he was asked to interview specifics teachers and write a article on his findings in online magazine. He can use these skills to help design a more teaching-friendly project.

Referenceshttp://www.edweek.org/ew/articles/2016/03/23/gallup-student-poll-finds-engagement-in-school.html

Appendix1) Interview Transcript - Skype - Scott Haselwood

● First Solution - Google○ Google Forms○ Google Spreadsheet ○ Points

■ HMWK 1 Points■ Youtube Video 3 Points

○ 1 hour week tops○ Shortened url (Google Shortened)○ Webaddress easy to enter○ Phone, iPad, Computer (Students Use)○ Problem

■ Asked, Buy Perks (Struggled) ● Second Solution - Rezzly

○ 1 year - Dr. Stansberry○ Rezzly.com ○ Paysite, Some Free Stuff○ Kid Account, create accounts○ Quests

■ Requirements■ Points■ Average Time

■ Rating■ When its due■ Category■ Sharable

○ Copy Back and Forth Between Educators● High school Student

○ Freedom over how they chose to learn○ Figured out the economy system○ Give economy to buy a perk ○ No economy○ Disabled scheduling ○ Controlled Behavior○ Organize the classroom

● Resources○ Class craft ○ Class dojo