ENGLISH+

Project Proposal
Prepared for: Assignment 1 of BGM 203 - Multimedia Authoring and Development
Prepared by: Tirta Alin
Title: English+ - Interactive Media Exercise for Secondary School
March 10, 2015

BGM 203 - Assignment 1

!1

ENGLISH+

EXECUTIVE SUMMARY
Objective
Languages has became a main part of a way to communicate to each others. In communication, languages
are specified as verbal communication. Languages is like a bridge that connects people. People can
understand what the other people say through alphabet that becomes word, word that becomes sentence.
There are roughly 6,500 spoken language in this world. However, about 2,000 of those languages have fewer
than 1,000 speakers. The most popular language in the world is Mandarin Chinese, but there is one language
that become a global language that is really important to learn. English it is. English is probably one of many
languages that is easy to learn. English has a complex and easy-to-understand grammar compare to the other
European language like German language (Deutsch). Although of the easiness of learning english, there are
always some people that having difficulties in process of learning it. There are many fun and great way in
learning languages, watching movies, listening to music for instance.

Year 2000 is 15 years ago. Now, we live in the millennium era where all the stuff is optimised with technology.
People, young people in the school specifically, tend to learn languages in their old-classic-boring way, with
technology invade us, we can actually change those old-classic-boring way to fun-fascinating-entertaining way
to learn. Using a little piece of technology I know, I want to create an Interactive English Language Media
Exercise specifically design for secondary school. This multimedia product allows people learn english in much
easier way. There will be 10 topics covered in which all of those topic will be blended when the user wants to
test their knowledge through Test My Knowledge section and at the end there will be a score given to
measure their knowledge level. Learning through this multimedia exercise gives people a different experience
to exercise their english knowledge. As the result, people will know where mostly their mistakes are.

Goals
There are a lot of advantages gained when having a good english. Please remain that english is a global
language, and with Open Market is just around the corner, having a good english is not an exception. There
are no bad thing about rising your self value.

Solution
English+ is designed specifically for secondary school. I know, for them, the need of exercising their english is
so important. A lot of questions and topics will be present in English+, and those question and topics present
with a reason. The reason is to get people exercised and exercised with it. I believe that with a constant effort
on exercising english using English+, people will be able to rise their english knowledge to a whole new level.

BGM 203 - Assignment 1

!2

ENGLISH+

STATEMENT GOAL OF THE SYSTEM

Project Goals
By developing this multimedia learning exercise product, I want the accomplish several goals for those who will
use this product, in this case, the user is secondary school students. In SEA, (South East Asia) almost all of
the country does not use english as their first languages, except Singapore, which use Singaporean English.
So, we can assume that they are not that great in english. Thus, that is why English+ present, English+ is here
to help.
English+ goals is as described:
Increasing users english knowledge as they learn from the mistake (if they did) that English+ provide at the
end of the session when answering the questions.
Let the user know the common english mistakes and understand why it is a mistake.
Let the user know how certain word pronounced as they hear it in the listening topic.
To create a relaxing yet entertaining atmosphere at the same time when answering questions provided.

At the end, I always want the user always exercise, exercise and exercise using English+ in addition to have a
wider english knowledge.

BGM 203 - Assignment 1

!3

ENGLISH+

CHARACTERISTIC OF THE INTENDED

USERS
The Intended Users
As I mention earlier, English+ is specifically designed for the secondary school students in which the intended
users are obviously the secondary school students itself. In Malaysia, the secondary school student is at range
of 13 year-old until 18 year-old which I assume their english level is at intermediate at average.

Characteristics of First User

The first user is the lower secondary school. Lower secondary school students is emotionally unstable, from a
expert point of view, secondary school students is in growth of puberty level. there are many characteristics
which is stand out in this age, those are:
Emotionally unstable.
Start to develop a standard and hope of their behaviour that suit with the society.
Tend to compare rules and ethical values or norms with the reality that occurs in their daily life.
The tendency of their interest if somewhat clearer than before.

Characteristics of Second User

While the first user is the lower secondary school students, the second user is the upper secondary school
students. The upper secondary school students has age in range from 15 to 18 which obviously they are more
mature than those who are in the lower secondary school. We can describe them as a teenager. Adolescence
is a transitional period between their childs life to something that is more mature, which is adult life. In this
period, they are in search of what is actually they are. Characteristics of upper secondary school students are:
Accept physical state and is able to use effectively.
Start to choose and prepare their career that they want to start according to their skills and interests.
Socially responsible on their behaviour.
Achieving a mature relationship with their friends.

How They Will Be Attracted To The Multimedia System

English+ is designed to be attractive. Loaded with tons of animation that will make English+ really attractive.
The basic design of English+ is adopting the current trend design of the world of design, which is Flat UI. The
beautiful flat UI matched with pastel-like colour will make English+ more eye catching. While the user think
about the answer of the question given, there will be a relaxing music in the background that stimulates the
user to think even more relaxed.

BGM 203 - Assignment 1

!4

ENGLISH+

CONTENT SPECIFICATIONS
List of Media Elements
In developing a multimedia project, It should be contains media element to make it attractive. The word
Multimedia itself actually describe what is should be in the multimedia project. English+ uses five media
elements, those elements will be describe in the table below.
Media Elements

Description

Text

It may be an easy content type to forget when considering

multimedia systems, but text content is by far the most common
media type in computing applications. Most multimedia systems
use a combination of text and other media to deliver functionality.

Images

A digital photograph will be displayed in the Fun with Pictures

topic. Besides of that, English+ also uses images that completely
created by myself in Photoshop, that will interact as a button.

Audio

Audio files and streams play a major role in some multimedia

systems. English+ uses audio as the background music that will
give the user a relaxation feeling so the user can concentrate even
more in answering the provided question.

Video

Digital video appears in many multimedia applications. In English+,

the video will be appear in Listening topic. Typically the user
watch the video while at the end, there will be a question provided
related to the video.

Animation

Animated components are common within both Web and desktop

multimedia applications. Animations can also include interactive
effects, allowing users to engage with the animation action using
their mouse and keyboard. English+ uses animation to translate
from one screen to another.

Naming Convention for Files

Media Elements

Images

Description
C:\Users\Alin\Desktop\Photoshop Document\Assignment\English+.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\Back.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\Home.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\Mute.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\Unmute.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\Topic.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\Score.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\Test Me!.png
C:\Users\Alin\Desktop\Photoshop Document\Assignment\About.png
C:\Users\Alin\Download\p_streamlight_75500.png
C:\Users\Alin\Download\month_at_a_glance.png
C:\Users\Alin\Download\page-3-img-2.jpg
C:\Users\Alin\Download\dreamstime_l_18327587.jpg
C:\Users\Alin\Download\Silhouette-Photography-GenCept.jpg

BGM 203 - Assignment 1

!5

ENGLISH+

Video

C:\Users\Alin\Download\Royale_With_Cheese.mp4
C:\Users\Alin\Download\Ezekiel_25:17.mp4
C:\Users\Alin\Download\Marsellus_Gets_Medieval.mp4
C:\Users\Alin\Download\I_Shot_Marvin_in_the_Face.mp4
C:\Users\Alin\Download\The_Gold_Watch.mp4

Sound

C:\Users\Alin\Desktop\Sound\BGM_Track1.mp3
C:\Users\Alin\Desktop\Sound\BGM_Track2.mp3
C:\Users\Alin\Desktop\Sound\BGM_Track3.mp3
C:\Users\Alin\Desktop\Sound\Button_Click.mp3

Technical Specification
English+ is a simple multimedia project that does not need much resources to operates. Mostly, almost all of
the Windows computer nowadays will runs English+ well. Even with 5 year-old netbook that was released in
2010, English+ will run just fine. Thus, to be more detailed, the computers minimum requirements
specification that is needed to run English+ is explained in the table below:

Computers Minimum Requirements

Processor

1.6Ghz or faster processor for PC

Sound Card

32-bit

Memory

512MB or 1GB for PC

Graphic Card

128MB

Storage

500MB

Operating System

Windows XP 32bit

I/O Devices

Headphones or Speaker (Optional)

Delivery Platform
English+ will be developed for Windows running machine and will operate well in Windows. Mostly the
workstation and the computer labs on the school around the world uses Windows as their operating system of
choice, because it is easy to use and a lot of customisation can be applied. English+ needs Windows running
machine to run well and can be operate in PC, netbook, and laptop.

BGM 203 - Assignment 1

!6

ENGLISH+

FUNCTIONAL SPECIFICATION
System Design
The user interface of the English+ is based on the Flat UI design. Flat UI design is currently trending in the
world of design. Many big company, for example Google, Apple, Microsoft and several good app developers
applied the Flat UI elements both on their applications and their web. If we look closely, the Flat UI design is
very minimalistic, minimal influence of 3D elements. Thus, those factors make the Flat UI is unique, compare to
the other, Skeuomorphism for example. The images below shows the Menu Screen of the English+ that
applied Flat UI elements to the design.

The design itself is very minimalistic, combined with pastel like colour, it makes the UI even more eye-catching.
Please ignore the red dot with number inside it, it will be completely explained later in the Storyboard section.

BGM 203 - Assignment 1

!7

ENGLISH+

Interactive Capabilities
Multimedia project without animation is just plain slide. I do not want English+ to be like that. English+ has
some nice animations in the system. The animation is created in Adobe Flash Professional CS6. Lets take
an example of the screen that will be loaded with animation.

This screen is topic screen where user has the capability select questions by topic they want. In this screen, it
has a lot of card-like field that form to be a list. Those 10 cards will be animated as the first five cards come
from the upper part of the screen, while the rest of the card will come up from the bottom part of the screen.
The animation itself gives the user a nice user experience. It will please the user as they use English+.

BGM 203 - Assignment 1

!8

ENGLISH+

Use of Multimedia Elements

Multimedia project should be use multimedia elements like text, images, audio, video, and animation. Without
any of them, it is just like any other plain text. It feels less than a multimedia, it could not be called as
multimedia anymore. English+ uses five media elements, which I will describe in the table below.
Media Elements

Description

Text

It may be an easy content type to forget when considering

multimedia systems, but text content is by far the most common
media type in computing applications. Most multimedia systems
use a combination of text and other media to deliver functionality.

Images

A digital photograph will be displayed in the Fun with Pictures

topic. Besides of that, English+ also uses images that completely
created by myself in Photoshop, that will interact as a button.

Audio

Audio files and streams play a major role in some multimedia

systems. English+ uses audio as the background music that will
give the user a relaxation feeling so the user can concentrate even
more in answering the provided question.

Video

Digital video appears in many multimedia applications. In English+,

the video will be appear in Listening topic. Typically the user
watch the video while at the end, there will be a question provided
related to the video.

Animation

Animated components are common within both Web and desktop

multimedia applications. Animations can also include interactive
effects, allowing users to engage with the animation action using
their mouse and keyboard. English+ uses animation to translate
from one screen to another.

The list is the same like the list of multimedia elements that has been described in the List of Multimedia
Elements on the Content Specification.

Why Use Those Five Elements?

The using of those five multimedia elements is not without a reason, Every decision I make have a reason, in
this case the used elements has a major factor to create the word Multimedia. The elements itself defined
English+ as a multimedia exercise. Text is obviously selected as a elements because without text, it seems to
be impossible to create a multimedia exercise, especially the content that related to languages. Images is
important, image give the visual look on what several item should looks like. In English+, images is used as a
object that later become a question. Audio, is blended in English+. The background music (BGM) will use MP3
audio. I also decided to use video elements in English+ because video seems to be a nice media that gives a
visual look and sound at the same time. It will be used in listening section in English+. Last but not least
elements, is animation. Animation gives a nice user experience to the user when they use it. It will pleased their
eyes when they see the animation by themselves.
Thus, that is why I use the complete five elements of multimedia. Every element has chosen with a reason, and
the reason has already explained above.

BGM 203 - Assignment 1

!9

ENGLISH+

STORYBOARDS
Welcome Screen
The welcome screen is here, the welcome screen is also functioned as Home Screen. This is what the user get
when first time they try to open the English+. The design is really minimalistic with only 3 button showing on.
The big English+ logo is actually a button if you wonder, and that is where all the menu hidden. By clicking big
English+ logo, The user actually taken to the menu button. In addition to make an easier way to explaining the
screen section, I decided to gives every button and important elements of the screen a number.

1. The Big English+ Logo Button

This logo is actually a button that if clicked, the user will taken to the menu screen.
2. About Button
If the about button clicked, there will be a a very short about screen displayed.
3. Speaker Button
the function of the speaker button has only 2, to mute and unmute the BGM and SFX.

BGM 203 - Assignment 1

!10

ENGLISH+

Menu Screen
After the user clicked the big English+ logo, the user will taken to this screen. There are 6 buttons that each
has a different action if clicked.
1. Back Button
Back button is placed in the upper right corner for a easier use. It takes the user back to the home screen.
2. Speaker Button
Speaker button has the same action than before, what is different is only the position.
3. Topic Button
If it clicked, the user will taken to the topic screen where user can browse questions by topic the want.
4. Score Button
It displayed the last score that the user got along with the mistakes they did.
5. Test Me! Button
Whenever the user click this button, they will taken to a question screen with a random question.
6. Text Explanation
Whenever the user hover the mouse to a specific button, the text explanation will appear and give a brief
explanation on what that specific button do. In this case, the button is hovered on the topic button.

BGM 203 - Assignment 1

!11

ENGLISH+

Topic Screen
The topic screen will appear when the user click it through the menu button. It gives the user an possibility to
browse a specific question that the user want to exercise in. In every topic, there will be 10 questions given.
User can browse the a topic start from Simple Tenses until the last topic which is Listening. In topic screen, the
design is very minimalistic with only a selection of the topic and back and speaker button which remain
present. The design of the topic selection is borrowed from a famous Material Design elements that can be
found on Android Lollipop. The card-like design gives the user an easy way to browse topic that they want to
choose.
1. Back Button
Same like the previous menu screen, the back button is still here with the same action it has.
2. Speaker Button
The speaker button also present, gives the user ability to mute and unmute the BGM and SFX easily with
only a single click. In this case, the grey colour of the button indicates that the BGM and SFX is muted.
3. Topic Selection Field
The topic selection field gives the user ability to choose the topic that they want to exercise in. There are
10 topics displayed on the screen, started from Present Tenses until Listening topic.

BGM 203 - Assignment 1

!12

ENGLISH+

Question Screen
The question screen can be launched through 2 different way, the first way is when the user click a topic from
topic selection screen, and the second one is from Test Me! button.
1. Back Button
The back button is here to give the user ability to back to the previous screen. When the user has
answered a question, and user wants to back to change the answer, it can be completed by back button.
2. Speaker Button
The speaker button has the same action than before, to mute and unmute the BGM and SFX.
3. Topic Position
It gives the user ability to know from what topic the question came from
4. Question Field
It displayed the question given.
5. Answer Field
Answer field is the field that the answer of the given questions are appeared. There are 4 choices of the
answer and one of them will be the right answer.

BGM 203 - Assignment 1

!13

ENGLISH+

Score Screen
The score screen will be appeared after the user finish answering all question. It can be access also through
the Score button on the main menu.
1. Home Button
The existence of the back button is replaced with home button. It takes the user back to the main menu
2. Speaker Button
Speaker button remain present. Has the same ability than before.
3. Score Field
This is where the overall score will be displayed. in this case the score displayed is 10 out of 100.
4. Motivational Message Field
This field displays a different message based on the score that the user get.
5. Correct Field
This field displayed the amount of correct answer answered.
6. Mistake Field
this field displayed the amount of mistake the user did.

BGM 203 - Assignment 1

!14

ENGLISH+

About Screen
In about screen, It displays the creator of this multimedia, in this case is me, along with the social media
contact where the creator can be contacted.
1.

Back Button
The back button is here, when pressed, the user is taken back to the Welcome Screen.

2. Speaker Button
The speaker button is here, but with a different colour, the orange pastel-like colour indicates that the
sound is not muted.
3. English+ Logo
There is a English+ logo here, unlike the logo in the Welcome Screen, this time the logo is just a plain
picture with no action.
4. Facebook Link
This will takes the user to the Facebook of the creator of English+
5. Twitter Link
This will takes the user to the Twitter of the creator of English+
Both Facebook and Twitter can be use to give feedback to the creator for a better English+

BGM 203 - Assignment 1

!15

ENGLISH+

BENEFITS OF USING ENGLISH+

The Benefits
It is often claimed that multimedia technology offers a more stimulating and motivating learning environment
than that associated with traditional teaching methods. The validity of this claim is examined in relation to
some established motivation theories. English+ is a multimedia based application that help user exercise their
english knowledge. Through relaxing, animated contents that will pleased every user that use English+. In the
other hand, to make the user easier to know the benefits of using English+, There will be a list to describe it.
English+ uses 5 different elements of media in which combined and blended in a beautiful way.
Completely contains more than 90 different question to exercise with.
Relaxing background music gives a relaxed atmosphere to make the user more concentrate in answering
the provided questions.
Animated contents that will pleased every user that use English+

Why English+ Better Than Others

In todays application design, The other english interactive multimedia exercise tend to be a bit boring in term
of the design. Skeuomorphism is outdated. In 2015, the design lead to be flat, with a bit element borrowed
from 3D like a long shadow element. English+ user interface applied Flat UI design as the basic design. Why
Flat UI? simply because flat UI is elegant yet beautiful at the same time with its simplicity.
Multimedia exercise is not yet complete when there are no animations inside. English+ content animation will
be created in Adobe Flash Professional CS6. It gives a thousand of possibility to create great animation. With
animations in English+, user will be motivated even more in exercising their English.
English+ has an interactive listening topic. Interactive listening topic in English+ will use video rather than only
an audio like most of the other. The advantage of using video rather than audio is the user can get a visual
perspective of what is going on in the audio itself.
English+ contains 10 different topics and every topic will contains 10 different questions, except for the Fun
with Picture and Listening section that only has 5 questions. If combined, there will be 90 different question
from English+. I do not think that the other english interactive multimedia exercise have that amount of
question provided.

BGM 203 - Assignment 1

!16