CHAPTER 3

TECHNICAL BACKGROUND
3.1 Research Paradigm
The Basic Waterfall Model process has seen some disadvantages or boundaries in the
model which started a new System Development Life-Cycle (SDLC) model. To overcome this
problem in the Waterfall Method an extension has made and it is the V-Model. The proponents
will use the V-Model prototyping method concerning to the flow of the study. Instead of moving
down in a linear way, the process steps are bent upwards after the coding phase, to form the
typical V shape. It demonstrates the relationships between each phase of the SDLC and its
associated phase of testing.

Fig. 3.1 Diagram of The V-Model

Requirements Gathering and Analysis Phase

This phase defines the requirements of the system, independent of how these
requirements will be accomplished. It also defines the problem that the researcher is trying to
solve. The deliverable result at the end of this phase is a requirement document. Requirements
like Business Requirements Specifications and System Requirements Specification begin the life
cycle model just like the waterfall model. But, in this model before development is started, a
system test plan is created. The test plan focuses on meeting the functionality specified in the
requirements gathering.
Design Phase
In this phase the software design is prepared from the requirement specifications which
were studied in the first phase. There are two parts for this phase the high-level design and the
low-level design.
The high-level design (HLD) phase focuses on system architecture and design. It
provides overview of solution, platform, system, product and service/process. An integration test
plan is created in this phase as well in order to test the pieces of the software systems ability to
work together.
The low-level design (LLD) phase is where the actual software components are designed.
It defines the actual logic for each and every component of the system. Class diagram with all the
methods and relation between classes comes under LLD. Component tests are created in this
phase as well.

Implementation and Coding Phase

In this phase, on receiving system design documents, the work is divided in
modules/units and actual coding is started. It is the main focus for the developer and the longest
phase of the software development life cycle. Once coding is complete, the path of execution
continues up to the right side of the V-Model where the test plans developed earlier are now put
to use.
3.2 Concept of the Study

Students User

Computer-Aided

Result of Online

Name taking up

Instruction in

Quizzes, Exercises

Graphics Design

Plane and

and Activities

and Multimedia

Spherical
Trigonometry

Fig. 3.2 The Conceptual Framework of the Process of accessing the Computer Aided Instruction to
reach the general objective of the study
In Fig. 3.2, it shows the conceptual framework of the Computer Aided Instruction (CAI) to reach
the general objective of the study. The students and faculty members should register first and use their
Student ID and Faculty ID, respectively, as their username and enter their own password. After that they
may now proceed to the main page of the CAI and use the necessary navigations such as viewing lessons,

viewing class list, and managing profile. After taking up online quizzes and other activities, the students
will now be redirected to another page that shows their total score as their outputs.
3.3. Conceptual Operation
HOME PAGE

Do you already have an

account?
Send Password to
Email
True
Forgot
Password

False

Register a New Account

True
False

Log-In and Password is

Correct

False

Admin

Faculty

Student

Edit Admin Profile

Edit Faculty Profile

Edit Student Profile

Manage Student and

Faculty

View Class List and

Grades

View Lessons

Maintenance of
Lessons

Maintenance of
Activities and
Quizzes

Maintenance of
Resources

Add and View Lessons

Take Activities and

Quizzes

Add and View

Activities and Quizzes

View Assessment of
Grades

Upload Resources

Download Resources

Add/Update/Delete
Announcements and
Forum

View Announcements
and Forum and Add
Comment on Plane
Computer Aided Instruction
True

Figure 3.3 The Conceptual Operation of the

Maintenance
of
Spherical
Trigonometry
for Graphics Design and Multimedia Students
Announcements and
Forum

Log-Out

False

and

In Fig 3.3, it shows the conceptual operation of the system. The user of this Computer-Aided
Instruction will follow the flow of the conceptual operation. The users will be redirected to the home page
once they access the website. In that home page, they will be asked if they already have an existing
account. If the user does have an existing account, they can now proceed to their profile. Else, if the user
forgot their password, they can still retrieve it by sending it in their email address. And If the user does
not have an existing account therefore, they are advised to register first. In the registration form, they will
be asked what is their Student ID or Faculty ID. These will be used as their primary key and username.
They need to choose their user type, either faculty or student. They will also be asked for a password and
basic information such as email address, birthday, course, year and section. After the registration process,
they can now proceed to their profile. However, the administrator of the system will have a private
username and password that they need to use when opening the administrators profile.
In the Administrators page, the user can edit their profile and manage the students and faculty
members who use the system. They also need to maintenance the system and its features such as lessons,
activities and quizzes, resources, announcements and forum. After viewing and checking their page they
can now log-out for security purposes.
In the Facultys page, the user can also edit their profile and view their list of students and grades
respectively. They can also add and view lessons of the subject Plane and Spherical Trigonometry. Every
lesson, they can add and view activities and quizzes that they want to be answered and taken by their
student. They can upload resources for each lesson that are needed to be approved by the administrator.
They can also add, update and delete announcements and forums about the course subject. They are also
advised to log-out after checking and viewing their profile.
In Students page, the user can also edit their profile, view lessons and take activities and quizzes.
After taking up activities and quizzes, they can also check if it is already assessed by their professors. The
user can also download the uploaded resources. They can view announcements and forum updated by

their professors and they can also interact with it by sending a comment or feedbacks. And after that, they
are also advised to log-out their accounts.
3.4 Development Planning
3.4.1 Software Suited for Development
The proponents believe that another factor to have an effective CAI is to create it using their most
learned applications for visual editing. These are the following software that the proponents will

used for the development of the system:

Adobe Flash
Adobe Flash is a multimedia and software platform used for authoring of vector graphics,
animation, games and Rich Internet Applications (RIAs) that can be viewed, played and executed
in Adobe Flash Player. Flash is frequently used to add streamed video or audio players,
advertisement and interactive multimedia content to web pages, although usage of Flash on
websites is declining.
Flash manipulates vector and raster graphics to provide animation of text, drawings, and
still images. It allows bidirectional streaming of audio and video, and it can capture user input
via mouse, keyboard, microphone and camera. Flash applications and animations can be
programmed using the object-oriented language called ActionScript.
Adobe Illustrator
Adobe Illustrator is a vector graphics editor developed and marketed by Adobe Systems. It is a
professional quality graphic art program. Its applications are diverse, from creating print to web

graphics and posters. Although the program is complex and requires a significant amount of time
to truly master, it is quite easy to learn the basics and create work with a professional appearance.
Adobe Photoshop
Adobe Photoshop is a graphics editing program developed and published by Adobe
Systems. It is a raster image editor, which basically means it's used for editing images made of pixels.
Adobe Photoshop is the industry standard image editor used by image editing professionals to fix
photos, to do photo manipulation, create web graphics, and a multitude of other uses. It's also used in
science, medicine, and forensics for image analysis or enhancement.

Microsoft Office Access 2007

Access 2007 is a database management system from Microsoft. It allows the user to
order, manage, search, and report large amounts of information. It is a member of the Microsoft
Office suite of applications, included in the Professional and higher editions or sold separately.

Microsoft Visual Studio 2010

Microsoft Visual Studio is an integrated development environment (IDE) from Microsoft.
It is used to develop console and graphical user interface applications along with Windows
Forms or WPF applications, web sites, web applications, and web services in both native code
together with managed code for all platforms supported by Microsoft Windows, Windows
Mobile, Windows CE, .NET Framework, .NET Compact Framework and Microsoft Silverlight.

Visual Studio supports different programming languages by means of language services,

which allow the code editor and debugger to support nearly any programming language,
provided a language-specific service exists. Built-in languages include C/C++, VB.NET, C#, and
F#. Other built-in tools include a forms designer for building GUI applications, web designer,
class designer, and database schema designer.
Picasa 3
Picasa is an image organizer and image viewer for organizing and editing digital photos,
plus an integrated photo-sharing website, originally created by a company named Lifescape in
2002 and owned by Google since 2004.
Picasa can transfer, find, organize, edit, print, and share images, all with this easy-to-use
product. The program works with JPEG, GIF, BMP, PSD, and movie files and is compatible with
most digital cameras; it detects can detect the users USB driver and imports pictures into
albums. The editing tools for this program include cropping of images, removal of red-eye, and
enhancing even switching from color to black and white and create slide shows set to the users
MP3s.
3.4.2 Programming/Scripting Language
ASP.NET
ASP.NET is a development framework for building web pages and web sites with
HTML, CSS, JavaScript and server scripting. It was developed by Microsoft to allow
programmers to build dynamic web sites, web applications and web services. It was first released
in January 2002 with version 1.0 of the .NET Framework, and is the successor to Microsoft's

Active Server Pages (ASP) technology. ASP.NET is built on the Common Language Runtime
(CLR), allowing programmers to write ASP.NET code using any supported .NET language.
Visual C#
C# is a programming language that is designed for building a variety of applications that
run on the .NET Framework. C# is simple, powerful, type-safe, and object-oriented. The many
innovations in C# enable rapid application development while retaining the expressiveness and
elegance of C-style languages.
Visual C# is an implementation of the C# language by Microsoft. Visual Studio supports
Visual C# with a full-featured code editor, compiler, project templates, designers, code wizards, a
powerful and easy-to-use debugger, and other tools. The .NET Framework class library provides
access to many operating system services and other useful, well-designed classes that speed up
the development cycle significantly.

Notepad++
Notepad++ is a free source code editor which supports several programming languages
under Windows environment. It's also a lightweight replacement of Notepad. Notepad++ is
written in C++ and uses pure Win32 API and STL which ensures a higher execution speed and
smaller program size.

Notepad++ main features are: syntax highlighting and syntax folding, regular expression
search, WYSIWYG (If you have a color printer, print your source code in color), Unicode
support, full drag-and-drop supported, Brace and Indent guideline highlighting, two edits and
synchronized view of the same document, and user language define system.
JavaScript
JavaScript is the scripting language of the Web. It was originally implemented as part of
web browsers so that client-side scripts could interact with the user, control the browser,
communicate asynchronously, and alter the document content that was displayed. It is an
interpreted computer programming language. However, it has become common in server-side
programming, game development and the creation of desktop applications.
3.5 Evaluation of the Projects
3.5.1 Respondents of the Study
The proponents need the participation of the second year and third year students taking up
Graphics Design and Multimedia and the faculty members who teach the subject, Plane and Spherical
Trigonometry. The students will be the critique of the design, functionality and user friendliness of the
CAI. The faculty members will be the critique of the effectiveness of the lessons written there and also to
check the included online quizzes and activities. Both respondents are very much needed for the
improvement of the CAI.
3.5.2 Research Instruments and Techniques
The proponents will distribute surveys and questionnaires as their data gathering tool to collect
several information they need in the study. The respondents will rate the proposed system based on the
performance, security and reliability of the system. In evaluating the performance of the said instruction,

the respondents will be asked to rate if the system can manage all the accounts properly and if the
graphical user interface is user-friendly. It is also expected there the feedbacks if the quizzes and lessons
are presented clearly and if the result of quizzes is properly recorded. In evaluating the security of the
system, the respondents should see if their accounts are really secured that no one will going to access due
to the CAIs system inconvenience. And lastly, in the reliability of system, the respondents should critique
if the lessons presented there are reliable source of information, if the lessons are appropriate discussion
methods and if the assessment of scores is accurate. Results of the evaluation are further discussed in
Chapter 4 Results and Discussion.
3.5.3 Data Gathering Procedure
The proponents will collect the data needed from the respondents through survey. Using survey
form is the most practical way of collecting data from the huge number of respondents. The survey
includes questions that will ask the students how significant the use of CAI in the current time today. The
survey form will also get the respondents suggestions and decisions about the features that will be
included in CAI. The proponents understand that the respondents identity will be confidential and not
very much important in the study, except on their course and section, so the proponents did not bother ask
about their individual names. The proponents will also conduct an interview to some of the Graphics
Design and Multimedia students that are already done taking Plane and Spherical Trigonometry to ask
about the difficulty they experienced on the said subject.
The proponents will also conduct an interview to the faculty members who teach the said subject
to gather information they need to the improvement of the CAI the proponents will create.

3.5.4 Statistical Treatment of Data

The proponents will tally the scores given by the subject coordinator, faculty members who teach
Plane and Spherical Trigonometry and some Graphics Design and Multimedia Students. They will get the
total average score to know if the system satisfies their needs.

In getting the total evaluation grade of the subject coordinator and faculty members for each
category, the proponents will use this formula which is, SR/NQ, SR stands for the Sum of all Row Scores
while NQ stands for Number of Questions.
In getting the total evaluation of the subject coordinator and faculty members for the whole
system, the proponents will use this formula which is, (AE + AS + AR)/NC, AE stands for Average
Effectively, AS stands for Average Security, AR stands for Average Reliability and NC stands for Number
of Categories used.
To compute the total evaluation grade of the students for each category, the proponents will get
the product between the number of respondents and the grade given for each questions. After that, in
order to get the Average Mean Score they will use this formula which is, SP/NR, SP stands for the Sum of
all Products while NQ stands for Number of Respondents.
In getting the total evaluation of the students for the whole system, the proponents will use this
formula which is, (AE + AS + AR)/NC, AE stands for Average Effectively, AS stands for Average
Security, AR stands for Average Reliability and NC stands for Number of Categories used.