Improving the Usability of Manga-on-a-Tablet for Collaborative

Learning

Ryouhei Egusa

，Hideo Funaoi

，Takafumi Daikoku

，Ryosuke Inai

, Fusako Kusunoki

，

Makiko Takenaka

, Takao Terano

and Shigenori Inagaki

Kobe University, Hyogo, Japan

Soka University, Tokyo, Japan

Doshisha Women’s College, Kyoto, Japan

Tama Art University, Tokyo, Japan

Oita University, Oita, Japan

Tokyo Institute of Technology, Kanagawa, Japan

Keywords: Tablet PC, Annotation, Manga, Collaborative Learning, Teacher Education.

Abstract: The purpose of this study was to develop a tablet PC version of a system that promotes the learning of

knowledge and skills related to science teaching, and to investigate its effectiveness. The characteristic

feature of this system is that it supports collaborative learning through discussions based on case method

materials by a manga (comic strip). The system makes students read scenes of a children’s experiment

displayed on the screen in the form of a manga. Touch operations on parts of interest enable students to

point pins. Pins are color-coded in four colors. Students use the share functions to share awareness with

each other and hold discussions to solve problems. We conducted an experimental evaluation with

university students who intended to become elementary school teachers. The evaluation showed that the

proposed system is effective in promoting discussion through the sharing of awareness.

1 INTRODUCTION

Fostering the talents and abilities of teachers and

enhancing their expertise are currently recognized as

key issues in teacher training. The pedagogical

content knowledge (PCK) approach to teacher talent

and ability promoted by Shulman (1987) is widely

known (e.g., Gess-Newsome and Lederman, 1999;

Mishra and Koeher, 2006). PCK is undoubtedly

knowledge that is linked directly to the practical

ability and expertise of teachers. With many of

Japan’s experienced teachers now approaching

retirement, the country faces the issue of how to pass

on the knowledge and skills of these teachers to their

successors. The field of science education focuses

on acquired knowledge and skills related to

experimental equipment and teaching materials, but

a sufficient number of teacher education materials

have not been developed to enable young teachers

and teaching-track university students to acquire

such knowledge and skills.

Daikoku et al. (2013) responded to this problem

by developing a tablet PC–based pilot version of

case method materials that uses a manga designed to

enable teaching-track university students to gain the

knowledge and skills required for guiding students

through experiments in science classes.

Manga is a familiar medium to young people; it

enables stories to be read and understood relatively

quickly, and can provide the information that

students need to get in a focused manners. Tablet

PCs can draw on these characteristics of manga to

provide texts in a simple format. Further, since tablet

PCs can communicate with each other to enable

information sharing, they can provide a collaborative

learning environment (e.g., Kim et al., 2009; Reid

and Ostashewski, 2011). Using these texts, students

read a manga depicting scenes of a science

experiment conducted in the elementary school.

They can append markers to each scene, share and

discuss them with other students, and collaboratively

learn the knowledge and skills required of

elementary school teachers. However, the pilot

version of this system only provided some functions

446

Egusa R., Funaoi H., Daikoku T., Inai R., Kusunoki F., Takenaka M., Terano T. and Inagaki S..

Improving the Usability of Manga-on-a-Tablet for Collaborative Learning.

DOI: 10.5220/0004943404460451

In Proceedings of the 6th International Conference on Computer Supported Education (CSEDU-2014), pages 446-451

ISBN: 978-989-758-020-8

 2014 SCITEPRESS (Science and Technology Publications, Lda.)

for indicating and sharing awareness. For example,

there were no functions for identifying who entered

a marker or for seeing the entire manga in the list

format.

To overcome these shortcomings, in this study,

we developed a system that added the name display

capability to the function for sharing awareness, and

included a manga and pin list function. We also

conducted an experimental evaluation of the system

with teaching-track university students. The study’s

aim was to verify the system’s operation and its

effectiveness in promoting discussion among the

users through the sharing of awareness.

2 SYSTEM OVERVIEW

2.1 Development Environment

The tablet PC development environment was Adobe

Flash Professional CS6, enabling the system to be

published as applications for iOS and Android. The

server development environment consisted of

Windows 7 (Professional) , Apache 2.2, PHP 5.3,

and MySQL 5.5. The system can be operated on

other operating systems if an equivalent service can

be used.

2.2 System Configuration

Figure 1 shows the system configuration. The

diagram only shows one tablet PC, but naturally,

multiple tablet PCs are connected to the server,

enabling the sharing of the entered pins and other

data. After logging into the system from a client

tablet PC, the user can view any manga page and use

functions such as the pin entry function on any

manga frame location at which the user wants to flag

a problem. The information for these operations is

sent over the network to the server and stored in a

MySQL database through a control unit on PHP.

When the “show others’ pins” message is sent from

a tablet PC, the information for all the pins entered

in the manga being viewed is read from the MySQL

database and returned to the tablet PC. The pins are

then displayed on the tablet PC. In this way, students

can share pins indicating awareness.

Figure 1: System Configuration.

ImprovingtheUsabilityofManga-on-a-TabletforCollaborativeLearning

447

2.3 Functions

Figure 2 shows the picture of the manga after

logging in. In the diagram, awareness of individuals

has been entered using the pin entry function.

Figure 2: The picture of the manga after pin entry.

2.3.1 Manga Page Operation Functions

As with e-books for standard tablet terminals,

swiping the manga to the right moves forward a

page, while swiping it to the left moves back a page.

2.3.2 Pin Entry Function

Figure 3 shows the pin entry function. To enter a

pin, the user touches the desired location (any

location) in a manga for less than 1 s. The panel

appears, containing pins of four colors (blue, green,

yellow, and red). The user touches the pin of the

desired color to enter it. Pins can be entered in a

manga in this way to add annotations. Four colors of

pins have been provided to enable students to color-

code different categories of pin comments.

Providing a meaning to each pin color clarified what

each student focused on at each pin location. Pins in

a manga can be moved by dragging them. Touching

a pin for less than 1 s displays the panel. The user

can then touch a pin of another color to switch the

selected pin to that color. Touching the trash can

delete the selected pin.

Figure 3: Pin entry function.

2.3.3 Manga Page Operation Functions

As with e-books for standard tablet terminals,

swiping the manga to the right moves forward a

page, while swiping it to the left moves back a page.

2.3.4 Functions for Sharing Awareness

As shown in Figure 4, touching the “Other pins”

button at the bottom of the picture of the system

makes the display of pins added by other students on

the same page translucent, enabling the sharing of

awareness. As shown in Figure 5, touching the

“Display names” button displays the name of the

student who entered each pin at the right of the pin.

The names of other students are translucent like pin.

These operations enable the sharing of pin

comments among students. Paying attention to pin

input locations and color movement could be

expected to promote discussion activities.

Figure 4: One scene of the manga after pin awareness

sharing operation.

CSEDU2014-6thInternationalConferenceonComputerSupportedEducation

448

Figure 5: One scene of the manga after the display of

names operation.

2.3.5 Manga and Pin List Function

As shown in Figure 6, touching the “List” button at

the bottom of the picture of the system displays all

the pages of the manga as thumbnails along with the

entered pins. This function shows at a glance where

comments have been entered throughout the entire

manga along with the number of comments entered.

Touching a thumbnail displays the selected page in

the normal size.

In this way, the system enables the adding and

sharing of noteworthy locations in various categories

by means of pins in four colors, using only touch

and gesture operations. It makes ample use of the

convenience of tablet PCs.

Figure 6: The picture of the system using manga and pin

list function.

3 EVALUATION EXPERIMENT

3.1 Evaluation Design

Purpose: To investigate the system’s operation and

the effectiveness of discussions based on the sharing

of awareness.

Participants: 32 university students planning to

become elementary school teachers (13 men and 19

women). Participants were divided at random into

groups of 4, for a total of 8 groups.

Procedure: Each group of participants took part

in case method materials trial on tablet PCs. The

procedure used was as follows: The participants first

read the 8-page manga individually. Then, they

entered pins for issues that they considered to be

problematic in the story conveyed by the manga (for

example, insufficient teacher guidance, broken

equipment due to children’s misbehaviour, or a

classroom environment unsuitable for the

experiment). Finally, each group shared the pins

entered by its members and held a discussion on the

basis of these pins. After the case method materials

trial, the participants evaluated the system by using

the questionnaire method.

Evaluation items: There were two categories of

evaluation items—items about the system’s usage

and operation, and items about the sharing of

awareness about manga frames. There were 13 items

about the system’s usage and operation. They

covered areas such as manga visibility, page

operation, and commenting operations. Some

examples of these items are as follows: “Picture of

manga after pin awareness sharing operation was

easy to view” and “Manga viewing operations were

easy.” There were 9 questions about awareness

sharing. They covered the discussion held on the

basis of the shared awareness; e.g., “Sharing enabled

us to discover differences in awareness about manga

frames” and “When sharing, it was easy to

distinguish my own pins from other people’s.” There

were 22 items in all. For each item, the respondents

selected a number between 1 and 5, with 5

representing “Strongly agree” and 1 representing

“Strongly disagree.”

Survey period: October 3 to 21 2013

3.2 Results

Table 1 presents a tally of the responses received for

the usage and operation items and a compilation of

the results. The responses received for each item

were classified into positive responses and

neutral/negative responses. In particular, the

ImprovingtheUsabilityofManga-on-a-TabletforCollaborativeLearning

449

Table 1: Questionnaire survey results of the usage and operation.

Items 1 2

1. Picture of manga after pin awareness sharing operation was easy to view

31 1

2. I carefully considered problems in the children’s experiment while viewing the sharing system

29 3

3. Operations for viewing the manga were easy

26 6

4. It was easy to find the desired manga pages and frames

27 5

5. It was easy to color-code problem importance levels by pin color

19 13

6. The pin entry operation was easy

n.s.

14 18

7. The operation for discarding entered pins was easy

18 14

8. The operation for changing the color (importance level) of the entered pins was easy

19 13

9. Pin awareness sharing operations were easy

28 4

10. Picture of manga after pin awareness sharing operation were easy to view

26 6

11. When using pin awareness sharing operation, important scene search operations were easy

28 4

12. It was easy to distinguish other people’s pins from my own

21 11

13. It was easy to count the number of entered pins

28 4

N=32

p<.01,

p<.05,

n.s.

not significant 1: Positive answer, 2: Neutral and Negative answer

participants responding with a 5 or 4 were classified

as positive respondents; participants responding with

a 3, 2, or 1 were classified as negative respondents;

and the number of each type of respondents was

tallied. We determined the statistical significance of

the deviation between the number of positive

respondents and that of the neutral/negative

respondents by using a 1 × 2 exact test.

The results showed no statistically significant

difference between the number of positive

respondents and the number of neutral/negative

respondents for one item (Item 6: Pin awareness

sharing operations were easy). The number of

positive responses trended higher for three items

(Item 5: It was easy to color-code problem

importance levels by pin color, Item 7: The

operation for discarding entered pins was easy, and

Item 8: The operation for changing the color

(importance level) of entered pins was easy), with

the difference between the number of positive

respondents and the number of neutral/negative

respondents being statistically significant at the 5%

significance level. For each of the other 11 items, the

number of positive responses trended higher, with

the difference between the number of positive

respondents and the number of neutral/negative

respondents being statistically significant at the 1%

significance level.

Table 2 presents a tally of the responses received

for the items about sharing of awareness about

manga frames and a compilation of the results. We

analysed the results using the same procedure used

for the usage and operation items, determining the

statistical significance of the deviation between the

number of positive respondents and that of

neutral/negative by using a 1 × 2 exact test.

As a result, for each of the 9 items (such as Item

14: Sharing awareness enabled us to discover

differences in awareness about manga frames and

Item 20: Sharing awareness enabled a lively

discussion in the group), the number of positive

responses trended higher, with the difference

between the number of positive respondents and the

number of neutral/negative respondents being

statistically significant at the 1% significance level.

4 CONCLUSIONS

The experimental evaluation results demonstrated

the following two points: (1) The system’s interface

has effective operation. (2) The system effectively

promotes discussion based on shared awareness

about manga frames.

However, there is a need to improve the

convenience of the interface for the pin entry,

movement, and erasing functions. Specific changes

could include improving the response and mounting

a continuous operation method enabling flick-based

pin color selection and changes.

ACKNOWLEDGEMENTS

This research was supported in part by the Grants-

in-Aid for Scientific Research (A) (No. 24240100)

and JSPS the Grants-in-Aid for Scientific Research

(B) (No. 24330251).

CSEDU2014-6thInternationalConferenceonComputerSupportedEducation

450

Table 2: Questionnaire survey results of the sharing pin awareness about manga frames.

Items

14. Sharing awareness enabled us to discover differences in awareness about manga frames

31 1

15. When sharing, it was easy to distinguish my own pins from other people’s

23 9

16. Sharing awareness enabled us to discover differences in reasons for awareness about frames

29 3

17. It was easy to find manga frames in which many pins of the same color had been entered

31 1

18. It was easy to find locations where pins of different colors had been entered in the same frame

29 3

19. It was easy to decide on which manga frames to discuss

21 11

20. Sharing awareness enabled a lively discussion in the group

28 4

21.Simultaneous sharing awareness and discussion enabled a good understanding of other people’s

opinions

30 2

22. Simultaneous sharing awareness and discussion enabled explanations that were easy to

understand

29 3

REFERENCES

Daikoku, T., Funaoi, H., Kusunoki, F., Takenaka, M., and.

Inagaki, S. 2013.Development and Evaluation of Case

Method Teaching Materials using Manga on Tablet

PCs - A Trial with Pointing Type Annotations. In

Proceedings of the 5th International Conference on

Computer Supported Education 2013, pp.557-563.

Gess-Newsome, J. and Lederman, N. G (Eds.) 1999.

Examining Pedagogical Content Knowledge: The

Construct and its Implications for Science Education.

Kluwer Academic Publisher.

Kim, H., Nakayama, M. and Akahori, K. 2009. CinkNote:

A Tool for Annotation-based Discussion by Sharing

Hand-written Annotations Using Tablet PC. In

Proceedings of World Conference on Educational

Multimedia, Hypermedia and Telecommunications

2009, pp.3411-3415.

Mishra, P. and Koeher, M. J. 2006. Technological

Pedagogical Content Knowledge: A Framework for

Teacher Knowledge. Teachers. College Record,

108(6), pp. 1017–1054.

Reid, D. and Ostashewski, N. 2011. iPads in the

Classroom – New Technologies, Old Issues: Are they

worth the effort?. In Proceedings of World Conference

on Educational Multimedia, Hypermedia and

Telecommunications 2011, pp. 1689-1694.

Shulman, L. S. 1987. Knowledge and teaching:

Foundations of the new reform. Harvard Educational

Review, 57(1), pp. 1-22.

ImprovingtheUsabilityofManga-on-a-TabletforCollaborativeLearning

451