Assignment of Master's Thesis
Total Page:16
File Type:pdf, Size:1020Kb
CZECH TECHNICAL UNIVERSITY IN PRAGUE FACULTY OF INFORMATION TECHNOLOGY ASSIGNMENT OF MASTER’S THESIS Title: Mobile app for Hrave.cz Student: Bc. Ondřej Paška Supervisor: Ing. Ondřej Menčl Study Programme: Informatics Study Branch: Web and Software Engineering Department: Department of Software Engineering Validity: Until the end of summer semester 2016/17 Instructions The web portal Hrave.cz, which belongs to the Educasoft company, aims to prepare high-school students for their state final exams and to prepare them for entrance exams for universities. It includes lectures and many different types of exercises and includes some gamification machanisms. The task is to create a mobile application that replicates most of the functions of the portal. The app will communicate with the existing API server. It is expected to include user login and registration, user progress visualization, lectures, and all types of exercises. The app should be modular and ready to be easily maintained and extended. Design and graphics assets for the UI will be provided by the graphics department of the Educasoft company. 1. Analyze the web application and specify functional and non-functional requirements for a mobile application. 2. Design the mobile application. 3. Choose an implementation platform. 4. Implement the application, test it, and document it. References Will be provided by the supervisor. L.S. Ing. Michal Valenta, Ph.D. prof. Ing. Pavel Tvrdík, CSc. Head of Department Dean Prague January 24, 2016 Czech Technical University in Prague Faculty of Information Technology Department of theoretical computer science Master's thesis Mobile app for Hrave.cz Bc. OndˇrejPaˇska Supervisor: Ing. OndˇrejMenˇcl 9th May 2016 Acknowledgements I would like to thank my family for their support during my studies. Special thanks to Tereza Novick´afor proofreading and correcting this text. Declaration I hereby declare that the presented thesis is my own work and that I have cited all sources of information in accordance with the Guideline for adhering to ethical principles when elaborating an academic final thesis. I acknowledge that my thesis is subject to the rights and obligations stip- ulated by the Act No. 121/2000 Coll., the Copyright Act, as amended, in particular that the Czech Technical University in Prague has the right to con- clude a license agreement on the utilization of this thesis as school work under the provisions of Article 60(1) of the Act. In Prague on 9th May 2016 . Czech Technical University in Prague Faculty of Information Technology c 2016 OndˇrejPaˇska. All rights reserved. This thesis is school work as defined by Copyright Act of the Czech Republic. It has been submitted at Czech Technical University in Prague, Faculty of Information Technology. The thesis is protected by the Copyright Act and its usage without author's permission is prohibited (with exceptions defined by the Copyright Act). Citation of this thesis Paˇska, Ondˇrej. Mobile app for Hrave.cz. Master's thesis. Czech Technical University in Prague, Faculty of Information Technology, 2016. Abstrakt Pˇredmˇetemt´etodiplomov´epr´aceje vytvoˇren´ı mobiln´ı aplikace k existuj´ıc´ı e-learningov´eplatformˇeHrave.cz. Pr´aceobsahuje popis t´etosluˇzby a rozbor podobn´ych ˇreˇsen´ına mobiln´ach platform´ach. Jsou probr´any moˇzn´ecesty mo- biln´ıhov´yvoje. Aplikace je implementov´anapomoc´ımultiplatformn´ıhoframe- worku Adobe AIR pro Android a iOS, otestov´anaa vyd´ana. Kl´ıˇcov´aslova LMS, uˇcen´ı,maturita, e-learning, mobilni aplikace, Android, multiplatformn´ı Abstract The goal of this thesis is to create a mobile application for the existing Hrave.cz e-learning platform. The service is analyzed and similar solutions on mobile platforms are explored. Possible ways of implementing the mobile service are discussed. The application is implemented in the Adobe AIR framework for Android and iOS, tested, and deployed. Keywords LMS, e-learning, students, Android, mobile, multiplatform ix Contents Introduction 1 Motivation and objectives . 1 1 Analysis 3 1.1 Educasoft s.r.o. 3 1.2 Hrave.cz . 3 1.3 Similar Existing Solutions . 8 1.4 Choosing a Platform . 10 1.5 Requirements . 16 2 Design 19 2.1 Domain model . 19 2.2 Use Case Analysis . 20 2.3 Activity Diagrams . 26 2.4 Hrave API . 26 2.5 Wireframes . 29 2.6 UI . 32 3 Implementation 35 3.1 Tools . 35 3.2 Feathers SDK . 36 3.3 RobotLegs . 38 3.4 Package Description . 40 3.5 Offline Mode . 41 3.6 Graphics . 41 3.7 Content Parsing . 44 3.8 Sound . 46 3.9 Localization . 47 3.10 Persistance . 48 3.11 Performance Profiling . 49 xi 3.12 Login Security . 50 4 Testing 51 4.1 TestFairy . 51 4.2 Usability Testing . 52 5 Deployment 57 Conclusion 59 Future Work . 59 Bibliography 61 A Acronyms 67 B Contents of CD 69 C Application Screenshots 71 D User Guide 77 D.1 Installation . 77 D.2 Registration . 77 D.3 Accessing Lessons Offline . 77 xii List of Figures 1.1 Part of Hrave lesson tree . 4 1.2 Hrave Question Types . 6 1.3 Maturita SK on Android . 8 1.4 Maturita Quiz on Android . 9 1.5 Duolingo on Android . 11 1.6 Khan Academy on Android . 12 2.1 Hrave Domain Model . 21 2.2 Login Activity Diagram . 26 2.3 Lesson Activity Diagram . 27 2.4 Wireframes I. 29 2.5 Wireframes II. 30 2.6 Screen Flow . 31 2.7 Header Actions . 33 3.1 Multiple Screen Support . 42 3.2 TextFill question type of phones and tablets . 43 3.3 Hrave SVG Example . 44 3.4 Example of links in a lesson (mobile app) . 45 3.5 Sound Player on Android . 47 3.6 Database Schema . 48 3.7 Adobe Scout . 49 C.1 Application Screenshots I. 72 C.2 Application Screenshots II. 73 C.3 Application Screenshots III. 75 xiii List of Tables 2.1 Use case coverage of functional requirements . 25 xv Introduction Motivation and objectives Utilizing information technology in education is not a new concept. The idea of electronic learning (or e-learning) is thought by many to be a key to ef- fectively spreading knowledge in the 21st century[1]. E-learning commonly complements traditional learning at Czech universities and high schools. In 2010 a standardised test at the end of secondary school (the so-called state maturita) was introduced to Czech schools[2] and more secondary schools and universities started using standardised entrance exams called Scio[3]. There were suddenly two standard exams the majority of students needed to pre- pared for. Hrave is a project aimed at helping students preparing for these exams in a fun and motivational way and has attracted a lot of users since it was launched in 2014. The service is accessed through a web browser and was de- signed with desktop computers in mind. The trend, however, is that more and more people in the Czech Republic access the web through their smartphones and tablets[4]. Furthermore, people prefer to access services through mobile apps, rather than mobile web sites.[5] Althought mobile e-learning systems are common in the US (see section 1.3), there is relatively small competition in the Czech mobile e-learning market. With this in mind, I agreed to work with Educasoft company to tap into this market, by creating a mobile app that enables students to use Hrave e-learning platform on their mobile phones and tablets. In addition to this, Hrave software can be used as a platform for any kind of learning, which forms the core of Educasoft B2B operations. The mobile app should also work within these other domains. In this thesis I will first describe the existing Hrave platform and the way content is created and structured and explore some existing solutions on the mobile market. Then I will present an analysis of the new mobile system and discuss the design. Thirdly I will show how I implemented the application and finally how it was tested and deployed. 1 Chapter 1 Analysis 1.1 Educasoft s.r.o. The company was created in 2014 with the intention of using modern tech- nologies in education. Their first project was Hrave.cz, but today they also extend and support the learning management system (LMS) iTrivio (itrivio.cz) for managing know-how, learning, and training in schools and businesses. 1.2 Hrave.cz Hrave is a Czech online learning tool for students. It now has modules for the final high school exam (maturita), university entrance exams (NSZ - OSP) and entrance exams for eight-year Gymnasiums (gymn´azia).It features: • Professionally prepared lectures • Many types of exercises • Gamification mechanics - experience points (XPs), earning diamonds, practice arena • Leaderboards for competing with friends Some content is provided for free, but to unlock all the lessons, users must purchase a license in the eShop section of the web. Licenses are usually valid for one or two years. Registration is required and is possible through email or with one-click Facebook login. 1.2.1 Architecture Existing system consists of a server application (backend) and a web applic- ation (frontend). Backend is written in Java using Hibernate and Spring 3 1. Analysis Domain Module Section Chapter Lesson 1 Lesson 2 Lesson 3 Lesson 4 Figure 1.1: Part of Hrave lesson tree frameworks and frontend uses HTML, CSS and Javascript with JQuery and Angular frameworks. The communication between frontend and backend hap- pens throught a HTTP API using JSON data format. Hrave itself is a generic e-learning platform, which can be licensed for other uses than student prepar- ation. Hrave.cz is just one domain where it is used. 1.2.2 Lesson Structure Every module is divided into a set of small self-contained lessons.