A9R8C20

Siti Hasmah Digital Library
A STORYBOARD SYSTEM TO FACILITATE TASKS IN E-LEARNING
NUR FARHANA BT AHMAD DEMAN HURI ZARITH ROSHAHIVA BINTI KUSHAIRI

SESSION 2009/2010
FACULTY OF INFORMATION TECHNOLOGY MULTIMEDIA UNIVERSITY APRIL 2010
A STORYBOARD SYSTEM TO FACILITATE TASKS IN E-LEARNING

BY
NUR FARHANA BT AHMAD DEMAN HURI ZARITH ROSHAHIVA BINTI KUSHAIRI

SESSION 2009/2010
THE PROJECT REPORT IS PREPARED FOR FACULTY OF INFORMATION TECHNOLOGY MULTIMEDIA UNIVERSITY IN PARTIAL FULFILLMENT FOR
BACHELOR OF INFORMATION TECHNOLOGY B.IT (HONS) MULTIMEDIA TECHNOLOGY MANAGEMENT B.IT (HONS) MULTIMEDIA TECHNOLOGY MANAGEMENT
FACULTY OF INFORMATION TECHNOLOGY
MULTIMEDIA UNIVERSITY
APRIL 2010
The copyright of this thesis belongs to the author under the terms of the Copyright Act 1987 as qualified by Regulation 4(1) of the Multimedia University Intellectual Property Regulations. Due acknowledgement shall always be made of the use of any material contained in, or derived from, this thesis.
Nur Farhana Bt Ahmad Deman Huri & Zarith Roshahiva Binti Kushairi, 2010 All rights reserved
DECLARATION We hereby declare that the work have been done by ourselves and no portion of the work contained in this thesis has been submitted in support of any application for any other degree or qualification of this or any other university or institute of learning.
____________________ Nur Farhana Bt Ahmad Deman Huri Faculty of Information Technology Multimedia University Date: 14:04:2010
____________________ Zarith Roshahiva Binti Kushairi Faculty of Information Technology Multimedia University Date: 14:04:2010
Use the declaration below if your project is done solely by yourself. DECLARATION I hereby declare that the work have been done by myself and no portion of the work contained in this thesis has been submitted in support of any application for any other degree or qualification of this or any other university or institute of learning.
____________________ Name of candidate Faculty of Information Technology Multimedia University Date: DD: MM: YYYY
A Storyboard System To Facilitate Tasks In E-Learning
ACKNOWLEGMENT
In the name of Allah, most Gracious, most Merciful. The contribution of many people towards the realization of this research project is gratefully acknowledged. First of all, we would like to express our sincere gratitude to our supervisor, Miss Norain Mohd Yusoff for her invaluable guidance, encouragement and constructive criticism throughout the course of this research project. We would also like to convey our appreciation to the Instructional Designers of Multimedia Production Unit, namely Miss Melor Bin Abd Rahman and her team members for their kind advice, close co-operation and participate in this project research. Grateful thanks are also acknowledged to our friends for their generous help during the study. To all others who help us one way or another, our sincere thanks. Last but not least, we would like end our chain of gratitude by acknowledging our parents who persuaded us to continue this degree. We can never thank them enough. We attribute all of our success to their moral support and prayers. We do not think there is anything we could ever do to repay the both of them. We are also grateful to our siblings for their support, understanding and never ending love, which have strengthened us in carrying out this research project.
TABLE OF CONTENTS
Management Summary ........................................................................................... 5 List of Tables ............................................................................................................ 6 List of Figure ............................................................................................................ 8 List of Appendices .................................................................................................. 10 Abbreviations ......................................................................................................... 11 Chapter 1: Introduction ........................................................................................ 12 1.1 Introduction ................................................................................................ 12 1.2 Problem Statements ................................................................................... 15 1.3 Research Objectives ................................................................................... 17 1.4 Research Questions .................................................................................... 17 1.5 Research Methodology .............................................................................. 18 1.6 Significant of Study .................................................................................... 21 1.7 Scope of Study ............................................................................................ 22 Chapter 2: Literature Review ............................................................................... 23 2.1 Introduction ................................................................................................ 23 2.2 Instructional Design ................................................................................... 23 2.2.1 What is Instructional Design .............................................................. 23 2.2.2 A Brief History of Instructional Design ............................................. 23 2.2.3 The Instructional Design Process ....................................................... 24 2.2.4 The Instructional Design Model ......................................................... 25 2.2.5 Advantages of Using Systematic Instructional Design ...................... 26 2.2.6 Limitation of Systematic Instructional design .................................... 28 2.2.7 People Who do Instructional Design .................................................. 28 2.2.8 Task & Roles for Storyboard Designer & Reviewer .......................... 29 2.2.9 Compentencies,Standards,and Ethics of Instructional Designer ........ 30 2.3 Definition of Storyboard ............................................................................ 31 2.4 A Brief History of Storyboard .................................................................. 32 2.5 Media in Storyboard VS E-Learning Storyboard .................................. 33 2.5.1 Similarity & Differences for Media Storyboard and E-Learning Storyboard ........................................................................................... 33 2.6 The E-Learning Storyboard ..................................................................... 34 2.6.1 Major Elements in E-Learning Storyboard.......................................... 34 2.6.2 Comparison Templates.. ...................................................................... 35 2.7 Storyboard Authoring Tools ..................................................................... 36 2.8 Different Types of Storyboard Tools ........................................................ 37 2.8.1 Raptivity .............................................................................................. 37 2.8.1.1 Advantages of Raptivity .......................................................... 38 2.8.1.2 Disadvantages of Raptivity.. ................................................... 39 2.8.2 DEMAIS.. ............................................................................................ 39 2.8.2.1 Advantages of DEMAIS ......................................................... 41 2.8.2.2 Disadvantages of DEMAIS.. ................................................... 41
2
2.8.3 Storyboard Tools 1.7.4.. ...................................................................... 42 2.8.3.1 Advantages of Storyboard Tools 1.7.4 .................................... 42 2.8.3.2 Disadvantages of Storyboard Tools 1.7.4.. ............................. 43 2.8.4 Springboard 0.91.. ............................................................................... 43 2.8.4.1 Advantages of Springboard 0.91 ............................................. 44 2.8.4.2 Disadvantages of Springboard 0.91.. ...................................... 44 2.8.5 MockupScreens 4.02............................................................................ 44 2.8.5.1 Advantages of MockupScreens 4.02 ....................................... 45 2.8.5.2 Disadvantages of MockupScreens 4.02.. ................................ 45 2.8.6 DENIM.. .............................................................................................. 46 2.8.6.1 Advantages of DENIM............................................................ 46 2.8.6.2 Disadvantages of DENIM.. ..................................................... 47 2.8.7 Anecdote.. ........................................................................................... 48 2.8.7.1 Advantages of Anecdote ......................................................... 49 2.8.7.2 Disadvantages of Anecdote.. ................................................... 49 2.9 Didactic Design in Storyboard .................................................................. 50 2.10 Data Analysis .............................................................................................. 51 2.11 Conclusion................................................................................................... 53 Chapter 3: Research Methodology and Requirements Gathering .................... 54 3.1 Introduction .................................................................................................. 54 3.2 Interview ....................................................................................................... 54 3.2.1 Introduction ........................................................................................ 54 3.2.2 Background of the interview .............................................................. 54 3.2.3 Interview Objectives .......................................................................... 55 3.2.4 Interview questions Organization....................................................... 55 3.2.5 Interview findings on Section A......................................................... 56 3.2.6 Interview findings on Section B ......................................................... 57 3.2.7 Interview findings on Section C ......................................................... 60 3.2.8 Summarization of Interview Findings ................................................ 62 3.3 Questionnaires .............................................................................................. 63 3.3.1 Instrumentation.................................................................................... 63 3.3.2 Background of IDs Group .................................................................. 63 3.3.3 Questionnaires Objectives ................................................................... 63 3.3.4 Questionnaires Organization ............................................................... 64 3.4 Data Analysis ................................................................................................ 65 3.4.1 Total Questionnaires Participants ........................................................ 65 3.4.2 Participants Background .................................................................... 66 3.4.3 Application Functionality .................................................................... 68 3.4.4 Collaboration ....................................................................................... 72 3.4.5 Opinion ................................................................................................ 74 3.4.6 Open Ended Question.......................................................................... 78 3.5 Summary of Findings................................................................................... 79 Chapter 4: System Architecture ........................................................................... 80 4.1 Executive Summary ..................................................................................... 80
3
4.2 System Analysis ............................................................................................ 81 4.2.1 Requirement Specifications................................................................. 81 4.3 System Design ............................................................................................... 82 4.3.1 Use Case .............................................................................................. 82 4.3.2 Activity Diagram ................................................................................. 86 4.3.3 Analytical Model: Class Diagram ....................................................... 87 4.3.4 Analytical Model Explanation ............................................................ 88 4.3.5 Design Model: Sequence Diagram ...................................................... 89 4.3.6 Design Model Explanation .................................................................. 90 4.3.7 System Architecture ............................................................................ 91 4.3.8 System Architecture Explanation ........................................................ 92 4.4 User Interface Design ................................................................................... 93 4.4.1 Overview ............................................................................................. 93 4.4.2 Web Design Tools ............................................................................... 93 4.4.3 Difficulties Encountered & Solution Applied ..................................... 94 4.4.4 Project Management Methodology ..................................................... 95 4.4.5 Difficulties Encountered ..................................................................... 97 4.4.6 Solution for Difficulties Encountered for the Above Matter .............. 97 4.4.7 Project Develpment Team ................................................................... 98 Chapter 5: System Application ............................................................................. 99 5.1 Functionality of the system.......................................................................... 99 5.2 Screenshots of the system .......................................................................... 100 5.2.1 Login Screen ..................................................................................... 100 5.2.2 Storyboard Screen ............................................................................. 104 5.2.3 Admin Screen .................................................................................... 106 Chapter 6: Testing/Evaluation of Findings ....................................................... 108 6.1 Introduction ................................................................................................ 108 6.2 System Test ................................................................................................. 108 6.3 Functional Test Design ............................................................................. 109 6.4 Test Result .................................................................................................. 109 6.5 Problem Encountered ................................................................................ 111 6.6 Limitations .................................................................................................. 112 6.7 Future Enhancement ................................................................................. 113 Chapter 7: Conclusion ......................................................................................... 114 REFERENCES ..................................................................................................... 115 APPENDICES ...................................................................................................... 121

4
MANAGEMENT SUMMARY
E-learning is perceived as a group effort, where content authors, instructional designers, multimedia, technicians, teachers, trainers, database administrators, and people from various other areas of expertise come together in order to serve a community of learners. The project presents a system framework to enhance a storyboard system in Multimedia Learning System. The importance of instructional design and design process are discussed to explore the issue of designers tasks and communication among Designers, Subject Matter Experts (SME), Reviewer and Proof Reader. Existing storyboard systems are analyzed. The project concluded that the e-Learning Storyboard system (De-ELSS) could develop to replace the lowfidelity and didactic issue in storyboarding. De-ELSS System is an application that assisting the SME to construct E-learning in order to improve communication problem between SME and ID.
LIST OF TABLES
TITLE 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 Table 1.1 Software tools/ devices for GUI /design purpose Table 2.1 Major activities of Instructional Designer Table 2.2 Advantage of using Systematic Instructional Design Table 2.3 People who involved in Instructional Design Table 2.4 Tasks & Roles for Storyboard Designers and Reviewer Table 2.5 Similarity and Differences for Media Storyboard and ELearning Storyboard Table 2.6 Elements in E-learning Storyboard Table 2.7 Comparison templates Table 2.8 Storyboard Authoring Tools Comparisons Table 2.9 Advantages of Raptivity Table 2.10 Advantages of DEMAIS Table 2.11 Advantages of Storyboard Tools 1.7.4 Table 2.12 Advantages of Springboard 0.91 Table 2.13 Advantages of MockupScreens 4.02 Table 2.14 Advantages of DENIM Table 2.15: Advantages of Anecdote Table 2.16: Comparisons among Storyboard Tools Table 3.1 Participants number of years using the computer Table 3.2 Participants number of years surfing the internet Table 3.3 The participants feedback on communication between team members Table 3.4 Participants feedback on content of the storyboard
PAGE 20 25 26 28 29 33 34 35 36 38 41 42 44 45 47 49 51 67 67 68 69
6
22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
Table 3.5 Participants feedback on output produces Table 3.6 Participants feedback on content template storyboarding Table 3.7 Participants feedback on various components Table 3.8 Participants feedback on application ease of use Table 3.9 Participants feedback on dealing with clients or SME Table 3.10 Participants feedback on understanding of SME Table 3.11 Participants feedback on practice and tests by SME Table 3.12 Participants feedback on dateline of the storyboard Table 3.13 Participants feedback on production turnaround time Table 3.14 Participants feedback on production costs Table 3.15 Participants feedback on using the application at work Table 3.16 Participants feedback on recommending the application Table 6.1 Test results of User Access module functionality Table 6.2 Test results of User Management module functionality Table 6.3 Test results of Instructional Design module functionality Table 6.4 Test results of Subject Matter Expert module functionality Table 6.5 Test results of Reviewer module functionality Table 6.6 Test results of Proof Read module functionality
69 70 71 71 72 73 73 74 75 76 76 77 109 110 110 110 111 111

7
LIST OF FIGURES
TITLE 1 2 3 4 5 6 7 8 10 11 12 13 14 15 16 17 18 19 20 21 22 23 Figure 1.1. Class diagrams for Administrator, ID, Reviewer, SME and Proof Read Figure 2.1. An Instructional Design Process Model Figure 2.2. Comparison Chart Figure 2.3. Flip Book (before open) Figure 2.4. Flip Book (During Open) Figure 2.5. Radial Diagrams Figure 2.6. The DEMAIS Storyboard Editor Figure 2.7. The narration (voice script) editor. Figure 2.8. The Content Manager Figure 2.9. Screenshot for the Storyboard Tools 1.7.4 Figure 2.10. Screenshot for the Springboard 0.91 tool Figure 2.11. Screenshot for the MockupScreens 4.02 tool Figure 2.12. Screenshot for the DENIM Figure 2.13. Screenshot for the Anecdote tool Figure 3.1. Component of Storyboard Figure 3.2. Total Questionnaire Participants Figure 3.3. How many years of experience do you have in relation to the job scope stated above? Figure 3.4. What is your highest tertiary education level? Figure 3.5. Participants overall rating of this application. Figure 4.1. Use case for Instructional Designer (ID) Figure 4.2. Use case for Subject Matter Expert (SME) Figure 4.3. Use case for Reviewer PAGE 19 25 37 37 38 38 40 40 40 42 43 45 46 48 58 65 66 66 77 82 83 83
24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46
Figure 4.4. Use case for Proof Read Figure 4.5. Use case for Administrator Figure 4.6. Activity Diagram for a Storyboard System Figure 4.7. Class Diagram for a Storyboard System Figure 4.8. Sequence Diagram for a Storyboard System Figure 4.9. System Architecture for Storyboard System Figure 4.10. Gantt chart for Phase 1 Figure 4.11. Gantt chart for Phase 2 Figure 5.1. Index page Figure 5.2. SME login page Figure 5.3. SME Main page Figure 5.4. Reviewer Login page Figure 5.5. Reviewer Main page Figure 5.6. Proof Read Login page Figure 5.7. Proof Read Main page Figure 5.8. SME Edit Profile page Figure 5.9. SME Change Password page Figure 5.10. Analysis Documents page Figure 5.11. View Analysis Documents Figure 5.12. Add Screen page Figure 5.13. Admin Login page Figure 5.14. Admin Main page Figure 5.15. View SME members page
84 85

9
86 87 89 91 95 96 100 100 101 102 102 103 103 104 104 105 105 106 106 107 107
LIST OF APPENDICES
TITLE Appendix 1: FYP Meeting Logs 1 Contributions Appendix 2: Questionnaires Interview Questions 2 Screenshots of the system Research Paper Conference Paperwork
10
ABBREVIATIONS
ABBREVIATION ACM De-ELSS DEMAIS DENIM GUI HCI ID IEEE IPS LMS MMLS MPU NEA PHP RW SD SME SOP UML
DESCRIPTION Association for Computing Machinery The E-Learning Storyboard System Designing Multimedia applications with Interactive Storyboards Design Environment for Navigation & Information Model Graphical User Interface Human-Computer Interaction Instructional Designer Institute of Electrical & Electronic Engineer Institute for Postgraduate Studies Learning Management System Multimedia Learning System Multimedia Production Unit National Education Association Hypertext Preprocessor Reviewer Storyboard Designer Subject Matter Expert Standard or Operation Unified Modeling Language
11
1. INTRODUCTION
1.1 Introduction
E-learning is a learning process that is enabled or supported by the use of digital tools and content. It typically involves some form of interactivity, which may include online interaction between the learner and their teacher or peers. E-learning opportunities are usually accessed via the internet, though other technologies such as CD-ROM are also used. With e-learning, learners are not bounded by the time constraints and they can learn at their desired pace. (Ministry of Education 2004:1) In 1990s, Datuk Seri Dr. Mahathir bin Mohamad was introduced E-Learning in Malaysian when he announced vision 2020. For this reason E-learning has been established in 1996 by the Multimedia Super Corridor. E-learning strategies have been introduced into public universities since 1996. Since then, E-learning is introduced widely and is encouraged to be implemented in organizations and education. Learning Management System (LMS) have been described as a web based technology or software package that used to plan, implement, and assess a specific learning process. It provides an instructor to create and delivery of learning content. LMS also provide students with the ability to use interactive features such as discussion forums, video conferencing and threaded discussions. For example, Multimedia University has developed their multimedia learning system (MMLS) to be used for the pilot study among others LMS Universities.
12
As E-learning systems grow and more people are accessing them, it should be designed considering Human-Computer Interaction (HCI) and usability concepts and
methodologies. HCI offers a core of concepts and methodologies that constitute a step ahead in the design of interactive systems. E-learning is based on computers, devices and screens and is fundamentally interactive and, for this reason, HCI becomes the key element in the design of interactive e-learning systems that take into account user needs and characteristics. HCI is the study of how people design, implement, and use interactive computer systems and how computers affect individuals, organizations, and society. HCI has been introduce new interaction techniques for supporting user tasks, providing better access to information, and creating more powerful forms of communication. It includes input and output devices and the interaction techniques that use them; how information is presented and requested; how the computers actions are controlled and monitored; all forms of help, documentation, and training; the tools used to design, build, test, and evaluate user interfaces; and the processes that developers follow when creating interfaces. Research in HCI has been spectacularly successful and has fundamentally changed computing. For example, virtually all software written today employs user interface toolkits and interface builders. HCI introduced applying hypertext technology to browsers allows one to traverse a link across the world with a click of the mouse due to the growths of World Wide Web. It is interface improvements more than anything else that triggered this explosive growth. With HCI, it will lead to effective E-learning systems that should include sophisticated and advanced
13
functions, yet their interface should hide their complexity, providing an easy and flexible interaction suited to catch students' interest.
A storyboard can be defined as one of the important magic arrows in eLearning. It contains a detailed description of the visual elements such as text, graphics, video and animation and also programming instruction. The storyboard provides the details from the instructional designers (ID) that are needed by the Subject Matter Experts (SME) in order to produce an effective e-Learning. With Storyboard, it used to facilitate communication between team members and provides a through visual representation of the final instruction. Leonardo da Vinci was the first person to use storyboard. The storyboarding process was developed at the Walt Disney studio during the late 1920s after years of similar processes being used at other animation studios. In 1929, Walt Disney and his artists created the storyboard with the making of steamboat Willie, the first animated cartoon feature. This method is still used in the movie industry today. This final year project is conducted to develop storyboard for enhancing the learning object environment with audio and animation in order to produce an interactive distance learning lessons.
14
1.2 Problem Statement

The research is carried out to identify the following issues: Learning goals cannot be identified in advance. The existing standard or operation (SOP) indicates that SMEs lack of training and thus unable to identify the purpose of developing storyboard contents for eLearning. No particular goals of developing storyboard contents are identified to the SME. In such cases, because there is no lead time to the education, and since reflection and planning are central to instructional design, there is limited opportunity to apply many of its principles and procedures. In the existing system, the SMEs have to comply with a lot of principles and procedures to meet the datelines of storyboard submission. Storyboard Templates which are not suitable for e-learning The current storyboard template are not standardize and not suitable for Elearning. Many of the storyboard templates only relate to film, video or multimedia and will not be useful for E-learning work. The templates of the storyboard will only be suitable for frame-based E-learning, which in turn is mainly suitable for declarative (factual) or canonical (right/wrong) knowledge. The storyboard that they used is never change, meaning here the SMEs still using the paper based storyboard. This is more difficult when they arrive at adding
15
something into the storyboard. The size of the paper based storyboard is fixed and cannot be change.
Lack of communication between IDs and SMEs Instructional designers need to account for nuances of the community of practice when interacting with the subject matter expert. A lack of attention to this milieu could result in non-acceptance of the instructional designer as a change agent or ineffective learning design. For instance the SME may not understand that they need to be constantly involved with a project. A project will not be successful if the SME has irregular contact with the instructional designer and development team. Time Constraint that cause of Slow turnaround time Since the ID and SME are two different groups of people being pulled together to work on a content project, it would be very difficult to set a common schedule for these two parties to congregate and collaborate on their content development effort. This is another contributing factor to the slow cycle of generating content storyboard. Lack of suitable application that would expedite development process. In order to make it easier for the SME to generate an e-learning content storyboard, there need to be an application to assist them in this conquest. However, there are available for creating e-learning content storyboard that caters for SME as their target user, but the system does not cater the application to facilitate between the team members.
16
1.3 Research Objectives

This research project will attain the following objectives: 1. 2. 3. To encourages advocacy of the learner. To supports effective, efficient, and appealing instruction. To supports coordination among designers, developers and those who will implement the instruction. 4. 5. 6. 7. To facilitates diffusion/ dissemination/ adoption. To supports development for alternate embodiments or delivery systems. To facilitates congruence among objectives, activities, and assessment. To provides a systematic framework for dealing with learning problems.
1.4 Research Questions

The research aims to answer the following questions: 1. 2. 3. 4. How to develop a good storyboard for e-learning? What are the problems faces by the team members in storyboarding? How to facilitate a good communication in storyboarding? How to conduct the usability study of the storyboard design?
17
1.5 Research Methodology

Information Gathering The application must be built before it could be used by the sample group to test its usability and effectiveness. There are few ways of gathering information for this final year project. The first way is gathered an information from the books at the Siti Hasmah Digital Library which is in Multimedia University Cyberjaya. Other ways to gathered information is based on journal. This journal can be found at the Institute for Postgraduate Studies (IPS) that is under the Research and Development Division in Multimedia University Cyberjaya. In order to get more accurate information, E-database also provides a function in finding the information. Examples of E-database are such ACM Portal, IEEE Portal, Francis and Taylor Database, Science Direct, and Springer Database. Besides that, the information shall be derived from the internet searching, doing interview with peoples that related to this project and distribute the questionnaires. System architecture System architecture is divided by two parts which is conceptual design and physical design. The Conceptual Design is a strategic statement of how the solution will provide value to the collection of usage scenarios which is describes all the participants and activities within any environment that require a solution. This design statement is expressed in the context of the solution users and describes what the solution will do to support their activities.
18
The Physical Design relates to the actual input and output processes of the system. This is laid down in terms of how data is inputted into a system, how it is
verified or authenticated, how it is processed, and how it is displayed as output. Software architecture The software architecture of a program or computing system is the structure or structures of the system, which comprise software components, the externally visible properties of those components, and the relationships between them. This software architecture for this final year project research requires data, class diagram and other information. Below are the class diagrams for Administrator, ID, Reviewer, SME and Proof Read.
Figure 1.1: Class diagrams for Administrator, ID, Reviewer, SME and Proof Read
19
Software tools/ devices for GUI /design purpose There have been special software systems and tools to help design and
implement the user interface software. Many of these tools have demonstrated significant productivity gains for programmers, and have become important commercial products. Below are the software tools or devices that will be used in this final year project. Table 1.1: Software tools/ devices for GUI /design purpose
Application Web Description PHP is a recursive acronym for PHP: Hypertext Pre-processor. It is an open-source server-side scripting language that was first introduced in 1994. Since then it had become the most popular open-source web based programming language used by over 6 million domains with a monthly growth rate of 15% (according to Netcraft, http://www.netcraft.com/survey/). MySQL is a relational database management system (RDBMS) that runs as a server providing multi-user access to a number of databases. (MySQL, 2010) Is a web development application originally created by Macromedia, and is now developed by Adobe Systems, which acquired Macromedia in 2005.( Adobe Dreamweaver, 2010) Wanp are packages of independently-created programs installed on computers that use a Microsoft Windows operating system. (WAMP, 2010) Microsoft Visio is a diagramming program that uses a vector graphics to create diagrams such as the flowchart diagrams. Rational Rose is software that helps in creating an UML (Unified Modeling Language). The Unified Modeling Language (UML) offers standard semantics and notation for describing object structure and behavior and has emerged as the design medium of choice for developing large-scale distributed object applications.
MySQL
Adobe Dreamweaver Wamp
Microsoft Visio Rational Rose
20
1.6 Significance of Study
This study aimed to improve an existing E-learning by developing a storyboard system for assisting the SME to construct E-learning and also can improve the communication problem between SME and ID. With Storyboard, it could improve the low fidelity prototyping from the sketch based that still uses traditional method. This will lead changes to high fidelity prototyping that are fully interactive, simulating much of the functionality in the storyboard. For example, users can operate on the prototype, or even perform some real tasks with it. Eventually, this study is deemed significant because if such the storyboard in Elearning could be built and prove to be effective, it would not only benefit the E-learning system in Multimedia University but also to improve the e-learning industry in Malaysia that has been proposed by the government as well. The De-ELSS follows the set of competencies for instructional designers developed by International Board of Standards for Training, Performance, and Instruction (IBSTPI). The research also used the ethics guideline provided by the National Education Association (NEA) which focuses on commitments to students and to the profession of education. (Smith and Ragan, 2005)
21
1.7 Scope of Study
Below are the scopes of the study for this final year project: The scope of this study focus on storyboarding in the E-learning. Not animation and films and games. To introduce MMLS as a pilot study among other LMS that created by other universities. This study will come out with expected deliverable by develop an interactive multimedia syllabus that can be used by SME and reviewer. For sampling purpose - Multimedia Technology & Application and another subject. For usability.
22
2. LITERATURE REVIEW
2.1 Introduction
This chapter examines previous literature or studies conducted with the Elearning storyboard. The sources for the literature are collected from some articles, academic research papers, published journals and some online references. This chapter will focus on the Instructional Design and its concepts, and further discuss detailed of the storyboard.
2.2 Instructional Design

2.2.1 What is Instructional Design? Smith and Ragan (2005) defined Instructional Design as the systematic and reflective process of translating principles of learning and instruction into plans for instructional materials, activities, information resources, and evaluation. 2.2.2 A brief history of Instructional Design Instructional Design is the combination of the word instruction and design itself. Instruction is the international facilitation of learning toward identified learning goals. Discroll (2000) has defined instruction from a similar perspective as follows: the deliberate arrangement of learning conditions to promote the attainment of some intended goal. In both definitions, instruction is the intentional arrangement of experiences, leading to learners acquiring particular capabilities.
23
Design is an activity or process that people engage in that improves the quality of
their subsequent creations. Design is related to planning, the differences being that once that expertise and care with which planning is conducted reaches a certain point that begin to refer to the activity as design. When projects become complex, at some point the term planning no longer fits and design becomes a better descriptor. According to (Schon, 1987), a student of effective professional practice has been described design as a process of reflective conversation with the materials of a given situation. 2.2.3 The Instructional Design process There are many interpretations that described the term instructional design. Another way to define instructional design is to describe the process involved in the systematic planning of instruction. According to (Mager, 1984), the instructional
designers job is to answer the following three major questions: Where are we going? (What are the goals of the instruction?) How will we get there? (What are the instructional strategy and the instructional medium?) How will we know when we have arrived? (What should our tests look like? How will we evaluate and revise the instructional materials?) These three questions can be stated as major activities that an instructional designer completes during the design and development process as shown in Table 2.1.
24
Table 2.1: Major activities of Instructional Designer
Design Process Analysis Strategy Evaluation
Descriptions Perform an instructional analysis to determine where were going. Develop an instructional strategy to determine how well get there. Develop and conduct an evaluation to determine how well know when were there.
2.2.4 Instructional Design Models According to Andrews and Goodson (1980) have described forty such models for systematic design of instruction. In the other hand, Gustafson and Branch (1997) provide a more extensive analysis of fourteen models. In these analysis, the research modified Smith and Ragan (2005)s simple model of design to accommodate with the De-ELSS. Figure 2.1 shows the modified Smith and Ragan (2005)s simple model of design.
Figure 2.1: An Instructional Design Process Model

25
2.2.5 Advantage of using systematic Instructional Design The advantages of systematic instructional design are listed as follows: Table 2.2: Advantage of using Systematic Instructional Design (excerpts from Smith and Ragan (2005))
Advantages Encourages advocacy of the learner Descriptions To a very large degree, the learner is the focus of instruction. Designers spend a great deal of effort during the beginning stages of a design project trying to find out about the learner. Information about learners should take precedence over other factors that might drive design decisions, including the content itself. Often the designer is not a content expert. In their constant querying of a subject matter expert for clarification, designers are standing in the place of the learner, trying to obtain information to make the content clearer to the learner. All of these factors are considered indicators for success. The process of design itself focuses on effective instruction. Efficiency is particularly facilitated by the process of instructional analysis in which appropriated strategies promotes the appeal of instruction. The process of formative evaluation provides the opportunity to revise instruction to make it more effective, efficient, and appealing. The systematic process and resulting written documentation allow for communication and coordination among individuals involved designing, producing and delivering instruction. It allows for common language and general procedure. The written plans (goals, description of target audience, and analysis of task) and the written products that are results of instructional design efforts assist the process of review and revision of work in progress in a coordinated team effort.
Supports effective, efficient, and appealing instruction.
Supports coordination among designers, developers and those who will implement the instruction.
Because the products of systematic instructional designer are in fact physical products, there may be Facilitates diffusion/ dissemination/ adoption. duplicated, distributed, and used in the field. In addition, because design and development have employed information about the learners and setting, products will have a high likelihood of being practical, workable, and acceptable solutions to the instructional problems that there are designed to solve.
26
Supports development for alternate embodiments or delivery systems. Facilitates congruence among objectives, activities, and assessment. Provides a systematic framework for dealing with learning problems.
Much of the work that goes into an instructional design project is independent of the specific form that finished product takes (such as print, web, computer, or video). The front-end analysis and consideration of instructional strategies will be valid beginning points for projects that result in embodiments other than those used by the original project. The systematic approach to instructional design helps ensure that what is taught is what is needed for learners to achieve stated goals for learning and that evaluation will be accurate and appropriate.
Frequently, creative individuals not trained in systematic instructional design will develop ingenious approaches to instruction that are rather like solutions looking for a problem. The innovations that are generally appealing are those that have clarified the problem into a learning goal, have developed an instructional approach that gives reason to believe that the problem can be solved and the learning goals will be met, and has a well-constructed plan for gathering evidence to determine whether the approach has solved the initial problem and what undesirable effects it might have.
27
2.2.6 Limitation Of Systematic Instructional Design
ID has limited applicability to educational experiences which is learning goals cannot be identified in advance and no particular goals are identified. In such cases, because there is no lead time to the education, and since reflection and planning are central to ID, there is limited opportunity to apply many of its principles and procedures. 2.2.7 People who do Instructional Design The following people that are listed below are involved in instructional design: Table 2.3: People who involved in ID (excerpts from Smith and Ragan (2005))
People Training Designers Description The most identifiable group of individuals who practice instructional design is trainers of adults in business, industry, government and private agencies. Not all trainers are instructional designers. Some trainers are experts in their skill or subject area, who are either permanently or temporarily assigned to conduct training in that area. Many instructional designers who are involved in training design have developed additional competencies in more inclusive specialty that is termed performance technology. SME will be a teacher as Designers in E-learning. SME select or develop activities and information sources that will assist learners in reaching these goals. The development of engaging activities seems to be a particular strength of practicing SME. In addition, SME also select or develop ways to assess learners progress toward reaching goals. These assessment approaches may include written tests, performance tests, observation, oral questioning and a variety of other techniques for assessing learning. Graphic Designer, Multimedia Designer and also proof read. ID are sometimes called upon to make contributions in the visual metaphors which may underlie a simulation, micro world, virtual reality or exploratory learning environment may benefit from the contributions of an instructional designer who possesses a high proficiency in visual literacy skills in addition to core instructional design competencies.
Teachers as Designers
Other Designers
28
2.2.8 Tasks & Roles for Storyboard Designer and Reviewer
Melor, (2007) developed the major list tasks that need to be accomplished by the Storyboard Designers (SD), and Reviewer (RW) in order to develop the storyboard in Elearning. Table 2.4: Tasks & Roles for Storyboard Designers and Reviewer
Roles Storyboard Designer Tasks To plan and create course contents (Lesson, Sco) to meet the learning objectives. Provide storyboard within the deadline. To review and update the content and storyboard together with the Instructional Designer. To ensure the correctness of the subject matter as well as grammar and spelling. Storyboard Designer is also responsible for the correctness of voiceover and pronunciation. If there are mistakes, the Storyboard Designer will have to inform the Instructional Designer or the Multimedia Designer/ Graphic Designer to make the necessary changes. Specify and select relevant materials such as images, videos, animations and voice-over scripts. The Multimedia Designer/ Graphic Designer will assist to draw the images, animate the objects and record the voice-over. To be responsible for the copyright issues of the content, images, videos or other materials provided by the lecturer. To test the completed courseware with the Instructional Designer to verify the correctness of the completed courseware and if necessary provide feedback for improvement. Review all storyboards prepared by the storyboard designer and submits a review report once completed. Suggest or comment to improve the content, text, images, diagram and chart. Give feedback if any extra information should be including in the content. Review the completed courseware (final product) and submits a review report once completed.
Reviewer
29
2.2.9 Competencies, Standards, and Ethics of Instructional Designers
Below are the competencies, standards, and ethics of Instructional Designers Competencies One of the more widely used set of competencies for IDs is that developed by International Board of Standards for Training, Performance, and Instruction (IBSTPI). Another useful set of competencies is that developed by the American Society for Training and Development (ASTD). The ASTD competencies are directed toward human resource development and performance improvement in corporate contexts. In addition, Analysis & Technology, Inc. also has developed a set of competencies. Standards Fields and his associates (Fields, Foxton, & Richey, 2001) elaborated the IBSTPI competencies with training standards as well as providing a description of common specializations and uses of standards by various subgroups. In addition, the Association for Educational Communications and Technology (AECT) has developed the standards used by the National Council for Accreditation of Teacher Education (NCATE) to support for accrediting of both the technology component of undergraduate programs in instructional design and technology. Ethics Like competencies and standards, professional codes of ethic provide guidance for a good practice. Ethics provide a different insight from that provided by performance standards which is a moral compass. National Education Association (NEA) has
30
developed a short but useful statement of ethics for educators which focus on
commitments to students and to the profession of education. According to (Welliver, 2001) has been edited a volume for AECT on ethics for educational communications and technology professionals.
2.3 Definition of Storyboard

There are many ways to describe storyboard. The storyboard in E-learning development process originally comes from combination of the film, video world, software engineering and education. This common history with media design and production creates confusion at times. There are some common terms that are used in different ways, and not all of the lessons learned in producing other media apply to eLearning. Therefore, this research project is to identify which definition to use in order to avoid confusion and misinterpretation of the term. Bill Brandon (2004) defined storyboard as the magic arrow in E-learning which transports a project from design to development. According to the U.S. Department of Justice Office for Domestic Preparedness says, Storyboards are the blueprints of an interactive courseware design and development process. Orr et al. (1993) claims storyboard is the documentation for interactive multimedia production that contains instructions for programming, an audio script, and a detailed description of the visual elements such as text, video, graphics, and animation.
31
2.4 A brief history of Storyboard
In early 1940s, the storyboard becomes popular in making movies, cartoons and other visual media that use the traditional way in a written script to specify the exact content. The storyboard contains series of sketches and notes on the paper in order to covering the key shot in sequence. During preproduction, it uses how the writers and directors plan out the sequence of camera shots and connect them to the script. One of the first live action films to be completely storyboarded was Gone with the Wind. William Cameron Menzies, the films production designer, was hired by David Selznick to design every shot of the film. According to Alfred Hitchcoock, a twentieth century director of psychological thrillers has been used the exacting storyboard in details the scenes could be precisely shot even he will not present on the set. There is a famous scene, the shower murder in Psycho, that required dozens of individual shots, involving an actress and a stand-in, made over a period of several days. Hitchcocks graphic designer on the film, Saul Bass, drew each of those shots on a storyboard in advance. Other directors rely on storyboards to communicate their ideas and objectives to the rest of the production team. Undoubtedly, the study of storyboard will continue to grow and progress as the storyboard method also is useful for educational content than scripts. The existing storyboard will help to facilitate tasks in E-learning. The next part will discuss further difference between Media Storyboard and E-learning storyboard.
32
2.5 Media Storyboard VS E-learning Storyboard
2.5.1
Similarity and Differences for Media Storyboard and E-learning Storyboard According to (Brandon, 2004), there are similarities and differences between
media storyboard and E-learning: Table 2.5: Similarity and Differences for Media Storyboard and E-Learning Storyboard
Media Storyboard Similarities Team Production Both involve production with a team. E-learning Storyboard
Visual elements Both involve production of visual elements and audio. /audio production Creativity Expensive Linear Both are important in creativity. Mistakes in either one are expensive to fix. Differences One thing always follows another Most E-learning involves branching in a fixed sequence. based on learner responses that each learner may experience a different path through a course. Most multimedia and a lot of video and film are made for the purpose of creating awareness and interest via a clearly communicated message. E-learning is created in order to obtain particular business goals as the result of people developing new skills or knowledge. (Brandon, 2004 ) Facilitates Communication between team members (Leonard, 2004 ) Provide a through visual representation of the final instruction (Kruse, n.d.) Way of Interaction Most multimedia and all video Interactive because E-learning is and film products are non- defined by questions, and practice. interactive. There is a feedback from the learners.
Purpose
33
2.6 The E-learning Storyboard
E-learning storyboard is a screen-by-screen description of what students will see, hear, and do when running the program. It provides a more complete picture of what the final program will look like. E-Learning storyboards must connect not only content and images but also programming instructions. 2.6.1 Major Elements in E-learning Storyboard.
(Kruse, n.d.) Has been listed out the following 8 Major elements:
Table 2.6: Elements in E-learning Storyboard

Elements Project Information Description Storyboards should contain identifying information about the project such as client name, curriculum title, unit/lesson title, date, draft/version number and storyboard frame number. Learning objectives are included in the storyboard as on-screen text. It Indicates to the learner what they will be able to do, say and/or write after instruction In Audio/Narration should include the following: Audio Scripts Instruction Feedback Male and female narration voices indicated Videos are great for visual learners and help them achieve their objectives Graphics are provided in the script as a verbal description of what should appear on screen, or a sketch. It helps visually to enhance the learning and to captures learners attention. Textual content on a storyboard is to match the exact text as seen by the learner during the module. It would need to be verified by the SME and gives other team members an idea of what their multimedia creations are intended to supplement In addition, text should adhere to proper design and formatting principles. For example, headings & proper fonts. Navigation Storyboard screens should have chronological display depicting the exact display of the intended module. 34
Objectives
Audio/Narration Video Clips Graphics
On-Screen Text
Navigation& Interactivity
Relevant Notes
Interactivity One Rule: NO Interactive Elements Included in a Storyboard Two reasons: Interactivity crowds an already detailed presentation Those who create such interactive elements are the ones to whom the SB is being presented. Therefore, their inclusion in a storyboard is not possible. Storyboards use notes to clarify and describe elements that are not visually represented. For example: Graphics, Animations, Video, Hyperlinks, and Audio etc. Notes give team members verbal details for complicated visuals
2.6.2 Comparison templates Below is the table for comparison templates for free or commercial storyboard templates. (Brandon, 2004) Table 2.7: Comparison templates
Free Freebies Studio 1151 U.S Department Of Justice Horton E-learning Designers Edge Commercial
35
2.7 Storyboard Authoring Tools
Storyboard Authoring Tools is a tool that helps designers to create and design a storyboard based on the need and requirements. Below are the comparisons between the authoring tools.
Table 2.8: Storyboard Authoring Tools Comparisons No. 1. Name of Storyboard Shin et al, (2005) introduced an AR Storyboard: An Augmented Reality based Interactive Storyboard Authoring Tool Microsoft PowerPoint (Microsoft PowerPoint, 2009) Description Proposed tool is easy-touse, and provides intuitive interface for scene composition and camera pose/motion control. Functions Using an AR Storyboard, nonexperienced users may compose 3D scenes for a storyboard using interfaces in his/her real environments. Custom animation can be used to create small storyboards by animating pictures to enter, exit or move. It can contain text, graphics, movies, and other objects, which may be arranged freely on the slide. It can be used to do the documentation and create small storyboards using the tools in the Microsoft Word. It is flexible and powerful and allows defining a precise background grid.
2.
It is a presentation program that widely used by business people, educators, students, and trainers to present an information. PowerPoint presentations consist of a number of individual pages or slides. Microsoft Word is a word processor designed by Microsoft.
3.
Microsoft Word (Microsoft Word, 2009)
4.
Adobe Illustrator (Adobe Illustrator,2009)
Adobe Illustrator is a vector graphics editor.
36
2.8 Different Types of Storyboard Tools
2.8.1
Raptivity The white paper (Raptivity Software Makes Interactive Learning Easy, 2008)
stated that Raptivity is a scalable and extremely affordable tool that makes learning both challenging and enjoyable. It enables trainers, educators and subject matter experts to create instructionally sound, customized and trackable Adobe Flash interactions quickly and easily without Flash programming. With its patent-pending technology and open architecture, Raptivity is at the forefront of rapid interactivity technology. Below are the screen shot in raptivity for the only e-learning storyboards that serve the interactivity purpose. This e-learning storyboard does not contain the communication issues.
Figure 2.2: Comparison Chart
Figure 2.3: Flip Book (before open)
37
Figure 2.4: Flip Book (during open)
Figure 2.5: Radial Diagrams
2.8.1.1 Advantages of Raptivity (Raptivity Software Makes Interactive Learning Easy, 2008) provides the features that help making Raptivity an indispensable tool for courseware developer. Table 2.9: Advantages of Raptivity
Advantages Easily used with other tools Description The interactivity created using Raptivity can easily be embedded into eLearning content through favored authoring tools. Course creators can also take an interaction created or customized using Raptivity, and reuse it elsewhere, such as a PowerPoint presentation, a product web site, an online meeting or a help file. More than Raptivity provides a pre-built library of 200-plus rapidly-customizable interaction models, far more than other tools. They include 3D, games, videos, 200 simulations and numerous other interaction models. Each can be customized by interactions users to create an unlimited number of variations. Raptivity maps the available interactions to a variety of instructional design Numerous methodologies. Designers can select the learning theory they have been using, options such as Blooms Taxonomy, Gagnes Nine Events, and Kellers ARCS Model. available It also allows course creators to fashion their own instructional design methodology, and map Raptivity interactions to each step in the methodology. MyRaptivity Developers can create their own interaction models with a unique and simple new tool call MyRaptivity. After they have developed interaction logic using expands Flash, they can employ MyRaptivity to create variations of those interactions capabilities and also can leverage the Raptivity user base within their organizations, saving the time and effort required for communication, making program changes, fixing bugs, and other functions. 38
2.8.1.2 Disadvantages of Raptivity
Raptivity does not congruent with the Smith and Ragan, (2005) of systematic Instructional Design. Below are the congruent or disadvantages of it: Raptivity does not offer a print out records to users. It is only provide the flash file output. The cross-platform use of Raptivity does cause some portability problem.
2.8.2 DEMAIS Bailey et al. (2001) state that DEMAIS is a sketch-based, interactive multimedia storyboard tool that uses a designers ink strokes and textual annotations as an input design vocabulary. By operationalizing this vocabulary, the tool transforms an otherwise static sketch into a working example, facilitating experience-based exploration (exploring an idea through a working example). The behavioral sketch can be quickly edited using gestures and an expressive visual language. By enabling a designer to explore and communicate behavioral design ideas using working examples early in the design process, our tool facilitates the creation of a more effective, compelling, and entertaining multimedia application. Figure 2.6, Figure 2.7 and Figure 2.8 show the screenshots from the DEMAIS (Designing Multimedia Applications with Interactive Storyboards).
39
Figure 2.6: The DEMAIS Storyboard Editor
Figure 2.7: The narration (voice script) editor.
Figure 2.8: The Content Manager

40
2.8.2.1 Advantages of DEMAIS
Based on Bailey et al. (2001), below are the advantages of DEMAIS. Table 2.10: Advantages of DEMAIS
Features Description Designing Content: The In DEMAIS, a designer designs content using the storyboard and Storyboard and narration editors. The multi-view editor enables a designer to Narration Editors simultaneously view multiple storyboards and narrations and sketch behavior among them. Visual Language Icons, To explore behavioral design ideas, a designer sketches behavioral ink Behavioral Ink Strokes, strokes between objects in the storyboard or multiview editor, edits the Annotations, and the visual language icons attached to a behavioral ink stroke, or enters Multi-View Editor textual annotations in the storyboard editor. Operationalizing A designer aperationalizes a design by selecting the play button. When Content and Behavior a design is operationalized, the system on displays the behavioral ink strokes and icons, annotations, and recognized objects and text that have a display action attached to them. If a recognized object is to be undisplayed, then so are all the ink strokes and text objects contained within it, causing them to behave as a group.
2.8.2.2 Disadvantages of DEMAIS According to Bailey et al. (2001), there are a few disadvantages of DEMAIS. The disadvantages of DEMAIS are as follows: A designer must enter interpretable text onto a storyboard canvas using the keyboard as opposed the stylus. A designer can always use the stylus to scribble written notes, but these notes cannot be interpreted by the system. It does not check for consistency among behavior definitions, possibly causing unwanted results when that behavior is operationalized. Although DEMAIS does support layers internally, it does not yet provide a designer with a mechanism for adjusting the layer in which sketched content is drawn. By adjusting layers, a designer can manipulate the overlap among sketched content.
41
2.8.3 Storyboard Tools 1.7.4
Storyboard Tools 1.7.4 is an organizational tool, primarily of interest to film directors, storyboard artists and film-makers generally. Images from various sources may be used to build up an entire storyboard project on the computer screen which may then be printed in a form portable enough to be taken on set (Storyboard Tools 1.7.4, 2009). Figure 2.9 shows the screenshot for the storyboard tools 1.7.4.
Figure 2.9: Screenshot for the Storyboard Tools 1.7.4 2.8.3.1 Advantages of Storyboard Tools 1.7.4 Table 2.11: Advantages of Storyboard Tools 1.7.4 (Storyboard Tools 1.7.4, 2009)
Features Text Description Storyboard Tools stores text along with the images. Once a project is complete this text can be used to automatically generate tables of information which may use when filming. In addition, a web page can be generated from the project at the click of a button. Storyboard Tools has its own drawing tool with specialized features for storyboarding. A "visualiser" program lets you view images in sequence, and play around with a number of editing effects including fades and dissolves.
Web page Drawing tool
42
2.8.3.2 Disadvantages of Storyboard Tools 1.7.4
Disadvantages of the Storyboard Tools 1.7.4 is as follows: Storyboard Tools is just for film-makers, directors & storyboard artists who want to storyboard a movie on a personal computer only The interface of these tools provides so many buttons. This buttons sometimes make a confusing to the users 2.8.4 Springboard 0.91 Springboard 0.91 is a fast, light, easy-to-use Windows application for easily and quickly sketching and annotating your storyboard ideas for film, video, animation, or other dynamic media (Storyboard 0.91, 2009). Figure 2.10 shows the screenshot for Springboard 0.91 tool.
Figure 2.10: Screenshot for the Springboard 0.91 tool
43
2.8.4.1 Advantages of Springboard 0.91
Table 2.12: Advantages of Springboard 0.91(Storyboard 0.91, 2009)

Features Natural-media and vector tools Text and graphics Layers Multi-layer model Description This tools will help in outline the story to organize the work; draw the storyboards with both tools Import or copy and paste text and graphics from other applications Add annotation layers to show camera moves, special effects Use a multi-layer model to productively reuse content, and easily edit graphics.
2.8.4.2 Disadvantages of Springboard 0.91 Same as other storyboard tools, this Springboard 0.91 also have a disadvantages. The disadvantages are as follows: Users had trouble creating navigational links between pages that they had initially drawn far apart on the canvas. Some features in springboard 0.91 are unavailable
2.8.5 MockupScreens 4.02 MockupScreens 4.02 helps you to sketch screen mockups of your application and organize them in scenarios. With MockupScreens you can experiment interactively with your clients, and quickly create wireframe of your application, while the coding hasn't even started yet. MockupScreens main design goals are ease of use and productivity (MockupScreens, 2009). Figure 2.11 shows the screenshot of MockupScreens 4.02.
44
Figure 2.11: Screenshot for the MockupScreens 4.02 tool 2.8.5.1 Advantages of MockupScreen 4.02 Table 2.13: Advantages of MockupScreens 4.02. (MockupScreens, 2009)
Advantages Easy to use Clickable prototype Description MockupScreens is very easy to use. You need no documentation whatsoever to prepare your first design. A nice feature, especially for presentations, is users can create a usage flow of application they design mapping buttons on one screen with another. This way creating a clickable GUI prototype is very easy. With MockupScreens you can experiment interactively with your clients, and quickly create wireframe of your application, while the coding hasn't even started yet.
Experiment interactively
2.8.5.2 Disadvantages of MockupScreen 4.02 Besides advantages, MockupScreen 4.02 also comes with the disadvantages. Below listed the disadvantages of this MockupScreen 4.02: Because of the experiment interactively, clients will expect that the application is totally finished The buttons on the MockupScreen tools are not organized in the sequence order.
45
2.8.6 DENIM
According to Lin et al. (2001), DENIM is a system to assist designers of web sites in the early stages of information, navigation, and interaction design. It is an informal pen-based system that allows designers to quickly sketch web pages, view them at different levels of detail, create links among them, and interact with them in a run mode. Figure 2.12 shows the screenshot for DENIM.
Figure 2.12: Screenshot for the DENIM 2.8.6.1 Advantages of DENIM Based on Lin et al. (2001), DENIM was designed and implemented a prototyping tool to assist designers in the early stages of website design. Table 2.14 is the advantages that listed by Lin and his friends:
46
Table 2.14: Advantages of DENIM
Advantages Creating And Editing Pages Zooming
Arrows
Run Mode
Description In DENIM, web pages are accompanied by a label that represents the name or description of the page. The labels remain the same size throughout all the zoom levels, so that they are always readable. To change the zoom level, the user either drags the slider's elevator or clicks directly on one of the icons. Changing the zoom level initiates an animated transition from the current zoom level to the desired zoom level. The center point for a zoom operation can be set by tapping on the background of the canvas. An arrow between two pages represents a relationship between those pages. We provide navigational and organizational links. Navigational links are links in the HTML sense: they represent the reference from an item on one page to another page. Organizational links are used to represent a conceptual link between two pages; that is, the designer eventually wants to make a navigational link from one page to another, but does not want to fill in the details at this time. With Run mode, designers can test the interaction with a site that they are designing without having to create a full-fledged prototype.
2.8.6.2 Disadvantages of DENIM Lin et al. (2001) also list down the disadvantages of the DENIM tool. The disadvantages are as follows: DENIM is intended for prototyping in the early stages of design, but not for the creation of finished websites. For example, it does not output finished HTML pages. DENIM does not attempt to recognize most of what users write or sketch. The exceptions are the small set of gestures, words written directly on the canvas in site map view that are interpreted as new page labels, and lines drawn between two pages that are treated as links between those pages.
Users had trouble creating navigational links between pages that they had initially drawn far apart on the canvas.
47
2.8.7 Anecdote
Harada et al. (1996) have developed an authoring system called Anecdote in order to support the early-design phase as well as the whole development process of multimedia applications. Anecdote employs the concept of surrogate media. Surrogate media is a type of media, such as sketches, to represent the content of the media data to be created. It can be used to simulate the execution of the scenario and can serve as the specification of the media data to be created. Anecdote allows authors to edit the different aspects of the scenario using multiple editing views, and helps them to create the final application seamlessly from the prototype scenario. Figure 2.13 shows the screenshots for Anecdote tool.
Figure 2.13: Screenshot for the Anecdote tool
48
2.8.7.1 Advantages of Anecdote
Harada et al. (1996) list down advantages of Anecdote as follows: Table 2.15: Advantages of Anecdote
Advantages Scenario structure Description With Anecdote, the application is constructed as a hierarchy of scenes. An object called group scene can be used to modularize the lower levels of scenes and other group scenes. Each scene represents a state of scenario execution and is defined as a set of slots, which are the place-holders for the media data, or cast members, to be presented. Editing views The Anecdote Storyboarding System provides five editing views, namely the Scene View, Link View, Timeline View, Outline View and Cast View. From within any of the views, authors can choose Play menu to execute the scenario being edited. Authoring process with Authors can create a slot, and then draw sketches and type text Anecdote annotations in order to describe the contents of the cast member.
2.8.7.2 Disadvantages of Anecdote Harada et al. (1996) list down the disadvantages of Anecdote are as below: Problems of current authoring design process. Rigid input format and lack of scenario structuring support Lack of early-stage feedback to meet size limitations
49
2.9
Didactic design in Storyboard
K.-H. Flechsig (1996) has been described didactic design as the anticipation of those communication processes and storyboards may provide the expressive power suitable to the design and implementation of learning processes. According to (Ballstaedt, 1997) didactic design encompasses the development of learning environments from conception to evaluation. Didactic design becomes explicit an issue of quality assurance in e-learning. Currently, e-learning systems as well as learning environments are still suffering from a lack of explicit and adaptable didactic design. Jantke et. al ( 2005 ) has been published an article of Didactic design through storyboarding: standard concepts for standard tools. The authors have proposed a modeling concept for didactic knowledge that content storyboards. In addition, the authors suggested a standard tool to develop and process such models which is Visio.
50
2.10 Data Analysis

Table 2.16 will analyze and compare the features, advantages and disadvantages among Storyboard Tools discussed in the literatures. Table 2.16: Comparisons among Storyboard Tools
Raptivity Easily used with other tools More than 200 interactions Numerous options available Expands capabilities Can easily be embedded into eLearning content Provides a prebuilt library of 200 DEMAIS Designing Content Exploring Behavior Operationalizing Content and Behavior Designs content using the storyboard and narration editors Enables a designer to view multiple storyboards, sketch and narrations A designer sketches behavioral ink strokes between objects or multiview editor Storyboard Tools 1.7.4 Text Web page Springboard MockupScreens 0.91 4.02 Naturalmedia Easy to use vector tools Text and Clickable graphics prototype Layers Experiment interactively Multi-layer model Help in Need no outline the documentation at story first design. Import, copy, paste text and graphics from other applications Add layers to show camera moves and special effect Users can create a usage flow of application on one screen with another Can experiment interactively with clients, and create wireframe of the application DENIM Creating and Editing Pages Zooming Arrows Run Mode Web pages has a label that represents the name page Changing the zoom level Anecdote Scenario structure Editing views
Features
Drawing tool Stores text along with the images. Web page can be generated from the project Has its own drawing tool with specialized features
Authoring process with Anecdote An application as a hierarchy of scenes
Advantages
Maps the available interactions to a variety of ID methodologies
An arrow between two pages represents a relationship
The Anecdote Storyboarding System provides five editing views Authors can create a slot, draw sketches and type text annotations
51
Can create their own interaction models with a unique and simple new tool call MyRaptivity
A designer aperationalizes a design by selecting the play button
Disadvantages
Does not offer a print out records to users. It is only provide the flash file output
The crossplatform use of Raptivity does cause some portability problem
A designer can use the stylus to scribble written notes, but these notes cannot be interpreted by the system. It does not check for consistency among behavior definitions, possibly causing unwanted results It does not provide a designer with a mechanism for adjusting the layer in which sketched content is drawn
Just for filmmakers, directors & storyboard artists
So many buttons not in sequence manner and make a confusing to the users
Use a multilayer model to productively reuse content, and easily edit graphics Users had trouble creating navigational links between pages Some features in springboard 0.91 are unavailable
Because of the experiment interactively, clients will expect that the application is totally finished The buttons on the MockupScreen tools are not organized in the sequence order
Designers can test the interaction with a site without having to create a fullfledged prototype Intended for prototyping in the early stages, not for the creation of finished websites Does not recognize most of what users write or sketch
Problems of current authoring design process
Users had trouble creating navigational links between pages
Rigid input format and lack of scenario structuring support Lack of earlystage feedback to meet size limitations
52
2.11 Conclusion
This chapter is basically done to compare and see the previous system with the storyboard system which is the current system that has to build. Mostly the systems that have been compared are having a difference in kind of features, advantages and disadvantages. Based on this comparison and literature review, more features can be added to the storyboard system in order to make it more efficient, flexible and easy to use.
53
3. Research Methodology and Requirements Gathering

3.1 Introduction
This chapter describes the research methodology used in detail. The research for this research project is divided into two parts; the first part involves one to one evaluation which is interview and the second part is distributed questionnaires to gather data from the participants in Multimedia Production Unit (MPU). As the main objective of the research project is to determine whether the storyboard system could be used to expedite storyboard content in E-learning.
3.2 Interview
3.2.1 Introduction Interview is used as the main instrument in researching this research project. It is a direct way of getting the required information and interviewees could be probe further into giving out details. Interview is also an excellent method to obtain tacit information, sincere opinions and point of views in an impulsive and immediate manner. 3.2.2 Background of the interview The interviews were conducted at IDs work premise. That venue was chosen at the request of the IDs as most of their materials and documentations are kept at their office. On top of that the researcher was also able to take advantage to conduct minor first hand observation into the working process of conducting storyboards.
54
3.2.3
Interview Objectives
The objectives of the interview were as follows: To validate the findings from the literature review based on the IDs professional experience To get insight on the storyboarding template To validate the analysis documents Interview questions organization The interview questions were divided into three sections; Instructional Designers background, storyboarding process in e-learning and collaboration procedures. The first section (Instructional Designers background) looked into the background of the interviewee and was meant to establish the interviewee credibility as an ID. The criteria of the background such as years of experience, academic qualifications and professional resume. The second section (storyboarding process in e-learning) tried to get an in depth understanding of the organizations working process in creating the content of the storyboard. The final section is on collaboration procedures. The questions here were designed to get an understanding on how the organization manages the collaboration effort between all parties that are involved in content storyboard. The interview question can be seen at appendix.
3.2.4
55
3.2.5
Interview findings on Section A (Instructional Designers background)
Name: Melor A. Rahman Position: Instructional Designer Company /Cost center: Multimedia Production Unit
Question 1: How many years of experience do you have as an ID? From the interview conducted, it was found that the IDs have 5 years of professional experience in the field of instructional design. With experience come wisdom and the amount of years that has been put in by the interviewee show that she is very well versed in the subject of instructional design. Question 2: What qualifications do you posses to quantify you as a credible ID? The interviewee holds a BMM Multimedia Innovation and attended workshop for Instructional Design Theory and Practical. This also means that the interviewee has the necessary theoretical foundation on education learning theories. Question 3: How many instructional design project have you successfully commissioned? The interviewee has successfully commissioned more than 6 projects for various industries such as government departments, institutions of higher learning and corporate banking as well. This proves that the interviewee has both
56
the theoretical and the practical knowledge on applying the instructional design
knowledge. Question 4: Have you conducted any training on Instructional Design? The interviewee also often conducts instructional design workshops. Being able to conduct training means that the IDs are able to transfer their knowledge onto others and this capability is particularly useful as it shows that the interviewee will be able to pass on their knowledge onto this research. 3.2.6 Interview findings on Section B (storyboarding process in e-learning) Question 1: Does your organization have a clear guideline on content writing? Like most established firms dealing with e-learning content development, the interviewee belonged to an organization that has proper development process in place. Therefore, guidelines in content creation have also been established within the organization and put in place to ensure speedy development process and minimize faulty output. Question 2: How does your storyboard template look like? Storyboard template is design to suit the organization needs. Figure 3.1 shows the storyboard template from the interviewee.
57
Figure 3.1: Components of storyboard Question 3: What is the organization of your storyboard like? Do you adopt the LO/SCO approach? Each storyboard produced usually represents one Sharable Content Object (SCO). The storyboard contents audio/voice over column, screen area (for the content) and instruction for the developers. SCO titles and number also includes in the storyboard. Question 4: Are your implementation team able to understand the storyboard in order to develop the multimedia content? Most of the team members have undergone orientation or hands-on training in the organization content development process. The training includes the storyboard format so that they become familiar with the content structure.
58
Question 5: What tools do you normally use to create content storyboard? Do
find these tools to be practical? Simple and easy that only uses words or power point. Its easy for the SME that requires minimal computer skills to do it. The SME will provide the content and materials then ID will assist to make the interactivity and insert multimedia elements in the storyboard before the ID pass the storyboards to the developers. Discussion with SME is important to make sure learning process take place with the assistance of animation and audio. All multimedia inserted must serve the purpose. Question 6: Could you recommend the storyboard template design for the application? No specific template to recommend but a storyboard template must have a flexibility that can amend according to their needs and to suit the learning theory used for that particular courseware. Ex. Behaviorism learning approach may have different template from constructivism approach. Question 7: Even after you have been doing ID for years, do you agree that once in a while Storyboard Designer (SME) do need to be reminded on how to write content? The interviewee had adequate practice in writing content to the extent that the process has become a natural process in the work. The interviewee need
59
reminders on how to write unless the interviewee is taken out of the job scope for
a long period of time. 3.2.7 Interview findings on Section C (collaboration procedures) Question 1: How people are usually involved in the storyboarding process? There are only ID and SME that are currently active that will involved in content storyboarding. The other team members such as graphic designers, animators and programmers are usually called for opinions and consultation only when they feel the need arise. Otherwise the rest of the team member only gets hold the storyboard when it is deemed ready for the production. Question2: What are exact roles of the people who involved in the storyboarding process? All of the storyboard team members have their own roles in develop the storyboard content. Question 3: How do you manage the collaboration effort between all the parties? Collaborating between all parties involved in the development of storyboard is not easy. Meetings and ad-hoc discussions are the methods of getting all the team members to get together and discuss certain raising issues. However, there are certain of team members not able to come during the meetings due to a clash of timing between team members.
60
Matters are worse should external parties are involved in the content
project. Projects are often delayed or stretched because of the inability to conduct meetings due to differences in work schedule. Question 4: How would you recommend the collaboration platform be designed? A suggestion was made for the platform to be similar to the online forum concept. This way team members express their views and have their comments documented on the platform without having to wait to the others to be present at the same time. Question 5: Do you agree that dealing with clients or SME is one of the most challenging tasks of an ID? A resounding yes was the response given by the interviewee. Question 6: Do the SME understand the instruction? A resounding yes was the response given by the interviewee. Question 7: Do SME know what to do during the practice and tests? Not involve with the practice and test. Question 8: Can SME interpret graphics in the text? A resounding no was the response given by the interviewee.
61
Question 9: Can the SME read all of the textual materials (i.e. the Storyboard
Manuals)? A resounding yes was the response given by the interviewee. Question 10: Do SME, Reviewer and Proof Reader aware of the datelines of the Storyboard contents? The ID will always be their reminder to aware of the datelines in the storyboard contents. 3.2.8 Summarization of Interview Findings Data collected from the interviews showed a correlation with the findings from the literature review. Therefore the data that were used to construct the system requirements can be assumed as correct and fits the end user requirements.
62
3.3 Questionnaires
3.3.1
Instrumentation To gauge the applications of De-Elss, a set of questionnaire has been distributed
to a group of ID, Graphic Designer and Multimedia Programmer at Multimedia Production Unit (MPU) which consists of 9 people, which located at FCM building of MMU. To document their views, a quantitative approach was used. Questionnaire was the chosen instrument for data collection and SPSS was used to analyze the collected data. 3.3.2 Background of IDs group The ID, Graphic Designer and Multimedia Programmer who participates in this project were of a professional background and from degree and diploma graduated. The groups were selected to improve the application of De-Elss system on storyboard development process for effective use in e-learning. 3.3.3 Questionnaires Objectives
The objectives of the survey were as follows: To determine if the application was useful in helping IDs to monitor storyboard development process. To determine if the De-Elss system could help the turnaround time to generate content storyboard. To get opinion on how to enhance the application for better use in E-learning.
63
3.3.4
Questionnaires Organization
The survey questionnaires have been divided into two sections; Participants Background and Assessment on application usage. The first section (Participants Background) was intended to get an idea of the participants background with regards to their knowledge in E-learning and their IT Proficiency level. This part also contains their experiences in e-learning. The second section (Assessment on Application Usage) is aimed to get the participants opinion on the application of storyboard in e-learning. The questions were categorized into 4 sub-sections; Application functionality Questions were designed to capture the participants level of comfort or the participants experience with the application. Answers are based on a five point likert scales where 1 denotes strongly disagree and 5 denotes a strongly Agree. Collaboration Questions were design in these questionnaires to gauge the usefulness of the collaboration platform provided by the application. Answers are based on a five point likert scales where 1 denotes strongly disagree and 5 denotes a strongly Agree. Opinion Opinion is intended in this questionnaire to obtain opinion from the participants regarding the future storyboard system. Answers are based on a five point likert scales where 1 denotes strongly disagree and 5 denotes a strongly Agree.
64
Open ended question
The questionnaires are aimed to get feedback and comments from participants regarding the application and how to improve the applications functionality and usability. The questionnaires can be seen in the appendix.
3.4 Data Analysis

The results of the questionnaires will answer the research question in Chapter 1 and to determine the research objective that has been met. The following results of the questionnaires findings will be discussed below: 3.4.1 Total Questionnaires Participants
Figure 3.2: Total Questionnaire Participants Figure 3.2 above show the total number of the participants from Multimedia Production Unit (MPU). In total, there are nine participants that participate in this questionnaire. From this figure, only one is Instructional Designer. The rest are made up of seven participants from Graphic Designers and one from the multimedia programmer.
65
3.4.2
Participants Background
From this result, shows that most of the participants have 5 to 10 years experiences followed by two persons have 2 - 5 experiences and other two persons have more than 10 years.
Figure 3.3: How many years of experience do you have in relation to the job scope stated above? Out of the nine participants, only one person obtain none education level. Two persons are from degree level and the rest are from diploma level.
Figure 3.4: What is your highest tertiary education level?

66
In terms of IT Proficiency level, almost all of the participants have been using
the computer for more than 10 years, and has been surfing the World Wide Web for more than 5 years. (See table 3.1 and 3.2) Table 3.1: Participants number of years using the computer.
Frequency Valid 5-10 years > 10 years Total 3 6 9 Percent 33.3 66.7 100.0 Valid Percent 33.3 66.7 100.0 Cumulative Percent 33.3 100.0
33.3% of the participants had been using the computer for 5 to10 years. The rest of participants had more than 10 years experiences using the computer. This shows that participants should have no problems in operating the computer. Table 3.2: Participants number of years surfing the internet.
Frequency Valid 5-10 years > 10 years Total 5 4 9 Percent 55.6 44.4 100.0 Valid Percent 55.6 44.4 100.0 Cumulative Percent 55.6 100.0
Out of the 9 participants, 55.6% had 5 to 10 years experience surfing the World Wide Web while the other had more than 10 years worth. With that kind experience explore to the internet, all the participants were assumed to be professional with through navigating the internet by using a typical web browser.
67
3.4.3
Application Functionality
The results below show that on how participants answer the likert scales of application functionality. Table 3.3: The participants feedback on communication between team members. The application makes it easier to facilitate communication between team members.
Frequency Valid strongly disagree disagree average strongly agree Total 1 1 3 4 9 Percent 11.1 11.1 33.3 44.4 100.0 Valid Percent 11.1 11.1 33.3 44.4 100.0 Cumulative Percent 11.1 22.2 55.6 100.0
The results in table 3.3 shows that most of the participants are strongly agree with the application that makes communication easier between team members. Only 11.1% of the participants show that strongly disagree and disagree. Based on the statistics in table 3.4, a huge majority of the participants understand the content of the storyboard that has developed by SME. Only 1 person shows strongly disagree and agree in understanding the content of the storyboard.
68
Table 3.4: Participants feedback on content of the storyboard.
Do you understand the content of the storyboard that has developed by SME?
Frequency Valid strongly disagree disagree average agree Total 1 1 5 2 9 Percent 11.1 11.1 55.6 22.2 100.0 Valid Percent 11.1 11.1 55.6 22.2 100.0 Cumulative Percent 11.1 22.2 77.8 100.0
The existing storyboard that has been used by the MPU unit comes out with word or power point output. However, as shown in table 3.5, 55.6% of the participants averaged followed by 22.2% of the participants agreed with the output produce in word/power point. The rest of the participants are strongly disagreed and disagreed. Table 3.5: Participants feedback on output produces. The format used in the word/ power point output is easily understandable by the multimedia development team.
Frequency Valid disagree average agree strongly agree Total 1 2 5 1 9 Percent 11.1 22.2 55.6 11.1 100.0 Valid Percent 11.1 22.2 55.6 11.1 100.0 Cumulative Percent 11.1 33.3 88.9 100.0
69
Table 3.6 shows that 66.7% of the participants agreed with SWF files are easy to
develop. The rest of the participants show the same percentage with 11.1% in strongly disagreed averaged and strongly agreed. Table 3.6: Participants feedback on content template storyboarding. The SWF file is easy to develop based on understanding of the storyboard template.
Frequency Valid strongly disagree average agree strongly agree Total 1 1 6 1 9 Percent 11.1 11.1 66.7 11.1 100.0 Valid Percent 11.1 11.1 66.7 11.1 100.0 Cumulative Percent 11.1 22.2 88.9 100.0
With Participants feedback on various components in table 3.7, only 11.1% were unsure if the application had made them aware of intended in e-learning. A majority of the participants found that the application does help them in e-learning with 66.7% participants agreed to this term while another 22.2% average to it.
70
Table 3.7: Participants feedback on various components.
Does the application make you aware of the various components of the intended Elearning?
Frequency Valid strongly disagree average agree Total 1 2 6 9 Percent 11.1 22.2 66.7 100.0 Valid Percent 11.1 22.2 66.7 100.0 Cumulative Percent 11.1 33.3 100.0
The result in table 3.8 shows that most of the participants agreed with the application were easy to use in navigating through the content of storyboard in elearning. Only 1 person shows strongly disagree with the application. Table 3.8: Participants feedback on application ease of use. Overall, do you think the application was easy to use?
Frequency Valid strongly disagree average agree strongly agree Total 1 2 4 2 9 Percent 11.1 22.2 44.4 22.2 100.0 Valid Percent 11.1 22.2 44.4 22.2 100.0 Cumulative Percent 11.1 33.3 77.8 100.0
71
3.4.4
Collaboration
The results in this section show the usefulness and the effectiveness of the collaboration. In addition, this section will looks at the impact of the collaboration had on the participants. The main purpose of the application is to assists SMEs to develop content storyboard independently while being monitored by the IDs. The following table 3.9 shows that 33.3% of the participants agreed and strongly agreed. The rest of the participants were strongly disagreeing and disagree with 11.1% of it. Table 3.9: Participants feedback on dealing with clients or SME. Do you agree that dealing with clients or SME is one of the most challenging tasks of an ID?
Frequency Valid strongly disagree disagree average agree strongly agree Total 1 1 1 3 3 9 Percent 11.1 11.1 11.1 33.3 33.3 100.0 Valid Percent 11.1 11.1 11.1 33.3 33.3 100.0 Cumulative Percent 11.1 22.2 33.3 66.7 100.0
All of the participants were expected that SME will understand the instruction. The table 3.10 below shows that the majority of the participants averaged with it while the others obtain 22.2% agreed and 11.1% disagree.
72
Table 3.10: Participants feedback on understanding of SME.
Do the SME understand the instruction?

Frequency Valid disagree average agree Total 1 6 2 9 Percent 11.1 66.7 22.2 100.0 Valid Percent 11.1 66.7 22.2 100.0 Cumulative Percent 11.1 77.8 100.0
In terms of the participants feedback on practice and test by SME, the table 3.11 shows that 88.9% participants averaged followed by 11.1% disagreed to this term as well. Table 3.11: Participants feedback on practice and tests by SME. Do the SME know what to do during the practice and tests?
Frequency Valid disagree average Total 1 8 9 Percent 11.1 88.9 100.0 Valid Percent 11.1 88.9 100.0 Cumulative Percent 11.1 100.0
Table 3.12 shows the majority of the participants averaged with the awareness of the dateline of the storyboard contents. The rest of the participants with 22.2% agreed and 11.1% strongly disagreed.
73
Table 3.12: Participants feedback on dateline of the storyboard.
Do SME, Reviewer and Proof Reader aware of the dateline of the Storyboard contents?
Frequency Valid strongly disagree average agree Total 1 6 2 9 Percent 11.1 66.7 22.2 100.0 Valid Percent 11.1 66.7 22.2 100.0 Cumulative Percent 11.1 77.8 100.0
3.4.5
Opinion In this section, opinion from the participants shows in the following table. Table
3.13 shows 44.4% of the participants agreed that the application could reduce the storyboarding lifecycle. 11.1% of the participants were strongly disagreed, averaged and strongly agreed with it. Other 22.2% is disagreed on this term as well.
74
Table 3.13: Participants feedback on production turnaround time.
Do you think using the application could reduce the amount of time it usually takes to produce content storyboards?
When the participants were asked if they would consider using the application will be able to lower the cost of content production, 33.3% of the participants agreed as shown in the table 3.14. The same percentage of 22.1% gave disagreed and averaged. Other 11.1% of the participants gave strongly disagreed and agreed to this term as well.
75
Table 3.14: Participants feedback on production costs.
Do you think such an application will be able to lower the cost of content production?
Table 3.15 below shows that a huge majority (33.3%) of the participants consider using this application in their professional work. The rest of the application shows the same percent with 22.2% disagreed, averaged and strongly disagreed with it. Table 3.15: Participants feedback on using the application at work. Would you consider using this application in your professional work?
Frequency Valid disagree average agree strongly agree Total 2 2 3 2 9 Percent 22.2 22.2 33.3 22.2 100.0 Valid Percent 22.2 22.2 33.3 22.2 100.0 Cumulative Percent 22.2 44.4 77.8 100.0
76
The table 3.16 shows that 44.4% of the participants strongly agreed with
recommending this application to other organization. This shows that the participants were confidence with this application. Table 3.16: Participants feedback on recommending the application Would you recommend this application to other organization?
Frequency Valid disagree average strongly agree Total 2 3 4 9 Percent 22.2 33.3 44.4 100.0 Valid Percent 22.2 33.3 44.4 100.0 Cumulative Percent 22.2 55.6 100.0
Figure 3.5: Participants overall rating of this application. Figure 3.5 above show the overall participants rate this application. Out of 9 participants, only 1 participants rate the application is very bad. The rest of the participants rate moderate while 3 persons rate good. This is another strong indication of the usefulness and effectiveness in helping participants to create storyboard in elearning.
77
3.4.6
Open ended Question
This open ended question allows the participants to give feedback on recommendation and comments on this application. After analyzing the questionnaires, the following recommendation given by the participants were thought to help the application functionality and usability further. 1. One recommendation given was for the application to provide a sharing system to share documents amongst each other. 2. The application should offer diagram to suit the learning concept. 3. The date for dateline should include in the application. The participants are also asked to give comments on the application. Comments are important in the questionnaire to get a general feedback and reaction from the participants towards the application. However, there are no comments by the participants.
78
3.5 Summary of Findings
The results of findings could be summarized as follows: 1. The application helps to facilitate communication between team members. 2. The application does help the storyboarding life cycle in e-learning. 3. The application was easy to use. 4. The ID will be able to monitor SME effectively. 5. The application could reduce the turnaround time of the storyboard development process. 6. The application can be use professionally at work and many would recommend the application to other organizations. 7. Application need to have sharing system to share documents amongst each other.
79
4. System Architecture
4.1 Executive Summary
This project is pleased to develop a storyboard system for enhancing learning task in e-learning. This storyboard system has to be reliable, scaleable, efficient and easy to use. Developer team will be responsible for the development of the system which includes requirement gathering from all parties, planning, designing, implementing, managing, delivering, integrating, testing, maintaining, as well as providing consultation for the system. A storyboard system is a storyboard tools that help ID to edit and do the sketches for e-learning by using this tools in order to fulfill the SME requirements. Such advantages are possible as the system will demonstrate the following features: Short learning curve for users Reliable and efficient system Scalable and portable system Robust functionality Ease of maintenance On-time and on-budget implementation
80
4.2 System Analysis
4.2.1
Requirement Specification A storyboard system for enhancing learning task in e-learning has the capability
in helping SME, ID, Reviewer and Proof Read in doing their tasks for e-learning. The tasks are classified into roles which the user is being assigned to. Four roles exist in the system. They are SME, ID, Reviewer and Proof Read. The SME is able to give the material of the subject to the ID. Besides that, they also able to create storyboard content, participate in comment between ID, Reviewer and Proof Read and also re-arrange the storyboard content. The ID is able to initiate storyboard content, create storyboard content and participate in comment between SME, ID, Reviewer and Proof Read. The Reviewer also known as Expert than Expert or moderator can use this storyboard tools in order to test it. They also can view storyboard and give a feedback or comment to Instructional Designer and SME to edit back the contents. The last roles exist in this storyboard system is Proof Read. Task of the proof read is to do a checking for all the system and then give a comment about all the flow and contents of the system.
81
4.3 System Design
4.3.1 Use Case A use case is a methodology used in system design to identify, clarify, and organize system requirements. The use case technique is used to capture a system's behavioral requirements by detailing scenario-driven threads through the functional requirements. Below are the use cases for storyboard tools.
Figure 4.1: Use case for Instructional Designer (ID) This diagram shows the behavior or functionality of a system which is consists of a set of possible sequences of interactions between a system and an ID in a particular environment that is related to a particular goal. What ID can do to the system is login into the system, edit profile, change password, review analysis documents, review storyboard, submit reminder, and add comments and logout from the system.
82
Figure 4.2: Use case for Subject Matter Expert (SME) This diagram shows the behavior or functionality of a system which is consists of a set of possible sequences of interactions between a system and Subject Matter Experts in a particular environment that is related to a particular goal. What Subject Matter Experts can do to the system is login into the system, edit profile, change the password, create analysis documents, create storyboard, and add comments and logout from the system.
Figure 4.3: Use case for Reviewer

83
This diagram shows the behavior or functionality of a system which is consists of
a set of possible sequences of interactions between a system and Reviewer in a particular environment that is related to a particular goal. What Reviewer can do to the system is login into the system, edit profile, change password, view analysis documents, view storyboard, and add comments and logout from the system.
Figure 4.4: Use case for Proof Read This diagram shows the behavior or functionality of a system which is consists of a set of possible sequences of interactions between a system and Proof Read in a particular environment that is related to a particular goal. What Proof Read can do to the system is login into the system, edit profile, change password, view analysis documents, view storyboard, and add comments and logout from the system.
84
Figure 4.5: Use case for Administrator Figure 4.5 shows the behavior or functionality of a system which is consists of a set of possible sequences of interactions between a system and Administrator in a particular environment that is related to a particular goal. What Administrator can do to the system is login into the system, add users, view users, delete users and logout.
85
4.3.2 Activity Diagram for a Storyboard System
Figure 4.6: Activity Diagram for a Storyboard System (modified Standard Operating Procedure (SOP) for IBDP Content Development)
86
4.3.3 Analytical Model (Class Diagram)
Figure 4.7: Class Diagram for a Storyboard System

87
4.3.4 Analytical Model Explanation
This storyboard system consists of five classes namely Instructional Designer, Subject Matter Expert, Reviewer, Proof Read and Administrator. The main class of this system is the Instructional Designer class which is focus on doing more tasks than others. The ID class represents eight functions. The functions of this class were login, edit profile, change password, review analysis document, review storyboard, submit reminder, and add comment and logout. The SME class deals with instructional designer where they have to work together to complete the process of system architecture. Each SME have to login, edit profile, change password, create analysis document, create storyboard, and add comments and logout. The Administrator class handles all actions or tasks performed by administrator itself. The actions include login, add user, view user, delete user, and logout. The Review class represents five functions which is login, edit profile, change password, view analysis document, view storyboard, and add comments and logout. The review class will deal with proof read class. The Proof Read class provides a login, edit profile, change password, view analysis document, view storyboard, and add comments and logout.
88
4.3.5 Design Model : Sequence Diagram

Figure 4.8: Sequence Diagram for a Storyboard System
89
4.3.6 Design Model Explanation
The sequence diagram shows the interactions among the various classes in the storyboard system. Firstly the users has to login into the system after the admin register their username and password. Subject Matter Expert then can edit their profile, change their password, create an analysis documents, create storyboard and add comments before they logout. Instructional Designer then tries to review analysis document that had been done by the SME. They also can edit profile, change password, review storyboard, submit reminder and add comments. Reviewer then can view analysis document, view storyboard and add comments. Proof Read then can edit profile, change password, view analysis, view storyboard and add comments.
90
4.3.7 System Architecture for a Storyboard System
Figure 4.9: System Architecture for Storyboard System
91
4.3.8 System Architecture Explanation
The diagram above (figure 4.9) shows the overview of the system architecture for storyboard system. It also shows five groups of users. They are the main users that will be using this system to create the content for storyboard. The users that have been mention above are: 1. Instructional Designer The Instructional Designer provides overview of development project tasks. They will review the analysis document and review the storyboard before they submit the reminder to SME. 2. Subject Matter Experts The SME are able to transcribe their tacit knowledge into an explicit form. They also work with ID to meet project schedule. Besides that, SME also will decide how the learning process will be handled, review and provide feedback about script or storyboards and gather feedback from other content reviewers if needed. 3. Review The Review will help in doing a review on storyboard then submit it to Proof Read. 4. Proof Read The Proof Read will help in give a comment after the reviewer review and submit storyboard to them. They will give a comment on the language and check the grammar.
92
5. Administrator
The Administrator are able on login, add users, view users, delete users and logout. The content of the storyboard data then will save and store in the database.
4.4 User Interface Design

4.4.1 Overview The storyboard system interface is designed as a tools application. This storyboard system was developing in order to enhance and implement e-learning in MMLS to be efficiently. It is also help in assist the learning task for storyboard
designers, instructional designers and reviewer to do their jobs. This tools application can be run on a Windows system. 4.4.2 Web Design Tools Web design tools such as Adobe Dreamweaver are used to create the system. This tool provides a design and code editor in one tool. It also allows easy addition of elements onto web pages and made creating interactive rollover images possible within a few clicks. Other tool that is used in the development is Adobe Photoshop. It is used to create icons and graphics to enhance the outlook of the system. The main tool that will be used to develop this storyboard system is the wamp and MySQL. Wamp is a packages of independently-created programs installed on computers that use a Microsoft
93
Windows operating system while MySQL is a relational database management system
(RDBMS) that runs as a server providing multi-user access to a number of databases .
4.4.3
Difficulties Encountered And Solution Applied At first, the storyboard system is built on Visual Basic .NET. However, it has a
downside in using this tool. The downside to Visual Basic .NET is the framework must be installed and its becoming a default install on servers. Besides that, the language is never going to be quite as quick as something that made in C/C++. The applications also working on windows operating system and it also required more memory space to install because of the graphical components that need more space. Because of the difficulties encountered, the implementation of this storyboard system will used an Adobe Dreamweaver and Wamp that include a phpmyadmin. However, with Adobe Dreamweaver and phpmyadmin, it enhances the application functionality and improves developer productivity; include easier design integration, expanded deployment options, and better data access and synchronization.
94
4.4.4
Project Management Methodology
Figure 4.10: Gantt chart for Phase 1
95
Figure 4.11: Gantt chart for Phase 2
96
4.4.5
Difficulties Encountered
The difficulties encountered during the development of the entire system include the following: 1. Learning goals cannot be identified in advance 2. No particular goals of developing storyboard contents are identified to the SME 3. Short development time given 4. Lack of communication between IDs and SMEs 4.4.6 Solution for Difficulties Encountered for the Above Matter
The following cite the resolution taken to overcome the difficulties encountered: 1. Because of the goal cannot be identified, SMEs should attend a training and briefing and thus will make them able to identify the purpose of developing storyboard contents for e-Learning. 2. Standardize the principles and procedures so that SME can comply with it to meet the datelines of storyboard submission. 3. Every member in the team put in the extra effort to ensure that all the deliverables are handed in on time. 4. Multiple meeting between ID and SME is made to ensure that the critical areas of the system are captured.
97
4.4.7
Project Development Team
The development team for this storyboard system consists of two members who are currently undergraduates belonging to the Multimedia University. All the members are currently majoring in Multimedia Technology Management. The roles played by each individual member during implementation are cited below:
Programmer
1. Nur Farhana Bt Ahmad Deman Huri 2. Zarith Roshahiva Bt Kushairi
Data Architecture Coordinator User Interface Designer
1. Nur Farhana Bt Ahmad Deman Huri 1. Nur Farhana Bt Ahmad Deman Huri 2. Zarith Roshahiva Bt Kushairi
Documentation/Report
1. Nur Farhana Bt Ahmad Deman Huri 2. Zarith Roshahiva Bt Kushairi
System Analysis
1. Zarith Roshahiva Bt Kushairi
98
5. System Application
5.1 Functionality of the system
System is a set of detailed methods, procedures, and routines established or formulated to carry out a specific activity, perform a duty or solve a problem. Functionality is the actions or operations, capabilities and usefulness of something such as a software application. This sub chapter is detailed out the functionality of the De-Elss system as well as explains the function that is included in the De-Elss. The functions that want to be discuss here is for SME function, storyboard function and admin function. In this system application, Subject Matter Expert is one of the main users among others. SME will use the storyboard function in order to insert the content of the learning object. They have to insert the correct content in the template so that the learners will understand what they try to explain. Admin also is the main character in this system application. Admin will give a username and password to those members that is involve in the creating a storyboard content. They are also able to view, edit or delete the members.
99
5.2 Screenshots of the system
5.2.1 Login Screen
Figure 5.1: Index page This is the first page of the system. There are four button displays in the index page which SME, ID, Proof Read and Reviewer. The users should click on the right button before they can proceed to the next step.
Figure 5.2: SME login page

100
Figure 5.2 is the page for SME to login. They are required to login in order to use
the application. The username and password are created by the system administrator and they will be able to change their password once they have logged in.
Figure 5.3: SME Main page Upon successful login, SME will be taken to the main screen (Figure 5.3) which will display the application menu on the upper side. The visibility of the function that is available on the application menu is home, profile setting, analysis document, storyboard and logout.
101
Figure 5.4: Reviewer Login page The figure above shows the Reviewer login page. Reviewer need to login in order to use this system application.
Figure 5.5: Reviewer Main page Upon successful login, Reviewer will go to the main page as shown in figure above.
102
Figure 5.6: Proof Read Login page Figure 5.6 above shows the login page for the Proof Read. Upon successfully login, they will be taken to the main page as shown in figure 5.7.
Figure 5.7: Proof Read Main page
103
5.2.2 Storyboard Screen
Figure 5.8: SME Edit Profile page Figure 5.8 above shows a SME Edit Profile page. SME are able to edit their profile once they have login successfully.
Figure 5.9: SME Change Password page The figure above shows the SME Change Password page. After edit the profile, SME also able to changed their password from old password to the new password.
104
Figure 5.10: Analysis Documents page This is the Analysis Documents (content template) page. This page could only be initiated by a SME only. After it has been initiated, the system will provide the content template as shown in figure 5.10 for SME to fill.
Figure 5.11: View Analysis Documents page By clicking on the submit button (as shown in Figure 5.10), the system will display or view the details of the content template that have been filled before this in the Analysis Documents (as shown in Figure 5.11).
105
Figure 5.12: Add Screen page Figure 5.12 above shows the Add Screen page for the storyboard function. SME need to fill the storyboard where the actual content or knowledge is being presented to the learner.
5.2.3 Admin Screen
Figure 5.13: Admin Login page Figure 5.13 shows an Admin Login page. Admin have to login in order to view the users or members that use this system application.
106
Figure 5.14: Admin Main page This is the main page of admin after they have successfully login.
Figure 5.15: View SME members page Admin are able to click on the view SME and view the members that use the system.
107
6. Testing/Evaluation of Findings
6.1 Introduction
This chapter aims to test the system, evaluate and present the results of the survey findings on the application review by the sample group of users. The result of the survey will answer the research question posted in Chapter 1 and help determine if the research objectives has been met. The major part tested was login part for users, analysis document and storyboard content.
6.2
System Test
Human beings are susceptible to making mistakes. Even with the use of the
most meticulous and sophisticated application design approach, erroneous results can never be avoided (Ghezzi, Jazayeri & Mandrioli, 1991). Therefore, the final product must always be verified to ensure its usability and functions acts accordingly against the intended requirement. An application that has undergone a system test will garner greater user confidence in the systems quality and reliability. It also gives the assurance that the system has met it expectation and able to produce its desired outcome. Therefore, the content storyboard application was tested on its systems functionality. Functional tests are conducted to ensure the functional feature provided by the application works in a manner that it is suppose to (Wan Hassan, W.A.R, 2007).
108
6.3
Functional Test Design
The goal of functional testing is to prove that the software performs in conformance with its specification and specific requirements. In order to prove this functional testing, the black box method was used. By using this method, it takes an external perspective of the test object to derive test cases. These tests can be functional or non-functional, though usually functional. The test designer selects valid and invalid inputs and determines the correct output. There is no knowledge of the test object's internal structure (Black box testing, 2010). The black box methods allows test case to be derived from the requirements specifications. Each modules functionality was tested with regards to its specifications (requirements) and its context (events). The output was then checked for its correctness (Wan Hassan, W.A.R, 2007).
6.4
Test Result
The final result of the application functional test results are shown in Table 3.17
below. It was based on the aggregated results taken from assessor. Table 6.1: Test results of User Access module functionality.
Functionality To ensure access to authorized user To deny access to unauthorized user To terminate user session upon logout Pass Fail
109
Table 6.2: Test results of User Management module functionality.
Functionality Login Create new user Delete existing users Display list of existing application users Logout
Pass
Fail
Table 6.3: Test results of Instructional Design module functionality.

Functionality Login Edit Profile Change Password Review Analysis Doc Review Storyboard Submit Reminder Add Comments Logout Pass Fail
Table 6.4: Test results of Subject Matter Expert module functionality.

Functionality Login Edit Profile Change Password Create Analysis Doc Create Storyboard Add Comments Logout Pass Fail
110
Table 6.5: Test results of Reviewer module functionality.
Functionality Login Edit Profile Change Password View Analysis Doc View Storyboard Add Comments Logout
Pass
Fail
Table 6.6: Test results of Proof Read module functionality.

Functionality Login Edit Profile Change Password View Analysis Doc View Storyboard Add Comments Logout Pass Fail
6.5
Problem encountered
Since we are lacking in knowledge of PHP and some other software, we are
not able to apply extra features into this system application. We believe we had tried our best to develop this project and applied all that we had learnt during our study in this university.
111
6.6
Limitations
Each system implemented will definitely have some problems in it. Our system is not left out in this substance regarding the problems that occur during our implementation of the system. At this juncture we address some of the matters that have been bothering us while we carry out our system. But still we have to figure out the solution to the problems occur. We appreciate our supervisor who gave us suggestions and comments for us to add interactive elements into this project. The system we developed only able to perform basic function such as login, analysis document and storyboard. Essentially, in order to focus on the system implementation we have to balance out our work and maintain our group works for example PHP, Adobe Dreamweaver, MySQL, and Rational Rose. We learn and study it by ourselves and sometimes ask friends on how it can be adapted to our system. In this system we used numerous coding to make sure the system works and has security.
112
6.7
Future Enhancement
For future enhancements, we would like to make a view or display part to be display in .PDF format or .doc format and it also can be print out from the format. We also would like to enhance the interface of the system and make it more attractive, interesting and easy to use and valuable for everybody that uses this system.
113
7. Conclusion
This study aimed to develop an effective system for assisting the SME to construct E-learning that will improve an existing E-learning development process. The E-learning Storyboard System (De-ELSS) will develop to improve the communication issues between SME and ID. It also could improve the low fidelity prototyping from the sketch based which previously applied the traditional method. This system proposed a high fidelity prototyping that are fully interactive, simulating much of the functionality in the storyboard. For example, users can operate on the prototype, or even perform some real tasks in De-ELSS. This study contributes to the development of storyboard in E-learning system in Multimedia University and towards the e-learning industry in Malaysia. The e-Learning Storyboard System follows the set of competencies for instructional designers developed by International Board of Standards for Training, Performance, and Instruction (IBSTPI) (Smith and Ragan, 2005). The system also incorporates the ethical guideline provided by the Ministry of Higher Education Malaysia (MOHE) which focuses on commitments to students and to the profession of education.
114
REFERENCES
[1] Andrews, D. H., and Goodson L.A (1980). A Comparative Analysis of Models of Instructional Design. Journal of Instructional Development, 11 (3). Pp 2-16. [2] Andy Lock Yen Lowa; Kevin Lock Teng Lowb; Voon Chet Koo (2003). Multimedia Learning Systems: a Future Interactive Educational Tool. The Internet and Higher Education 6. pp2540 [3] Bailey, B.P, Konstan, J.A., and Carlis, J.V. (2001) DEMAIS: Designing Multimedia Applications with Interactive Storyboards. In the Proceedings of the Ninth ACM International Conference on Multimedia, (September 30-October 5, Ottawa, Canada), 2001, pp. 241-250. [4] Barron, B (2000). Problem solving in video-based microworlds: Collaborative and Individual Outcomes of High-Achieving Sixth-grade Students. Journal of Educational Psychology, 92(2), 391398. [5] Brandon, B., (2004). Storyboards tailored to you: Do-it-yourself magic arrows. The E-learning Developers Journal. Retrieved on 10th October 2009 from the World Wide Web: http://www.elearningguild.com/pdf/2/050304des.pdf [6] Discroll, M.P (2000). Psychology of Learning for Instruction (2nd) Needham Heights, M.A: Allyn & Bacon. [7] Gustafson, K.L and Branch, R.M.(1997). Survey of Instructional Development Models. (3rd Ed). Syracuse: ERIC Clearinghouse on Information and Technology. IR-103
115
[8]
Jantke, K. P. and Knauf, R. (2005). 2005. Didactic Design Through
Storyboarding: Standard Concepts for Standard Tools. In Proceedings of the 4th international Symposium on information and Communication Technologies (Cape Town, South Africa, January 03 - 06, 2005). ACM International Conference Proceeding Series, vol. 92. Trinity College Dublin, 20-25. [9] [10] K.-H. Flechsig (1996) Kleines Handbuch didaktischer Modelle. Neuland, 1996. Knauf, R., Sakurai, Y., Dohi, S., Tsuruta, S., Gonzalez, A. (2007). Toward making didactics a subject of knowledge engineering. In Seventh IEEE International Conference on Advanced Learning Technologies Nigata: Japan (pp. 788792).Madsen & Aiken (1991) [11] Landay, J. A. and Myers, B. A. 1996. Sketching storyboards to illustrate interface behaviors. In Conference Companion on Human Factors in Computing Systems: Common Ground (Vancouver, British Columbia, Canada, April 13 18, 1996). M. J. Tauber, Ed. CHI '96. ACM, New York, NY, 193-194. [12] Lin, J., Newman, M.W., Hong, J.I., and Landay, J.A. (2000). DENIM: Finding a Tighter Fit Between Tools and Practice for Web Site Design. In the Proceedings of ACM Conference on Human Factors in Computing Systems: CHI 2000, (April 1-6, The Hague, The Netherlands), 2000. pp. 510-517. [13] Madsen, K., & Aiken, P. (1991). Madsen, K., & Aiken, P. (1991). Cooperative interactive storyboard prototyping. In S. J. Andriole (Ed.), Storyboard
116
prototyping: A New Approach to User Requirements Analysis (2nd ed.).
Wellesley, MA: QED Information Sciences. [14] Melor Abdul Rahman. (2007). Storyboard Design Process, Manual for Storyboard Designer (SD) and Reviewer (RW). (21st May 2001) [15] MockupScreens 4.02. URL: http://www.mockupscreens.com. Retrieved Date: 20th November 2009. [16] Patricia Smith and Tillman J. Ragan (2005). Instructional Design (3rd Edition). Wiley Joseey-Bass Education. John Wiley & Sons, Inc. USA [17] Raptivity Software Makes Interactive Learning Easy, 2008. Retrieved on 20th November 2009 from the World Wide Web: http://www.raptivity.com/. [18] Schon, D (1987). Educating the Reflective Practitioner. San Francisco: JosseyBass. [19] Springboard 0.91. Retrieved on 20th November 2009 from the World Wide Web: http://www.filetransit.com/view.php?id=63040. [20] Storyboard Tools 1.7.4. Retrieved on 20th November 2009 from the World Wide Web:http://www.brothersoft.com/storyboard-tools-download-30850.html. [21] Truong, K. N., Hayes, G. R., and Abowd, G. D. 2006. Storyboarding: an empirical determination of best practices and effective guidelines. In Proceedings of the 6th Conference on Designing interactive Systems (University Park, PA, USA, June 26 - 28, 2006). DIS '06. ACM, New York, NY, 12-21.
117
[22]
Hui Zhu, Frank Suarez and Xiaobo Lu. 2008. Comparison of animation
storyboard education in China and the United States. International Conference on Computer Graphics and Interactive Techniques. ACM SIGGRAPH ASIA 2008 educators programmed. Singapore. [23] Harada, K., Tanaka, E., Ogawa, R. and Hara, Y., Anecdote: A Multimedia Storyboarding System with Seamless Authoring Support, in ACM Multimedia 96 Proceedings, 1996. [24] Shin, M., Kim, B., Park, J., (2005). AR Storyboard: An Augmented Reality Based Interactive Storyboard Authoring Tool. Symposium on Mixed and Augmented Reality. Proceedings of the 4th IEEE/ACM International Symposium on Mixed and Augmented Reality. pp. 198-199. [25] Christel, M.G.; Warmack, A.S.; Acoustics, Speech, and Signal Processing, 2001. Proceedings. (ICASSP '01). 2001 IEEE International Conference on Volume 3, 7-11 May 2001 Page(s):1409 - 1412 vol.3. [26] Beyer, D.; Hassan, A.E.; Program Comprehension, 2006. ICPC 2006. 14th IEEE International Conference on 0-0 0 Page(s):248-251. [27] Barakat, R.A.; Professional Communication, IEEE Transactions on
Volume 32, Issue 1, March 1989 Page(s):20-25. [28] Thronesbery, C.; Molin, A.; Schreckenghost, D.L.; Aerospace Conference, 2007 IEEE. 3-10 March 2007 Page(s):1-8.
118
[29]
Ian Jones; Storyboarding: A method for bootstrapping the design of computer-
based educational tasks; Computers & Education, Volume 51, Issue 3, November 2008, Pages 1353-1364. [30] Hodis, E.; Schreiber, G., Rother, K.; L. Sussman, J.; eMovie: a storyboardbased tool for making molecular movies; Trends in Biochemical Sciences, Volume 32, Issue 5, May 2007, Pages 199-204. [31] L.Smith, P.; J. Ragan, T.; (2005). Instructional Designer (3rd ed.). John Wiley & Sons, Inc. [32] ASP.NET. Retrieved on 20th November 2009 from the World Wide Web: http://en.wikipedia.org/wiki/ASP.NET. [33] ASP.NET. Retrieved on 20th November 2009 from the World Wide Web: http://www.techterms.com/definition/aspnet. [34] Assoc. Prof. (Dr.) Peter Loh. Warehouse Management System. Nanyang Technological University [35] Microsoft Visual Studio. Retrieved on 20th November 2009 from the World Wide Web: http://en.wikipedia.org/wiki/Microsoft_Visual_Studio [36] Visual Basic .NET. Retrieved on 20th November 2009 from the World Wide Web: http://en.wikipedia.org/wiki/VB.NET#Criticism [37] Wan Hassan, W.A.R, (2007); An Application For Creating E-Learning Content Storyboard Based On Instructional Design Principle, University Malaya, Kuala Lumpur
119
[38]
Microsoft PowerPoint. Retrieved on 20th November 2009 from the World Wide
Web: http://en.wikipedia.org/wiki/Microsoft_PowerPoint [39] Microsoft Word. Retrieved on 20th November 2009 from the World Wide Web: http://en.wikipedia.org/wiki/Microsoft_word [40] Adobe Illustrator. Retrieved on 20th November 2009 from the World Wide Web: http://en.wikipedia.org/wiki/Adobe_Illustrator [41] Adobe Dreamweaver. Retrieved on 11th April 2010 from the World Wide Web: http://en.wikipedia.org/wiki/Adobe_Dreamweaver [42] Wamp. Retrieved on 11th April 2010 from the World Wide Web: http://en.wikipedia.org/wiki/WAMP [43] MySQL. Retrieved on 11th April 2010 from the World Wide Web: http://en.wikipedia.org/wiki/MySQL [44] Ghezzi, C., Jazayeri, M., & Mandrioli, D. (1991). Fundamentals of Software Engineering. Prentice-Hall, Inc. [45] Black-box testing. Retrieved on 12th April 2010 from the World Wide Web: http://en.wikipedia.org/wiki/Black-box_testing [46] Black-box testing. Retrieved on 12th April 2010 from the World Wide Web: http://www.webopedia.com/TERM/B/Black_Box_Testing.html
120

121
APPENDICES

A9R8C20

Hochgeladen von

Dokumentinformationen

Originalbeschreibung:

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

A9R8C20

Hochgeladen von

Copyright:

Verfügbare Formate

Siti Hasmah Digital Library

A STORYBOARD SYSTEM TO FACILITATE TASKS IN E-LEARNING

NUR FARHANA BT AHMAD DEMAN HURI ZARITH ROSHAHIVA BINTI KUSHAIRI

FACULTY OF INFORMATION TECHNOLOGY MULTIMEDIA UNIVERSITY APRIL 2010

Siti Hasmah Digital Library

A STORYBOARD SYSTEM TO FACILITATE TASKS IN E-LEARNING

Siti Hasmah Digital Library

NUR FARHANA BT AHMAD DEMAN HURI ZARITH ROSHAHIVA BINTI KUSHAIRI

FACULTY OF INFORMATION TECHNOLOGY

Siti Hasmah Digital Library

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

69 70 71 71 72 73 73 74 75 76 76 77 109 110 110 110 111 111

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

1.2 Problem Statement

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

1.3 Research Objectives

Siti Hasmah Digital Library

1.4 Research Questions

A Storyboard System To Facilitate Tasks In E-Learning

1.5 Research Methodology

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

Siti Hasmah Digital Library

Adobe Dreamweaver Wamp

Microsoft Visio Rational Rose

A Storyboard System To Facilitate Tasks In E-Learning

1.6 Significance of Study

Siti Hasmah Digital Library

A Storyboard System To Facilitate Tasks In E-Learning

1.7 Scope of Study