Available online at www.sciencedirect.

com

ScienceDirect
Procedia - Social and Behavioral Sciences 131 (2014) 4 – 10

WCETR 2013

Usability and user satisfaction of 3D talking-head Mobile Assisted

Abstract

One of the serious issues affecting learning English as second language effectively is pronunciation, which consequently
contributes to learners’ poor communicative power. This condition is moreover critical among non-native speakers. Therefore,
numerous initiatives have been taken in order to promote effective language learning, which includes 3d talking-head on mobile
technology. 3D talking-head appeared to be a sufficient instructional material in supporting language learning, mostly in
pronunciation aspects among non-native speakers. On this regard, this study concentration is mainly on developing 3D talking-
head Mobile Assisted Language Learning (MALL) app, specifically on pronunciation learning among non-native speakers. The
app was developed based on theories, principles and literature overview done. The paper also reports the outcome of usability
and user satisfaction test conducted.

© 2014
© 2014 The
The Authors.
Authors. Published
Published by
by Elsevier Ltd. Open access under CC BY-NC-ND license.
Elsevier Ltd.
Selection and
Selection and peer-review
peer-review under
under responsibility
responsibility of
of the
the Organizing
Organizing Committee
Committee of
of WCETR
WCETR 2013.
2013.

Keywords: Animation, mobile learning, pronunciation, talking-head;

Introduction

Multimedia in point of fact has significant contribution in MALL. Several methods are practicable in MALL,
such as usage of multimedia messages in improving pronunciation and so forth (Saran, Seferoghu & Cagilitay,
2009). In recent studies, researchers explored the usage of multimedia messages (MMS) via mobile phones for
improving pronunciation of words. For instance, study by Saran, Seferoglu and Cagiltay (2009), which looked at the
effectiveness of three different mode of delivery namely web base, handouts and MMS. They found that students in

* Corresponding author: Kogilathah Segaran Tel.: +605-450-5833

1877-0428 © 2014 The Authors. Published by Elsevier Ltd. Open access under CC BY-NC-ND license.
Selection and peer-review under responsibility of the Organizing Committee of WCETR 2013.
doi:10.1016/j.sbspro.2014.04.069
 Kogilathah Segaran et al. / Procedia - Social and Behavioral Sciences 131 (2014) 4 – 10 5

the MMS delivery mode outperformed students in handouts and web base delivery mode. However, application of
animation, particularly 3D talking-head in assisting language learning is mostly computer based. There are research
done on the 3D talking-head on mobile phones as voice interactive services but there is scarce research done on the
use of the 3D talking-head as pronunciation learning aid. Therefore, study filling the gap with concentration on the
effectiveness of 3D talking-head mobile application in aiding pronunciation learning seems vital (Ahmad Zamzuri &
Kogilathah, 2013). Taking this into consideration, the objective of this study is to develop the 3D talking-head
MALL to introduce an alternative method in assisting students to improve their English pronunciation skills, which
eventually might improve their overall communication power. Adding to that, this will also give them a new
experience in learning through smart phone or mobile devices with the virtual tutor assistance.

2. Design and Development

In every instructional material design and development process, there should be an instructional design model
referred as the development procedure guide. There are numbers of instructional design models can be used in order
to practice a more systematic development process. Basically, there are four main phases that most of the models
shares, which are analysis, design, development and evaluation (Boyle, 1997). All these procedures or phases are
inherited from the ADDIE model since the 1950s (Irlbeck, Kays, Jones, & Sims, 2006). Adding to that, Kruse
(2002) stated that there are more than 100 different instructional design models, but almost all are based on the
ADDIE model. However, developers or students who use the model to develop instructional materials face
difficulties in determining the tasks that need to execute in every phase (Ahmad Zamzuri, Laili Farhana &
Syamsulaini, 2012). This is due to the architecture of the model being represented by words, and in order to
understand it clearly, each phases need to be explained in detail (Ahmad Zamzuri, Laili Farhana & Syamsulaini,
2012). At the same time, this might also cause confusion, since the explanation of each phase varies from one author
to another (Ahmad Zamzuri, Laili Farhana & Syamsulaini, 2012). Therefore, detailed design model namely DIDEA
has been developed recently at Sultan Idris Education University in the Instructional Design Theory course (Ahmad
Zamzuri, Laili Farhana & Syamsulaini, 2012). DIDEA is the acronym for the five phases which are Determine,
Illustrate, Development, Execute and Analyze. Each phase contains the sub tasks which help in explaining the
function of each phase better, which in contrast does not have in most of the existing instructional design models. As
a result, DIDEA model was used in the mobile phone application development for this study (Figure 1). In mean
time, ADDIE model was also referred to further affirm the development process.

Figure 1. DIDEA Model (Ahmad Zamzuri, Laili Farhana & Syamsulaini, 2012)
2.1 Navigational approach

The prototype begins with the welcome screen. From there, students can select to navigate into the menu screen,
which they can choose the words to begin their practices. When the students choose a word to practice, they will be
introduced to a screen with the word’s syllable break and 3D talking-head. Following that, the students can select
the “next” button to navigate to the full pronunciation screen where they can practice with 3D talking-head. The
prototype used both hierarchical and linear navigational structure. Hierarchical navigational structure allows the
6 Kogilathah Segaran et al. / Procedia - Social and Behavioral Sciences 131 (2014) 4 – 10

students to return to the higher level of the navigation which is the menu screen to choose the word of their choice to
practice (Rosenfeld & Morville, 1998). Non-linear navigational structure such as hierarchy also gives learner control
in which; it increases effectiveness, efficiency, and motivates learners (Martin, 2008). Besides, other variables that
influence the level of learner control are prior knowledge, student strategy and ability, learning progress, complexity
of material and familiarity with the subject (Depover & Quintin, 1992; Hannafin, 1984; Milheim & Martin, 1991).
Where else, linear navigational structure was also used in the prototype to let the students know that there are still
screens left to view and also to let them know that they are able to go one step back to view the previous screen
(Krug, 2000; Nielson, 1999). The linear navigational structure was mainly used in content part, which was deemed
appropriable for drills strategy; which was used as a pedagogical approach of the app.

2.1 Interface design

The interface design for the MALL application will be simple and the usage of heavy graphics is less since
considering the download time and the launching of the application. The text, graphic, video, audio and animation
used in this application were mainly based on human computer interaction design principles. The application will
start with a welcoming screen. The content of the welcoming screen would be the title of the application, and a
button to continue to the next screen (Alessi & Trollip, 2001). In the following screen, there will be ten words option
for the students to choose from for the pronunciation practice (Figure 2). There will be instructions on the top of the
practice screen to inform the students to select the options. When the students select the particular word, they will be
navigated to the syllable break with 3D talking-head screen (Figure 4). When the students select the “play” button
on this screen, the 3D talking-head will pronounce the word by following the syllable break. Apart from the play
button, there will be also other navigational buttons on the screen such as, home, next, previous and exit button. The
exit button will be displayed in every screen to allow the students to exit whenever they feel like stop using the
application (Alessi & Trollip, 2001). Furthermore, application of the exit button suits well for the instruction with
drills methodology (Alessi & Trollip, 2001). Following that, when the students select the “next” button, they will be
directed to the full pronunciation practice screen. In this screen, the students can select the “play” button to repeat
the 3D talking-head pronouncing the word again. In the full pronunciation screen, the students can select the “next”
button to see the word’s meaning or select the “home” button to go back to the menu screen, or select the “exit”
button to see the credit screen and leave the application.

2.2 Design Principles

2.2.1 Text principle

The texts used in this application are less which is mostly applied for instructional purpose and also due to the
limited screen size of a smartphone. The instructional text that should be read first placed at the top of each practice
screens and main screen (Galitz, 2007). The colour used for the text is in contrast with the background for easy
reading (Fenrich, 1997). The font choice for this application would be from san serif category which is Verdana.
This font face was chosen due to good readability on screen display than the serif fonts which is more suitable for
printed output (Hughes, 1999; Peck, 2003). The font selection for each screen would be standard.

Figure 2. Sample Screen with Instruction Text

2.2.2 Graphic principle

The graphic used for this application is for the background and as a decorative purpose at the welcoming screen
(Figure 3). The background image used is very simple to ensure clear visual of the animated video. The decorative
graphic used at the background is moderate since this application is an instructional material (Jabbour, 2012).

Figure 3. Sample Screen with Graphic

2.2.3 Audio principle

The amount of audio used in the application is only for the purpose of pronouncing word. It was ensured that the
audio is clear to enable students to listen the pronounced word effectively. Moreover, audio also gives a multilingual
support to teach the students to pronounce (Fenrich, 1997). The voice used for pronouncing, was Malaysian English
linguistic expert’s voice. This is to ensure that the students feel comfortable and familiar with a more localized
experience. It is also due to avoid any foreign accent and slang influencing the pronunciation.

2.2.4 Video principle

The video used in this application is actually the animation file which was converted into video file. The video
file used will be smaller in size due to reduce the download time and to save the memory usage of the mobile phone.
At the same time, smaller video size also will save the limited storage space in the mobile phone. The video length
was limited to twenty to thirty seconds to make it fast pace, which is suitable for drills purpose. Fast paced drills
appeal to the students’ sense of achievement and enhance fluency compared to slow paced drills draws complaints
from students that the drill is slow (Alessi & Trollip, 2001).

2.2.5 Animation principle

Animation will be one of the main concerns of the application since it was used to identify the effectiveness in
MALL condition. The animation element used was the 3D talking-head with facial expression and lip sync. Besides
that, it is also used as an instructional purpose (Fenrich, 1997). The instructional purpose would be to show the
students how to pronounce a word via the lip movement and the facial expression supported with audio. The face of
the 3D talking-head model is more to non-realism face since non-realism appearance has its own advantages.
According to Ruttkay and Noot (2000), below are the advantages of a non-realism character design:
i. Expressions can be exaggerated using non-realistic features
ii. There is much freedom in designing relatively the human face resemblance
iii. It has some creative touch, which makes them more likable by the user
compared to the real human face.
iv. If the face appearance trying not to be real the user does not have high
expectations towards its realism performance as they would compare to the real
human being face appearance.
v. Cost saving since it does not require special technology equipment to model and
to animate.
8 Kogilathah Segaran et al. / Procedia - Social and Behavioral Sciences 131 (2014) 4 – 10

Figure 4. 3D talking-head animation

Usage of too many colours would normally make the interface look distracting (Fenrich, 1997). The background
image used for this application is light blue which basically has high contrast with the dark text (Fenrich, 1997).
Light blue has been chosen as the background colour, since it is categorized as cool colour which gives the calm and
relaxing feel to the students (Kallem, 2012). This will also enable the students to learn the content comfortably.
Besides that, there was no colour used as video’s background, in order to make it as the focus point. The colours
used also were consistent throughout the whole application which enables the students to locate the information
easily (Fenrich, 1997).

3. Evaluation

Analyzing activities was done throughout the development process and phases. The informational data for
analyzing purpose were gathered through reading, observation, interview and from the experts’ advice. The
analyzing process was not only limited in terms of physical appearance and the usage of the application but also
includes the overall performance, mainly the usability and user satisfaction of the 3D talking-head. As for the
usability and user satisfaction, test was conducted once the design and development processes were wholly
completed. The usability and user satisfaction questionnaire, which was adapted from Post-Study System Usability
Questionnaire (PSSUQ), was used to obtain feedback from the participants. The questionnaire consists of 21 items,
which were divided into seven categories namely design/layout, functionality, ease of use, learnability, satisfaction,
outcome/future use and errors/system reliability. The questionnaire’s item are 7-point scales with 1 for strongly
agree, followed by next numbers in sequence with the end point 7 for strongly disagree.
The study participants were 105 Bachelor Degree in Design students, whose ages ranged from 19 to 21. The study
was performed in the lecture hall that lasted for 30 minutes. The basic function of the prototype was explained by
the instructor before the students were allowed to explore the application via 7 inch tablet at their own pace. The
participants explored the application for about 15 minutes and they were allowed to ask question and discuss
throughout the session. The session ended with participants answering the questionnaire.
Basically, Cronbach Alpha of usability and user satisfaction questionnaire was .97 indicating that overall the
scales had acceptable reliability.
Design/Layout: Overall in design and layout aspects, the learners liked the interface of the application (M=3.18,
SD=1.34), organization of the information presented was clear (M=3.14, SD=1.38), and the interface was pleasant to
use (M=3.38, SD=1.35).
Functionality: The application has all the functions and capabilities that the learners expected (M=3.38,
SD=1.47), the information retrieved from the application was effective in helping them to complete related tasks
(M=3.22, SD=1.45), and the learners agree that all the features in the application functions well (M=3.19, SD=1.61).
Ease of use: The learner agree that the application was simple to use (M=2.70, SD=1.58), the information needed
was easy to find (M=3.05, SD= 1.50), the information provided was clear (M=2.93, SD=1.53), and overall, the
application was easy to use (M=2.70, SD=1.50).
Learnability: The learners agree that it was easy to learn to use the application (M=2.86, SD= 1.52). They found
that, there was not too much information to read before able to use the application (M=3.01, SD=1.54). They also
agree that the information provided by the application was easy to understand (M=2.95, SD=1.44).
 Kogilathah Segaran et al. / Procedia - Social and Behavioral Sciences 131 (2014) 4 – 10 9

Satisfaction: In general, the learners felt comfortable using the application (M=2.97, SD=1.57). They also
enjoyed exploring the application (M=3.00, SD=1.39), and overall they were satisfied with the application (M=3.00,
SD=1.56).
Outcome/Future Use: The learners agree that they could become productive quickly using the application
(M=3.06, SD= 1.47). They were convinced that the application could improve their pronunciation skill (M=3.08,
SD=1.63), and based on their current experience using the application, they would use it regularly (M=3.12, SD=
1.47).
Errors/System reliability: The learners agree that whenever they made mistake using the application, they could
recover easily and quickly (M=3.09, SD=1.422). They agree that the application gave error messages that clearly
told them how to solve the problem (M=3.33, SD=1.65).
Overall outcome of the questionnaire clearly indicates the learners’ satisfaction of 3D talking-head MALL
namely Teacher Johan: English Pronunciation and Vocabulary Enrichment for Non-native Speakers.

4. Conclusion

Animation has significant contribution in education industry among various subject matters for the past decades.
Animation, specifically 3D talking-head has been developed in many studies as a virtual teacher in aiding second
language learning. This can be seen through the emergence of CALL and MALL, which includes Multimedia
elements, particularly animation in their existing system or application. However, it has scarce research done on
mobile phone based application, specifically on the 3D talking-head. As what can be seen, mobile learning is
becoming trendier in aiding education field nowadays. Furthermore, Mobile Assisted Language Learning shows
growing bodies of development in assisting language learning. Highlighting to that, researches identifying the
effects of 3D talking-head mobile phone application in improving English pronunciation skills among non-native
speakers is important.

Acknowledgements

The authors wish to acknowledge the support of the Ministry of Higher Education and Universiti Pendidikan
Sultan Idris, who awarded a RAGS research grant for this study.

References

Ahmad Zamzuri, M.A., & Kogilathah, S. (2013). 3D Talking-head mobile app: A conceptual framework for English
pronunciation learning among non-native speakers. English Language Teaching, 6 (8), 66-76.
Ahmad Zamzuri M.A., Laili Farhana M.I., & Syamsulaini S. (2012). Model reka bentuk instruksi DIDEA [DIDEA
Intstructional Design Model]. Pembelajaran Berasaskan Web: Isu dan Trend [Web based learning: Issues
and trends] (pp. 13-25). Tanjong Malim, Malaysia: UPSI Press
Alessi S. & Trollip S. (2001). Multimedia for Learning: Methods and Development. (3rd edition). Massachusetts:
Allyn & Bacon.
Boyle, T. (1997). Design for multimedia learning. London: Prentice Hall.
Depover, C. E & Quintin, J. J. (1992). Learner control versus computer control in professional training context. In
M. Giardina (Ed.), Interactive Multimedia Learning Environments: human factors and technical
considerations on design issues. 234-247. Berlin: Springer-Verlag,.
Fenrich P. (1997). Practical Guidelines for Creating Instructional Multimedia Applications. Orlando: Dryden.
Galitz, W.O. (2007). The Essential Guide to User Interface Design: An Introduction to GUI Design Priciples and
Techniques (3rd ed.). Indiana, Indianapolis: Wiley Publishing.
Hannafin, M. J. (1984). Guidelines for using locus of instructional control in the design of computer-assisted
instruction. Journal of Instructional Development 7(3), 6-10.
Huges S. (1999). Seni Rekabentuk Dan Topografi Cara Mudah [easy way of art and typography design]. Shah
Alam, Malaysia: Federal Publications.
Irlbeck, S., Kays, E., Jones, D., and Sims, R. (2006). The Phoenix rising: emergent models of instructional design.
Distance Education., 27(2), 171–185.
10 Kogilathah Segaran et al. / Procedia - Social and Behavioral Sciences 131 (2014) 4 – 10

Jabbour, K. K. (2012). Multimedia principle in teaching lessons. Acta Didactica Napocensia, 5 (4), 11-16.
Kallem, M. (2012). How do colors impact E-learning design and learning? Retrieved December 10, 2012 from
http://blog.commlabindia.com/elearning/colors-elearning-mlearning-courses
Krug, S. (2000). Don't make me think! A common sense approach to web usability. Indianapolis, IN: Que.
Kruse, K. (2002). Introduction to instructional design and the ADDIE model. Retrieved June 10, 2012, from
http://www.e-learningguru.com/articles/art2_1.htm.
Martin, F. (2008). Effects of practice in a linear and non-linear web-based learning environment. Educational
Technology & Society, 11(4), 81-93. Mettam, G. R., & Adams, L. B. (1994). How to prepare an electronic
version of your article. In B. S. Jones, & R. Z. Smith (Eds.), Introduction to the electronic age (pp. 281-
304). New York: E-Publishing Inc.
Milheim, W. D. & Martin, B.L. (1991). Theoretical bases for the use of learner control: three different perspectives.
Journal of Computer-Based Instruction 18(3), 99-105.
Nielsen, J. (1999). Designing web usability: The practice of simplicity. Indianapolis, IN: New Riders Publishing.
Peck W. (2003). Great Web Typography. Indiana: Wiley Publishing.
Rosenfeld, L. & Morville, P. (1998). Information architecture for the World Wide Web. New York, NY: O'Reilly &
Sons.
Ruttkay, Z & Noot, H (2000). Animated chartoon faces. Proceedings of First International Symposium on Non
Photorealistic Animation and Rendering, Annecy, France, 91-100.
Saran, M., Seferoglu, G., & Cagiltay, K. (2009). Mobile Assisted Language Learning: English Pronunciation at
Learners' Fingertips. Eurasian Journal of Educational Research, 34, 97-114.Steinberg, E. R. (1989).
Cognition and learner control: a literature review, 1977-88. Journal of Computer-Based Instruction 16 (4),
117-24.