CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09...

10
45 CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION IMPLEMENTATION 5.1 Action Script Implementation People with good skills in Java, C#, or any similar format languages will find no difficulties in learning flash action script. Because this language basically has similar format language just like the format language in Java or C#. All of those languages including action script are user friendly languages, because somehow the languages resemble human language (English). Novice or first time users of action script language will find it a little bit confusing because of some slight changes in the writing format, for example for the declarative format. If in java or C# language people recognize integer as “int”, people will not find an “int” term in action script language. Instead, they just could use the term “var” which represents integer, string, and some more attributes. So, before implementing the action script into the flash program, the writer tried to research data such as java source code or action script related to the Sorting Algorithm. Since some sorting algorithms in action script are hard to find, the writer tried to look for java or C# sorting algorithm source code as the alternative programming foundation.

Transcript of CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09...

Page 1: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

45

CHAPTER 5 SOLUTION IMPLEMENTATION

SOLUTION IMPLEMENTATION

5.1 Action Script Implementation

People with good skills in Java, C#, or any similar format languages will find no

difficulties in learning flash action script. Because this language basically has similar

format language just like the format language in Java or C#. All of those languages

including action script are user friendly languages, because somehow the languages

resemble human language (English).

Novice or first time users of action script language will find it a little bit confusing

because of some slight changes in the writing format, for example for the declarative

format. If in java or C# language people recognize integer as “int”, people will not find

an “int” term in action script language. Instead, they just could use the term “var” which

represents integer, string, and some more attributes.

So, before implementing the action script into the flash program, the writer tried to

research data such as java source code or action script related to the Sorting Algorithm.

Since some sorting algorithms in action script are hard to find, the writer tried to look for

java or C# sorting algorithm source code as the alternative programming foundation.

Page 2: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

46

Basically, the action script for creating sorting algorithm in flash is really similar to the

java source code. Then, this thing gives some benefits to the writer because the writer

will not think more on the sorting algorithm, but the writer will focus on how to

implement the algorithm into the flash program.

Unlike the java programming language, flash action script requires the programmer to

interact with frames. Just for information that flash reads frame by frame to play the

whole animation. So, here is the specification of flash program that programmer sets:

1. Background size : 800 x 550 pixel

2. Frame rate : 12 frame per second (fps)

3. Font type : Texton Pro Ext

4. Program Theme : 3D Egypt

5.2 Software And Hardware Implementation

Since this is a flash program, the users do not have to have any complicated software to

open or play the program. There is also no need any complicated installation program to

play the flash program because this program is a direct executable program. The file

format itself is a standard flash format “.swf”. So, all the users have to have is just flash

player.

Page 3: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

47

There are two ways to play the flash program which are using any flash players or any

internet browsers. If the users have flash program in their computer, then they just

simply click on the swf file format to play the program. While, for those who don’t have

any flash players, they just simply drag and drop the swf file format to the internet

browser. In case if the internet browser doesn’t have any flash plug-in, basically the

users just have to download or install the available flash plug-in.

From small testing that the writer have done, the program works well on any Operating

Systems that can play flash file format. But it is recommended that the users either use

Windows Operating System or Apple Mac Operating System. Both major Operating

Systems play the flash program very well without even any small problem.

The users do not have to bother about the minimum hardware specification to play the

flash program, because the program still works well even with the minimum hardware

specification. The writer tested on a low specification ultra small notebook and it works

very well except the screen resolution problem. Since the background size of the

program is 800 x 550 pixels, then the minimum computer screen size to load full screen

size of the program is 800 x 600 pixels resolution. Otherwise, the program can not show

up fully on the computer screen. Bellow is the tested notebook specification

• Processor : Intel Celeron M ULV 900MHz

• CPU Memory : 512MB RAM

• Hard drive : 4GB SSD

• Graphics : Integrated Intel GMA 900 GPU

Page 4: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

48

• Screen Size :7-inch screen with 800 x 480 resolution

• OS : Windows XP Lite version

• Category : Ultraportable Notebook

5.3 User Interface Design

This part will show the final user interface design of the program.

5.3.1 Home Page Design

Figure 5. 1 Home Page

The Home page of the program is the main page that enables the users to choose

which features they want to see. On the picture above, there are 4 treasure boxes

in which each of them will navigate the users to certain pages.

Page 5: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

49

The first box, second box, third box, and fourth box will bring the user to Sorting

Tutorial page, Sorting Interactive page, Sorting Comparison page, and About Us

page respectively. Above the 4 boxes, there is a welcome message “Welcome,

(name)”. The orange color word is retrieved from the User input on the previous

page before this Home page.

5.3.2 Sorting Tutorial Page

Figure 5. 2 Sorting Tutorial Main Page

This is the Sorting Tutorial page consists of 9 buttons. The 8 buttons are Bubble

Sort button, Merge Sort button, Heap Sort button, Shell Sort button, Insertion

Sort Button, Selection Sort button, Radix Sort button, and Quick Sort button.

Each of those buttons will link to the page about each kind of sorting algorithm.

If the users cross over or put the cursor on each button, the button will appear

bigger. The Home button which is placed on top right corner is the button linked

to the Home page of the program.

Page 6: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

50

5.3.3 Sorting Interactive Page (main page)

Figure 5. 3 Sorting Interactive Main Page

This is the Sorting Interactive page consists of 5 main buttons and 1 Home

button. The 5 main buttons are Heap Sort, Bubble Sort, Shell Sort, Insertion Sort,

and Selection Sort button, which will direct the users to the each sorting

algorithm page. Each page will be described in section 5.3.15 in this chapter.

5.3.4 About Us Page

Figure 5. 4 About Us Main Page

Page 7: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

51

This is the About Us page consists of 3 main buttons and a Home button. The

two main buttons are Biography, Copyright button, and Evaluation. Biography

button will direct the users to the page that shows the programmer identity.

Copyright button will direct the users to the page that shows the copyright of the

flash program. The Evaluation button will navigate the users to the evaluation

page. Since the Evaluation feature is intended to be developed for the future

work, the writer will not explain the evaluation interface in this section.

5.3.5 Copyright Page

Figure 5. 5 Copyright Page

This is the Copyright page shows the rules that the programmer made regarding

the usage of the flash program. Still, there are Back and Home button to back to

the About Us page or Home page.

Page 8: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

52

5.3.6 Biography Page

Figure 5. 6 Biography Page

This is the Bibliography page shows a photo and little information about the

programmer’s identity. Back and Home button work as usual.

5.3.7 Sorting Tutorial Bubble Sort Page

Figure 5. 7 Bubble Sort Sorting Tutorial Page

This is the Bubble Sort page which shows the sorting animation of Bubble Sort

algorithm. As we can see on the picture above, there are 5 soft brown bars, 2

Page 9: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

53

animal buttons, a Home button, a Back button and small text below the brown

bars. The 5 brown bars above represent the numbers to be sorted using Bubble

Sort algorithm. Those bars will animate according to the right algorithm until the

numbers are sorted incrementally. The 2 animal buttons which are Next and Back

button, are used to skip to the next phase or repeat the previous phase of the

sorting algorithm process.

At the end of the sorting process, there is a Repeat button used to replay the

sorting animation all over again from the beginning process. And the Home

button will bring u back to the Home page of the program.

5.3.8 Sorting Tutorial Merge Sort Page

Figure 5. 8 Merge Sort Sorting Tutorial Page

This is the Merge Sort page which shows the basic materials such as buttons,

bars, and information just like the previous page. All the functions of those

materials are also working the same way with the previous sorting type pages.

Page 10: CHAPTER 5 SOLUTION IMPLEMENTATION SOLUTION …library.binus.ac.id/eColls/eThesisdoc/Bab5/Bab 5_09-09 (1).pdf · 5.3.8 Sorting Tutorial Merge Sort Page Figure 5. 8 Merge Sort Sorting

54

5.3.9 Sorting Tutorial Heap Sort Page

Figure 5. 9 Heap Sort Sorting Tutorial Page

This is the Heap Sort page which shows a little different in the animation

presentation. Heap sort is identical with its tree structure algorithm. That’s why

the programmer presents the animation using tree structure. Still the same as

previous pages, there are some buttons and text information that works the same

function as the previous pages.

5.3.10 Sorting Tutorial Shell Sort page

Figure 5. 10 Shell Sort Sorting Tutorial Page