163Development of Mobile Learning.....(Herru Darmadi; Suryadiputra Liawatimena) DEVELOPMENT OF MOBILE LEARNING IN FACULTY OF ECONOMICS, BINA NUSANTARA UNIVERSITY Herru Darmadi1 and Suryadiputra Liawatimena2 1Computer Science Department, School of Computer Science, Bina Nusantara University 2Computer Engineering Department, Faculty of Engineering, Bina Nusantara University Jln. K.H. Syahdan No. 9, Jakarta Barat 11480, Indonesia 1herru@binus.ac.id; 2suryadi@binus.edu Received: 15th August 2017/ Revised: 29th August 2017/ Accepted: 14th September 2017 Abstract - The research aimed to find the workflow and solution by developing m-learning object for Android and iOS-based smartphone and tablet that supported interactive multimedia. The research began with analysis, design, implementation, and evaluation. Currently, the learning objects were not compatible with mobile devices. To overcome this problem, the research focused on designing the instructional design for m-learning and the development of interactive multimedia. Instructional design was created by a collaboration of the subject matter expert and instructional designer. M-learning was designed using UML and developed using Adobe AIR technology. The implementation of this research was a prototype of m-learning for concept of cost in Faculty of Economics, Bina Nusantara University. Then, the evaluation was conducted by distributing m-learning object to 32 selected students by simple random sampling in their first week of lectures in February 2014. The observation was conducted during m-learning object installation and initial learning process. At the end of the second week of the experiment, summative assessment and questionnaire were given to students. The results show that m-learning object is compatible with mobile devices. The students also say that m-learning is easy to use and helpful for their learning. Keywords: learning object, m-learning, interactive multimedia I. INTRODUCTION Along with the development of information technology in various fields, the education sector has also been intensively using information technology to help teaching and learning materials development. Due to the rapid development of information technology, learning or teaching materials can be designed in a variety of mediums. One of them is a computer which is often called as e-learning (Yan, Mao, & Ruan, 2010). E-learning is one of the leading technologies in Bina Nusantara University to improve its learning quality. The main component in e-learning is a learning content. Currently, learning contents that have been developed are interactive multimedia that is incompatible with the mobile devices and only works on a desktop computer. In line with the development of the technology of computer hardware, computer is not only in the form of a static desktop that was in one place, but it is more compact with connected mobile and Internet. From this fact, e-learning has also been transforming into mobile learning as well or referred as m-learning. One of the main components in e-learning is learning content or learning object (Richards, McGreal, & Friesen, 2002). A learning object is generally in the form of interactive multimedia designed by pedagogical values. It aims to gain attention, retention, and increasing the knowledge for the students. Bina Nusantara University as a higher education institution has a standard in quality learning content. One of the standards is the application of learning object as a supporting material for the entire course. In the early 2000s, m-learning technology used devices such as MP3 players, PDAs, and cell phones. However, at that time the mentioned devices have many limitations in running interactive multimedia content- based. From the survey and analysis of current mobile learning applications and technology, Pereira and Rodrigues (2013) found that the current mobile devices provided a direct and new philosophy for teaching and learning methodologies since it could have rich, fast, dynamic, and robust applications. Besides the size, its processing features, connectivity, screen resolution, and battery life are offered. The growth of smartphones and tablets based on Android OS and iOS operating system have up to date interactive multimedia features. Thus, the limitation of m-learning is solved. The simplicity to use the mobile devices in everywhere has a big role in facilitating the access of information and learning process. Hoober and Berkman (2012) described the characteristics of the mobile device. First, it was small so that it could be put into the pocket. Second, it could be easily carried everywhere and use batteries. Third, it was connected to other devices wirelessly. Fourth, it was interactive. Last, mobile devices have contextual capabilities based on its location and communication network. The advancement of this technology has given users a chance to learn through electronic devices such as PDAs, mobile phones, laptops, and tablets, where the type of learning can be called by mobile learning or m-learning (Peters, 2009). According to Traxler (2009), the use of mobile devices is improved continuously and applied in various ways in education field. According to Pereira and Rodrigues (2013), Android is a mobile operating system developed by Google and the Open Handset Alliance. It is based on the Linux kernel, and it is available under open source license. Moreover, it is built by using Java programming language and provides software development kit for developers to build new applications on top of it. All Android application can use all of the device 164 ComTech, Vol. 8 No. 3 September 2017, 163-170 functions such as camera, multimedia, and accelerometer features. Meanwhile, iOS is a mobile operating system developed by Apple Inc. It is used as the default operating system in iPad, iPhone, and iPod devices. Apple has developed iOS as proprietary operating system. The iOS also provides software development kit. It allows the developers to create applications using Objective-C programming language. Moreover, Adobe AIR is an application runtime developed by Adobe that enables developers to package and publish the Adobe Flash Documents into native applications for multiple operating systems. These operating systems spans from desktop operating systems such as Microsoft Windows and Mac OS to mobile operating systems such as iOS and Android (Adobe Systems Incorporated, 2014). According to Pereira and Rodrigues (2013), mobile applications are commonly called as mobile apps. These terms are used to describe a software that is designed, developed, and packaged to be run on mobile devices. They are intended to enhance features of mobile devices by providing additional functionalities and utilities. Georgieva and Georgiev (2007) divided m-learning into three main groups. First, off-line m-learning was when the mobile device memory especially developed learning content, or stand-alone application was loaded. There was no need of a permanent wireless connection to Mobile Learning System (MLS). Second, there was online m-learning. The learner had to use a permanent wireless connection to the system. Third, m-learning where both online and offline m-learnings were used. The access to one part of learning materials was online while the access to the remaining materials was off-line. Moreover, the main characteristics of mobile devices which influence the learning content for off- line m-learning object are screen resolution from the small ones of the cellphones to the large ones of laptops; screen mode in portrait or landscape; supported markup and script languages, and supported multimedia file formats. Filho and Barbosa (2013) organized several characteristics and criteria of the m-learning environment. Related to multimedia, the m-learning object should support different types of media (such as text, audio, video, and augmented reality) with high quality. Then, the media used must be synchronized (spatial/temporal) leading to an adequate orientation of video, audio, images, and text. The interface is one of the strong points for software acceptance by the clients. In the context of learning environments especially for mobile devices, the interface should be easy to learn, and easy to be recognized and remembered by the users. In addition, it should be simple and easy to operate (affordance). Mobile learning environments must also be able to automatically detect all information connected to the context of the users and tutors. Ayman (2012) argued that m-learning was the next step of distance learning. The research showed a high acceptance level of students for mobile learning. Moreover, the development and research of learning applications for mobile learning has been applied in various fields of education such as mathematics learning process in South Africa (Roberts & Vänskä, 2011), English learning process for tourism in Taiwan (Hsu & Lee, 2011), and learning process and practice test in health in England (Taylor et al., 2010). Pereira and Rodrigues (2013) gave the result to improve m-learning mechanisms. Tablets overcame the performance at different levels compared with previously used mobile devices. First, it offered a larger screen size and resolution so it provided much more organized information. This enabled the construction of custom mobile client applications for teaching and learning with friendly, rich, and dynamic small-screen interface design. Second, with faster CPU and more memory, applications could handle and use newer technologies. Third, the battery of these devices could handle more than 12 hours using highly demanding CPU applications. Fourth, it was equipped with several connectivity technologies such as Wi-Fi, 3G, GPS, and Bluetooth. The purpose of this research is to develop a mobile learning object that is compatible with Android and iOS- based mobile devices using the technology of Adobe AIR (Adobe Systems Incorporated, 2014). Learning content that has been created can be distributed through Binusmaya Learning Management System (LMS). The outcomes from this research are the workflow, design, and example of m-learning product. The workflow and design model can be used as the guidance for the developers of m-learning object. The m-learning object will be a new channel that supports learning process in Bina Nusantara University. II. METHODS Research methodology is the steps of research that must be set before the implementation, so that the research can be done correctly, clearly, and efficiently. The steps taken are analysis, design, development, implementation, and evaluation. Analysis phase covers literature study about related research, interface design, instructional design, and theories related to learning materials. This step also analyzes the completeness of material and the current condition of multimedia learning process in Bina Nusantara University. Then, the result of analysis process is implemented based on curriculum in Faculty of Economics and consultation with the lecturers of Management department (Subject Matter Expert). In this research, the researchers selects learning material for Managerial Accounting subject that explains a concept of cost. Before creating m-learning materials, the researchers discuss with the Subject Matter Expert and conduct literature review that includes several books of managerial accounting. The analysis finds that students need to do practice to understand a concept of cost not only by reading the explanation. Therefore, in this m-learning, the material explanation will be explained by assessment. Graphical user interface of the mobile application is designed to apply some of the layout guidelines (Hoober & Berkman, 2012). It should avoid the use of banners, pictures, and graphics that do not have specific uses, use the navigation elements consistently and simple. Moreover, long sentence is more difficult to read. The maximum of length is between 60-65 characters. In design phase, the researchers will design mobile applications for learning materials that have been chosen in accordance with the theory and instructional design. The mobile application will be designed to support the learning process and have a good interface design. The result of this phase is a storyboard and software diagrams that can be used by mobile programmer to develop the mobile application. The application flow of m-learning object is designed using Unified Modeling Language 2.5 (Object Management Group, 2015). The flow of object outline can be seen in use case diagram in Figure 1. According to the use case diagram, there are five uses. The user (student) can start using the application, conduct learning interaction, conduct exercise, play the interactive animation, and exit the application. 165Development of Mobile Learning.....(Herru Darmadi; Suryadiputra Liawatimena) Figure 1 Use Case Diagram of M-Learning The play animation use case is designed to include start application and learning interaction use cases. It means that the play animation use case is a sub use case for this two-other use case. During the interaction and the application starts, the application will display play animation use case. According to Fakhroutdinov (2012), the use case include depends on the addition of the included use case, which is required and not optional. It means that use case include is not complete by itself so that it will refer to the use case include as the abstract use case. Moreover, the working exercise use case is an extended relationship from the learning use case. Extension point for this relationship is when the students navigate the assessment. Fakhroutdinov (2012) mentioned that extended use case was meaningful by itself. It was independent of the extended use case. Assessment features (working exercise use case) in this learning materials use the learning strategy of simple guided discovery (Clark et al., 2010). This application shows short instruction before showing the exercise. Students will be given three chances to answer each question correctly. If it exceeds the chances, the application will show the correct answer. Then, the students can move on to the next question until the assessment is finished. The outline of this assessment flow can be seen in activity diagram in Figure 2. The mobile application will be developed in accordance with the design that has been produced in the design phase. The application will have the elements of multimedia text, image, sound, and animation. The result of the development phase is a teaching tool application which is called m-learning object. M-learning is developed by using Adobe Flash Professional CS6. The purpose of this software is to ease the development of mobile application using existing interactive multimedia pipeline. Most of the interactive multimedia developers are already familiar with the Adobe Flash Professional CS6 development environment. Furthermore, the document type for this application is AIR 3.2 for Android with the screen size of 800 pixels in width and 480 pixels in height. M-learning will be launched and played in landscape orientation. For iOS platform, the developer must change the document type to AIR 3.2 for iOS and add additional information for publishing in iOS platform which is Apple developer certificate (Stallons, 2011). There is some new Application Programming Interface (API) for interaction in AIR for Android such as touch tap, touch drag, swipe, and long press. For the ease of implementation, the developer creates utility package that exposes these APIs. The utility package contains several classes that are grouped according to its methods (Figure 3). Fakhroutdinov (2012) stated that utility stereotype was the class that had only scoped static attributes class and operation/methods. Therefore, utility class usually had no instances. Figure 2 Exercise Activity Diagram in M-Learning 166 ComTech, Vol. 8 No. 3 September 2017, 163-170 Figure 3 Class Diagram of Utility Package in M-learning Then, interaction utility class has several methods that manage the event registration and callback delegation for each interaction element, and the event cancellation. Meanwhile, the document class has static methods that manage the loading and unloading external Adobe Flash SWF document and clearing element container. Similarly, AV class which stands for Audio Video has several methods for managing video and audio element playback. In the implementation phase, m-learning object will be installed in students’ smartphone. Students can use the m-learning object to learn the subject. After implementation, evaluation is conducted to decide whether the application is in accordance with the research purpose. The evaluation is conducted using three instruments. The first one uses observation during the m-learning object installation and run-time. The second one is by using summative assessment, and the third one uses questionnaires regarding the ease of use in the m-learning object. III. RESULTS AND DISCUSSIONS M-learning consists of three main components. Those are the main container which covers all the stage content, the control buttons on the top right of the stage, and the content navigation buttons on the bottom left of the stage. The main container is an element that loads and displays each of the learning content including the assessment. Each of the learning content is created separately into independent Adobe Flash SWF document. This technique helps the users to reduce the memory usage when playing the content in mobile application. It only loads the current content and immediately unloads it when another content is loaded. Home screen contains the subject title and the code of the course (Figure 4b). The storyboard shown in Figure 4a directs the use of graphics and animation in the display. Decorative graphics such as calculator, labels, notebooks, and pen are used to support the context of the learning content in this scene. This display is animated for three seconds. Then, the scene is navigated automatically to the opening display. Moreover, m-learning control buttons on the top right of the stage consist of three buttons. There are toggle audio on/off button, home button, and quit application button. Meanwhile, navigation button consists of next and previous button. Navigation buttons can be manipulated in each learning content. For example, in the opening scene (Figure 5b), the next navigation button is disabled in 3 seconds. Then, it is enabled afterward, so that the users can navigate the next scene. Opening scene contains a situation in a food market where a character is thinking about opening a food stall (Figure 5b). According to the storyboard in Figure 5a, this scene is animated for three seconds. The first animation is the character moving from the left then appears fully on the screen. The second animation is the text bubble. Then, the third animation is the navigation buttons enabled and animated. From the instructional design perspective, this scene is designed to gain the attention from the users and give the context of the content. The content scene contains theories about production cost components (Figure 6b). According to the storyboard in Figure 6a, this scene has interactive animations in the buttons. Each button is a representation of production cost component, and it has its definition. Users must conduct touch tap interaction on each of the buttons to reveal the related definitions. From the instructional design perspective, this scene is to give scaffolding process that adds more details and information over the period of time. Moreover, the exercise is divided into three questions. The questions are related to direct material, direct labor, and factory overhead. The storyboard in Figure 7a is the first question. Meanwhile, the layout and interaction method for two other question are the same. This scene starts with 167Development of Mobile Learning.....(Herru Darmadi; Suryadiputra Liawatimena) (a) (b) Figure 4 Home Display in M-Learning (a) (b) Figure 5 Opening Scene in M-Learning (a) (b) Figure 6 Content Scene in M-Learning the animated instruction to complete the exercise (Figure 7b). The instruction dialog contains question-related to the production cost components. The users can start the exercise by closing the instruction dialog. In the exercise (Figure 8), the left side contains a list of answers that the user can drag. The users can also do a long press interaction for the answer. Thus, the answer will automatically move to the blank answer container. In addition, the right side contains the answers container that the users can drop the answer into it. Users can also reset their answer by touch tap interaction on the reset button or drag the answer from the answer container. Then, users can check their answer by doing touch tap interaction to the check button. Figure 9 shows the result of the exercise. Few answers on the right side are incorrect and the application shows the correct answers on the left side with a checkmark. According to the storyboard design in Figure 7a, the user will be given two chances on each question. If it is exceeded, the m-learning object will show the correction. After all the questions in exercise are answered, the scene shows the conclusion and references. There are four other scenes after the assessment scene. They are learning objective scene, cost of goods sold scene, profit and lost report scene, and reference scene. Each scene contains contents of animation and learning related to the content. 168 ComTech, Vol. 8 No. 3 September 2017, 163-170 The evaluation of the m-learning object is conducted by using experiment in the first and second week of lectures in February of 2014. The m-learning object is implemented to 32 respondents who are the fourth semester students, in Faculty of Economics, in Bina Nusantara University. They are selected by simple random sampling (Kothari, 2004). The students are gathered in a classroom and given a brief about the experiment. Majority of the operating system (a) (b) Figure 7 Exercise in M-Learning Figure 8 Exercise in M-Learning Object Figure 9 Result of the Exercise in M-Learning in their smartphone and tablet is the latest Android 4 (Figure 10). They are asked to download and install Android APK of the m-learning object from Binusmaya LMS. Moreover, iOS version of the m-learning object is not used during the experiment period because the app is still under review process by the Apple Store. The installation process is run successfully without problem, and m-learning operates normally during the experiment. 169Development of Mobile Learning.....(Herru Darmadi; Suryadiputra Liawatimena) After one week of using m-learning, the respondents are given a paper containing questions about the training materials of the concept of cost. The assessment result shows that most of the respondents obtain the score above 80 and the perfect score is 100 (Figure 11). The result shows that learning using the combination of explanation and practice in m-learning object can help students to gain a better understanding of the subject. The evaluation about the ease of application usage is conducted in the form of the questionnaire. Based on the result in Figure 12, it appears that most of the respondents agree that m-learning object is easy to use and helpful for respondents to understand the concept of cost better. Moreover, this questionnaire is used to evaluate the instructional design of the m-learning object. From the result, it can be concluded that the instructional design meets the learning requirement. IV. CONCLUSIONS This research presents the process of mobile learning development workflow. This workflow starts from the requirement analysis, instructional design, system design, software engineering, implementation, and evaluation. The research purpose is to present a workflow model that can be used as the guidance for the developers of mobile learning applications, and those who evaluate this system. Based on the evaluation results, it can be concluded that m-learning object is compatible with mobile devices. In the experiment, iOS is not tested because it is still under review process by the Apple Store. M-learning object helps students to understand the material provided in the learning process because of the guided discovery method. The results of the questionnaire also show that m-learning object is user-friendly and useful to help the understanding of learning materials. It is because students can access the learning material on their smartphone. Figure 10 Result of Smartphone Operating System Figure 11 Result of Assessment Score Figure 12 Evaluation of Ease of Use 170 ComTech, Vol. 8 No. 3 September 2017, 163-170 The high penetration of mobile devices with the latest technologies of mobile operating system that enables the rich interactive multimedia causes a new world of opportunity emerged. Such hardware provides high- resolution screen sizes, rich and dynamic user interfaces, powerful CPU, and long battery life. This is alongside with the ease of implementation of interactive multimedia development pipeline using Adobe AIR. Thus, it can be said that the development of mobile learning application is very promising by providing the students with technology that can have the further learning process. In the next research, the researchers can determine whether m-learning can support learning process in other subjects such as language and art. Moreover, they can research the effectiveness of m-learning implemented in the technology such as virtual reality or augmented reality, and improve the amount of respondents and learning session on their research. REFERENCES Adobe Systems Incorporated. (2014). Adobe AIR | Deploy application across platforms and devices. Retrieved March 20th, 2014 from http://www.adobe.com/ products/air.html Ayman, B. N. (2012). Students acceptance of mobile learning for higher education in Saudi Arabia. American Academic & Scholarly Research Journal, 4(2), 1-6. Clark, R., Yates, K., Early, S., Moulton, K., Silber, K., & Foshay, R. (2010). An analysis of the failure of electronic media and discovery-based learning. In K. H. Silber & W. R. Foshay (Eds.), Handbook of improving performance in the workplace, volume 1, instructional design and training delivery (pp. 263- 297). Somerset: Wiley. Fakhroutdinov, K. (2012). UML use case include relationship. Retrieved March 14th, 2014 from http:// www.uml-diagrams.org/use-case-include.html Filho, N., & Barbosa, E. (2013). A requirements catalog for mobile learning environments. In Proceedings of the 28th Annual ACM Symposium on Applied Computing (pp. 1266-1271). Coimbra: ACM. Georgieva, E., & Georgiev, T. (2007). Methodology for mobile devices characteristics recognition. In Proceedings of the 2007 International Conference on Computer Systems and Technologies (pp. 71:1- 71:6). New York: ACM. Hoober, S., & Berkman, E. (2012). Designing mobile interfaces. Canada: O’Reilly Media, Inc. Hsu, L., & Lee, S. N. (2011). Learning tourism English on mobile phones: How does it work? Journal of Hospitality, Leisure, Sports and Tourism Education, 10(2), 85-94 Kothari, C. (2004). Research methodology methods and techniques (second revised edition). New Delhi: New Age. Object Management Group. (2015). Documents associated with Unified Modeling Language® (UML®) version 2.5. Retrieved March 14th, 2014 from http://www. omg.org/spec/UML/2.5/PDF Pereira, O. R., & Rodrigues, J. J. (2013). Survey and analysis of current mobile learning applications and technologies. ACM Computing Surveys (CSUR), 46(2), 27. Peters, K. (2009). M-learning: Positioning educators for a mobile, connected future. In M. Ally (Ed.), Mobile learning: Transforming the delivery of education and training (pp. 113-134). Edmonton: Athabasca University Press. Richards, G., McGreal, R., & Friesen, N. (2002). Learning object repository technologies for telelearning: The evolution of POOL and CanCore. In Proceedings of the IS2002, Informing Science+ IT Education Conference (pp. 1333-1341). Cork: Informing Science Institute. Roberts, N., & Vänskä, R. (2011). Challenging assumptions: Mobile learning for mathematics project in South Africa. Distance Education, 32(2), 243-259. Stallons, J. (2011). Packaging application for Apple iOS devices | Adobe Developer Connection. Retrieved March 22nd, 2014 from http://www.adobe.com/ devnet/air/articles/packaging-air-apps-ios.html Taylor, J. D., Dearnley, C. A., Laxton, J. C., Coates, C. A., T, T., Campbell, R., & Hall, I. (2010). Developing a mobile learning solution for health and social care practice. Distance Education, 31(2), 175-192. Traxler, J. (2009). Current state of mobile learning. In M. Ally (Ed.), Mobile learning: Transforming the delivery of education and training. Edmonton: Athabasca University Press. Yan, B., Mao, S., & Ruan, L. (2010). Research on e-learning and its related issues. In Proceedings of the 3rd IEEE International Conference on Computer Science and Information Technology (ICCSIT 10) (pp. 331-334). Chengdu: IEEE.