iLike - histproject.nohistproject.no/sites/histproject.no/files/iLike - D4_2... · 2014-11-20 ·...

This project has been funded with support from the European Commission. This publication

reflects the views only of the authors, and the Commission cannot be held responsible for any

use, which may be made of the information contained therein.

iLike

Identi fy ing the logic structure of languages by use of

new interact ive mobi le serv ices , new diagnostic

train ing methods for development of key

competencies , and new evaluat ion methods

introducing assessment for learn ing pract ices

Comenius multilateral pilot project 2012-2014

527585-LLP-1-2012-1-NO-COMENIUS-CMP

WP 4: Learning Activities Service Implementation

Deliverable 4.2: Guidelines for implementation of services

Author and editor: Pascal Pein

Co-authors: John B. Stav, George Adrian Stoica

Version: 2.0

Date: 17.11.2014

© Copyright 2014 The iLike Consortium

iLike 527585-LLP-1-2012-1-NO-COMENIUS-CMP

2

This document may not be copied, reproduced, or modified in whole or in part for any purpose

without written permission from the iLike consortium. In addition to such written permission to

copy, reproduce, or modify this document in whole or part, an acknowledgement of the authors of

the document and all applicable portions of the copyright notice must be clearly referenced. All

rights reserved.

This document may change without notice, but consortium members should be informed, and

number of version, stage and date should be given.

Project consortium

Sør-Trøndelag University College, Faculty of Technology, Trondheim, Norway

HiST Contract Research (HCR), Trondheim, Norway

Osnovna Skola “Drinka Pavlovic" (OS), Belgrade, Serbia

University of Thessaly (UTH), Volos, Greece

Centrum for Flexible Learning (CFL), Söderhamns kommun, Sweden


3

Table of Contents

Introduction ................................................................................................................................. 7

Design ........................................................................................................................................... 7

System architecture ................................................................................................................. 7

Basic data model .................................................................................................................... 10

Data formats used in communication ................................................................................... 10

Modifications and additions to the SRS engine ..................................................................... 11

Tag-words .......................................................................................................................... 11

Free text ............................................................................................................................. 12

Order words ....................................................................................................................... 12

Wordpool ........................................................................................................................... 12

iLike Language Webservice ................................................................................................ 12

Teacher client .................................................................................................................... 13

Sentence manipulator ................................................................................................... 13

Text collector ................................................................................................................. 13

Integration with iLike Language Webservice ................................................................ 13

Integrated web, image and encyclopedia search ......................................................... 13

Student client .................................................................................................................... 13

Requirements ............................................................................................................................. 14

Access to WiFi Network ......................................................................................................... 14

Running on Windows ............................................................................................................. 14

Running on Mac and Linux ..................................................................................................... 15

Implementation .......................................................................................................................... 15

Overview ................................................................................................................................ 15

Teacher Client .................................................................................................................... 15

Student Client .................................................................................................................... 15

Language Webservice ........................................................................................................ 15

iLike web service ................................................................................................................ 16

Achieved ............................................................................................................................ 16

Registration ............................................................................................................................ 17


4

Teacher client ......................................................................................................................... 17

Log in to system ................................................................................................................. 17

Starting a session ............................................................................................................... 18

Tag – words items .............................................................................................................. 19

Creating item ................................................................................................................. 20

Results ........................................................................................................................... 21

Text items .......................................................................................................................... 23

Creating item ................................................................................................................. 23

Results ........................................................................................................................... 23

Order words items ............................................................................................................. 25

Creating item ................................................................................................................. 25

Results ........................................................................................................................... 26

Wordpool items ................................................................................................................. 27

Creating the items ......................................................................................................... 27

Results ........................................................................................................................... 28

Manipulating text .............................................................................................................. 29

The text collector ............................................................................................................... 30

Integrated web searches ................................................................................................... 32

iLike Language web service integration............................................................................. 34

Sentence manipulator ....................................................................................................... 35

Student client ......................................................................................................................... 40

Tag-words .......................................................................................................................... 41

Text items .......................................................................................................................... 42

Order words items ............................................................................................................. 43

Wordpool items ................................................................................................................. 44

User interface improvements ................................................................................................ 45

Statistics tools ............................................................................................................................ 46

Results visualizations ............................................................................................................. 47


5

Index of Tables

Table 1 The most common webkit enabled browser that we have tested. A more extensive list can be found online. ................................................................................................................... 14


6

Figure Index

Figure 1: iLike System overview ................................................................................................... 8 Figure 2: iLike registration form ................................................................................................. 17 Figure 3: iLike Teacher client login screen ................................................................................. 18 Figure 4: iLike session dashboard screen ................................................................................... 19 Figure 5: Session code example ................................................................................................. 19 Figure 6: Tag-Words - adding item ............................................................................................. 20 Figure 7: Tag-Words editor with entered text ........................................................................... 21 Figure 8: Tag-Words results shown in a paragraph histogram .................................................. 22 Figure 9: Tag-words results shown in a classic horizontal histogram ........................................ 22 Figure 10: Selecting text item..................................................................................................... 23 Figure 11: Text item results presented as a frequency list ........................................................ 24 Figure 12: Text item results shown as word cloud ..................................................................... 25 Figure 13: Text drop targets showing while dragging text ......................................................... 30 Figure 14: Text added to the collector using a text drop target ................................................ 31 Figure 15: Application menu with the collector icon highlighted .............................................. 31 Figure 16: Drooping a word on the encyclopedia search drop target ....................................... 32 Figure 17: Embedded browser opened in wikipedia after "buoy" word is dropped onto the corresponding drop target ......................................................................................................... 33 Figure 18: Embedded browser opened in google images after "buoy" word is dropped onto the corresponding drop target ................................................................................................... 33 Figure 19: iLike language service synonym search opened via drop target............................... 34 Figure 20 iLike language service verb search opened via drop target ....................................... 35 Figure 21: Sentence manipulator- edit view .............................................................................. 36 Figure 22: Sentence manipulator - tagging view; manual tags added to some words .............. 37 Figure 23: Sentence manipulator automatically added tags ..................................................... 38 Figure 24: Sentence manipulator - synonym search ................................................................. 38 Figure 25: Sentence manipulator - verb search, showing the first stage................................... 39 Figure 26 Sentence manipulator - verb search, showing the second stage .............................. 39 Figure 27: Student client login screen ........................................................................................ 40 Figure 28: Student client showing an unanswered tag-words item .......................................... 41 Figure 29: Student client showing an answered tag-words item ............................................... 41 Figure 30 Student client showing an unanswered text item ..................................................... 42 Figure 31: Student client showing an answered text item......................................................... 42 Figure 32 Student client ............................................................................................................. 43


7

Introduction

The iLike LLS (iLike Logic Learning Services) system developed within the frame of the iLike project

aims to provide the teachers and the students with a set of services that enable them to:

investigate, manipulate and produce interactive language content by use of the latest

mobile technology

start using a new engaging channel for distribution and interactive restructuring of

language content

build entrepreneurial peer involvement through interaction, communication and

immediate feedback in- and outside class

apply new evaluation methods by use of peer learning assessment practices that utilize a

new language diagnostic method

The underlying technology for the services is based in part on the SRS and PeLe technology.

The system was developed using an iterative prototyping process. In the design process have been

involved the main system stakeholders: teachers and students. The very context of use dictates that

a special emphasis must be placed on the human computer interaction aspects. The educational

activity must be supported in a transparent and usable way.

Design

System architecture

The system is based on a client-server architecture and the communication between the

components is over the HTTP protocol. The main components of the system (Figure 1) are: a server

application, a NLTK based language service, a student client application and a teacher control

application. The responsibilities of each component are defined as follows:

The server component includes the iLike webservice, the back end database (that in our

case is collocated with the webservice, but by no means restricted to be collocated) and

portal pages. The server also hosts the students' web app. The web service manages the

central data model and keeps the entire system in a consistent state at all times. It provides


8

an interface to remotely modify and read the productive resources following the

"Representational State Transfer" (REST) principles. The web service is the main

communication node and its data represents the "truth", if synchronization issues occur.

the iLike Language Webservice is a NLTK (Natural Language Tool Kit) based service that

allows the teacher client to obtain automatic grammar tagging, verb tenses and word

synonyms.

The teacher software is responsible for modelling the workflow for a given use-case. This is

achieved by modifying the data inside the web service according to the required work-flow.

The teacher role is granted write access to various parameters which allow for shaping a

custom work-flow.

The student software usually reacts to the actions of the teacher. Again, the user interface

has to implement the workflow for the respective use-case. A central aspect of the student

client is the ability of being remotely controlled. According to the state of the data

maintained in the web service, the student client may entirely block input or provide

restricted read/write access to a set of resources.

Apart from the main basic components the system includes few other components that aim at

improving of the user experience and facilitating the system maintenance:

The authentication service allows integration with other authentication methods and also

allows the scenario when one user is accessing several servers.

Figure 1: iLike System overview


9

The autoupdate service allows the teacher client to update over the internet. When a new

build is available it is published on the autoupdate location. The teacher clients will check

that location periodically and will notify the user to update.

The zero configuration service allows the teacher client to automatically retrieve the

required information to connect to a certain server.

The iLike system is a web service in combination with use-case specific clients. During lectures, the

system is controlled by the teacher and the student clients react according to the situation, thus

generating an interactive environment with immediate feedback between teacher and students.

The ability of reacting to the teacher's actions poses certain challenges in the implementation, as

the HTTP protocol does not specify a reliable back-channel for browsers yet. Possible approaches to

address this issue are polling, long-polling or web sockets where each of which undeniably has

specific drawbacks.

In this interactive environment, both the teacher’s as well as the student’s tools are designed to be

streamlined. The amount of available options is kept small and the important functionality for the

targeted workflow can be reached with a minimum amount of interactions. A quick interaction with

the service is necessary because of the time pressure created in the interactive environment.

Neither teacher nor students should get distracted or overwhelmed by special functionality. Any

delay in usage of the tool directly causes the other users to wait for the intended change.

Outside the lecture, other clients (e.g. a dynamic web page) are available to work on the resources

that have been collected inside the classroom. These tools can offer a rather complex user interface

as the time pressure of a live system does not apply here. Typically, the teacher may create new or

modify the existing content. Further, both teachers and students have read access to the collected

data. Naturally, the teacher is allowed to see all data related to his/her lectures. Students usually

only have access to unlocked data, further filtered for personal content. The data of other students

remains entirely invisible.


10

Basic data model

The system data model includes data structures mainly for assessment definition, assessment

results and users. In the data model referring to the assessments we considered three levels:

Assessment, Section, Item (ASI). An assessment is considered to be a single working unit that is

created by an instructor and used for a specified task, e.g. one single lesson during a course. Each

assessment can have one or more sections which in their turn can contain items. An assessment

item corresponds to a single question.

The ASI resources have assigned to them a set of metadata properties. The most important

metadata properties refer to the resource state and the current resource inside the “container

resources” (i.e. the currentSection for the assessment and the currentItem for the section).

The access to the resources is accomplished through the REST commands. The operations available

for each resource at a given moment in time are dependent on the resource state and the role of

the user requesting the operation. For example, the teacher has the possibility to create new

instances on each individual level and can also assign various states to every single resource. These

states are controlling the accessibility, i.e. allowing or disallowing certain levels of interaction

(reading/writing) of the students of a resource.

Data formats used in communication

The messages exchanged between the system components use a number of formats. The system

supports one standard format, i.e. "IMS Question & Test Interoperability Specification" (QTI), and

also proprietary formats in XML and CSV. Unfortunately, version 2 of the QTI specification was not

finished except for a draft for the items (at the time of the design and beginning of the

implementation). Therefore the older, yet complete version 1.2 has been selected as the main data

model. From the QTI format only the relevant elements have been included in the implementation

and also several additions have been applied mainly in the form of specific metadata. The QTI

format proved to be inefficient for scenarios when the clients need often updates so the proprietary

formats have been introduced. The proprietary XML supports two levels of detail: complete results

and summarized results. To further improve the response time and reduce the network traffic

demands we have also added a CSV format. The CSV format reduces considerably the amount of

data that needs to be transferred for updating a specific client (e.g. the teacher client).


11

Modifications and additions to the SRS engine

The iLike software is based on the previously available SRS engine and adds a great deal of new

functionality. Based on the user requirements, the main areas are:

Required response types

Tag Words

Free Text / Open Text

Order Words

Wordpool

iLike Language Webservice (NLTK-based)

Teacher client additions

Handling new response types

Definition

Visualization

Sentence manipulator

Text collector

Integration with iLike Language Webservice (synonyms, verb tenses, sentence

analysis)

Integrated web, image and encyclopedia search

Student Client


Tag-words

The tag words feature has been designed on top of the multiple choice items from the SRS engine.

We have diversified the multiple choice items and added metadata properties to indicate how the

items must be rendered on the clients. The consequences on the clients:

the student client needs a new interface that allows rendering of such items in a flow

layout that allows selections and deselection of individual words.

the teacher client needs an interface to allow the user to define the text to be used in the

item. Additionally it needs the visualization tools to show the data aggregated from the

class. For this purpose we have designed the "paragraph histogram" visualization


12

Free text

This is a new response type that has been added. The data models from both the clients and the

server needed to be adjusted so that we account for more response types. The student client

requires a new interface to allow answering the free text items. The teacher client needs the

modifications to create free text items and also it needs appropriate visualizations for the received

answers. The visualizations designed are aggregating the responses and include a frequency based

list of answers and a word cloud. Both visualizations allow interactions.

Order words

“Order words” is another new response type that has been added. The teacher needs to send a list

of words that need to be ordered by the students based on some criteria decided by the teacher.

The student client requires a new user interface control that allows re-ordering of the words

received from the service. The teacher client needs the modifications to create order words items

and also it needs appropriate visualizations for the received answers. The visualizations designed

are aggregating the responses and include a frequency based list of answers. The visualization

allows interactions like dragging an answer to designated drop targets in order to further work with

the received text.

Wordpool

“Wordpool” is yet another response type that has been added. The teacher needs to send two lists

of words that can be used by the student to form the answer to the teacher question. One list is

displayed in the placeholder for the final answer, while the second list is displayed in the

placeholder for the word pool (words that can be included in the answer if desired). The student

client requires a new user interface control that allows managing and re-ordering of the two sets of

words received from the service. The teacher client needs the modifications to create wordpool

items and also it needs appropriate visualizations for the received answers. The visualizations

designed are aggregating the responses and include a frequency based list of answers and a word

cloud. Both visualizations allow interactions.

iLike Language Webservice

The language web service is a separate tool that can be used by any client software whenever

needed. It is not an integral part of the iLike web service but provides additional language tools for

the user. The service offers three main functions for the English language:


13

The service returns a list of annotated synonyms for any given word.

The service returns a list of all tenses and forms for a given verb in any form.

The service returns grammatical tags for each word in a given and syntactically correct

sentence.

Teacher client


The sentence manipulator is a component that allows the teacher to do a number of operations on

a given text. The teacher can use the iLike language service to directly access synonyms, verb tenses

and grammatical tagging.

Additionally the teacher can change the order of the words, can add and remove words, change the

case of the words, edit the text in alternative ways, add grammatical tags manually.

Text collector

To facilitate the use and reuse of chunks of text we have designed "the collector" that allows the

user to collect bits of text in a list that is easily available. There are several ways to get the text into

the collector. The collector can be used to pick interesting elements from the results or virtually

anywhere.

Integration with iLike Language Webservice

The teacher client integrates the iLike Language services into the available operations in the UI. On

one hand the sentence manipulator allows access to these services. On the other hand, words can

be dropped on special target / zones to get synonyms or verb tenses from the same iLike language

services.


The text elements from the teacher client user interface can be dragged and dropped onto special

zones that allow querying various internet search engines such as: web search, image search and

encyclopedia search.

Student client

The main modifications in the student client are addressing the additional response types. The

rendering style of the items significantly differs from the simple multiple choice list. In order to


14

support the Tag Words, the client needs to change the layout of the available options into

something that closely resembles a written text. For free text responses, the client needs to provide

a text input box and also has to deal with UTF-8 encoded text to support language specific

characters. The third response type where words have to put into the correct order again requires a

task specific interface. In this case, the word layout should also resemble a sentence layout but also

allowing the user to drag and drop individual words into other positions. Finally a similar but more

elaborated user interface is required for the wordpool items that need to allow an additional list of

words that might be included in the answer.

Requirements

Access to WiFi Network

In order to be able to run iLike in the classroom you need a good coverage of a stable WiFi Network

in the room. Students join the sessions using most kinds of web enabled devices like, iPod, iPad,

iPhone, Android phones or computers. The only requirement is that the web browser is a webkit1

based web browser. You find a short list of browsers in Table 1 below.

Table 1 The most common webkit enabled browser that we have tested. A more extensive list can be found online.2

Computer Browser Status

PC Chrome

Safari

Mac Safari

iOS Safari

Android Dolphin

Running on Windows

The system had been developed and tested mainly on windows. However, the air application can

run on other operating systems that support the Adobe Air run-time.

We have intentionally kept the implemented application at a compatibility level that coincides with

the last supported version for Linux. The support for Adobe Air on Linux has been dropped by

Adobe in favor of mobile platforms, but they kept the support for Mac OS.

1 http://en.wikipedia.org/wiki/WebKit 2 http://en.wikipedia.org/wiki/List_of_web_browsers#WebKit-based


15

Running on Mac and Linux

The system needs further testing to optimally run on Mac OS and Linux. Even if the run-time at the

base is smoothing out the differences between the platforms there are still issues with certain

features.

In some instances we have encountered problems with the way transparent windows are treated.

Moreover there are differences between the operating systems in the way they treat the always on

top windows.

Implementation

Overview

Teacher Client

The teacher client is implemented in Flex (Actionscript and Adobe Air). This allows the teacher to

connect to the services and create sessions, items in sessions and to manipulate text and

visualizations in order to support the discussions with the students.

Student Client

The student client is implemented in Sencha Touch 2. This allows the users to download the latest

version of the software by simply visiting the web age instead of installing a piece of software

before use. The Sencha Touch library is working together with all recent iOS and Android devices as

well as several web browsers on PCs and laptops.

The software allows the teacher to control the behavior of the student clients and thus guiding

them through the lecture. The teacher can push tasks to the student devices and collect their

responses in a short amount of time.

Language Webservice

The language webservice provides a simple HTTP interface to request the various services. It is

implemented by a set of Python scripts on top of the NLTK library. The scripts are transforming the

user requests into NLTK queries and back into XML responses that can be used by the client.


16

iLike web service

The iLike web service is implemented in Java. It provides a REST interface to manipulate QTI-

inspired resources containing tasks and the collected responses. The service keeps the entire data

model in a consistent state. Clients have the possibility to read and modify the resources based on

their particular user role. In order to provide a push-functionality through HTTP, a long-polling

approach is applied to keep the server load at a reasonable level while ensuring virtually immediate

reactions on all connected clients. The back-end of the service is using a SQL database for

persistence.

Achieved

Required response types

Tag Words

Free Text / Open Text

Order words

Wordpool

iLike Language Webservice (NLTK-based)

Teacher client additions


Definition

Visualization


Text collector

Integration with iLike Language Webservice (synonyms, verb tenses, sentence

analysis)


Student Client additions



17

Registration

To be able to use the system some of the users are required to register into the system.

The teachers need to register in order to use the system. After registration an administrator or

system manager must assign the teacher role to the newly registered user in order to give him the

teacher rights. The students can participate anonymously to the sessions but they could also

register if desired.

The users can register using the portal page. The registration form is available at the desired server

(e.g. http://ilike.stimuli.no/ilike/registration.jsp).

Teacher client

After installing the teacher application3, the user can start it by clicking the corresponding icon in

the start menu / desktop.

Log in to system

The user is greeted by the log in screen that allows her to start using the system.

3 available at http://update.stimuli.no/autoupdate/ilike/stable/get.jsp

Figure 2: iLike registration form


18

The user needs to enter her chosen user name and password. In order to automatically fetch

connection details the user needs to add @ilike suffix to the username.

If the login process is not successful the user will be notified by the system and the cause of the

failure will be indicated as best as possible from the available data.

Starting a session

After logging in to the service the teacher can create a new iLike session that can be joined by the

students (using devices with the iLike Student Client) in order to participate in the activity

Additionally the teacher can continue working with an existing session if so desired.

If the user chooses “New session” then a new iLike session will be created on the server. The

session contains a section that allows items to be added one by one as needed by the lecture

rhythm. The student can now join the newly created session. On the other hand, if the teacher will

choose to use an existing session he will be presented with a list that contains his recent sessions

that are opened. If needed, he can get more sessions to select from by clicking on more.

Figure 3: iLike Teacher client login screen


19

After the session has been selected, the currently active session (i.e. the session code that allows

participants to join the activity) is displayed in the top left corner of the screen.

The teacher client can handle multiple-choice items in a similar manner as the underlying SRS

technology. However, it can handle also the additional response types that are typical to language

learning as resulting from our processes for eliciting requirements from the main stakeholders.

Tag – words items

One type of iLike specific item is Tag-Words. In essence the user enters a block of text and asks the

participants to select the words that have a certain function (such as: verbs, words with a certain

meaning, etc.)

Figure 4: iLike session dashboard screen

Figure 5: Session code example


20

Creating item

After creating or joining a session the teacher client will automatically enter the mode for creating

new items. To access this mode from other perspective one needs to click the button with an icon

resembling a raised hand. In this perspective a controller is available that allows the users to start

and stop items. To add a Tag-words item to the session one needs to select the “Tag-Words” option

in the possible item list. After selection, a window will be displayed that allows the user to enter the

desired text (see Figure 7).

The text can be typed in or dragged over from the “Collector” or other compatible source (a results

window, a synonym list etc.) The window shows bellow the text how the text will be split into

individual words so that the teacher can easily verify if the result is the desired one.

Figure 6: Tag-Words - adding item


21

After entering the desired text the user needs to click the play button on the controller to start the

item. The connected student clients will update their screens accordingly.

Results

After the time is up or when the teacher decides to stop the item a visualization that aggregates the

answers from the students is displayed. The visualization is showing the text with bar over each

word, like a combination between a paragraph and a histogram, hence the name of paragraph-

histogram visualization. (Figure 8)

The teacher can use this to highlight words in the text in different ways to show if the selection was

correct or wrong or simply to emphasize something for discussion.

The user can display the results in a classic histogram as well, but this is normally suitable just for

really short texts (see Figure 9).

Figure 7: Tag-Words editor with entered text


22

Figure 8: Tag-Words results shown in a paragraph histogram

Figure 9: Tag-words results shown in a classic horizontal histogram


23

Text items

Text items allow the participants to send in a freely typed text. The tasks that can be created with

this type of item are quite varied.

Creating item

To create the text item one needs to select the “Text” from the list of the available item types in the

controller options. After adjusting the rest of the other settings as needed (time, ticking sound etc.)

the user can click on the play button to start the item.

Results

After the students have sent their answers the results can be shown in a list or in a word cloud. The

list is a frequency reduced list of entire answers that is particularly useful when several answers

might be the same (such as when they are asked to translate a heard / written word, spell a heard

word, type a certain form of a verb etc.) (Figure 11)

The results can also be shown as a word cloud (Figure 12). When the results are shown in this form

Figure 10: Selecting text item


24

the answers are broken down into composing words and the entire list of words is reduced by

frequency. This type of visualization is particularly useful when there is a lot of variation in the

received answers. Also this allows to easily extract key words, terms and notions from the collective

produced text.

The texts from both the list and the word cloud can easily be dragged and dropped into collector for

later use or into integrated web searches.

Figure 11: Text item results presented as a frequency list


25

Order words items

Order words items allow the participants to send in a set of predefined words ordered in a specific

way. The tasks that can be created with this type of item are quite varied. For example the students

might be asked to form meaningful and correct sentences from randomized lists of words, place

punctuation elements in the correct place etc.

Creating item

To create the text item one needs to select the “Order words” from the list of the available item

types in the controller options. An appropriate item editor will be displayed. Then the user needs to

place a list of words that should be ordered by the students, in the editor. After adjusting the rest of

the other settings as needed (time, ticking sound etc.) the user can click on the play button to start

the item.

Figure 12: Text item results shown as word cloud


26

Figure 13: Order words editor

In the order words editor the user can type the words and see immediately below the text box the

recognized tokens (elements that will be possible to order on the student interface). Moreover the

user can drag text from a compatible source onto the editor (from collector or maybe some answer

list)

Results

After the students have sent their answers the results can be shown in a list. The list is a frequency

reduced list of entire answers that is particularly useful when several answers might be the same.

The frequency list is much more relevant for aggregating the answers from order words items than

it is for the open text ones. The ordering is much more likely to bring many similar answers as the

choices are less than in open text. Also the ordering words items avoid problems with typos,

additional spaces, character casing and other irregularities that are inherent to the text entry,

especially on the mobile devices.


27

Figure 14: Order words item results

Wordpool items

Wordpool items allow the participants to send in a part of a set of predefined words ordered in a

specific way. The tasks that can be created with this type of item are quite varied. For example the

students might be asked to form meaningful and correct sentences from randomized lists of words,

place punctuation elements in the correct place, change the verb forms, correct sentences by

removing mistaken words etc.

Creating the items

To create the text item one needs to select the “Wordpool” from the list of the available item types

in the controller options. An appropriate item editor will be displayed. Then the user needs to

provide the lists of words that should be ordered by the students, in the editor. After adjusting the

rest of the other settings as needed (time, ticking sound etc.) the user can click on the play button

to start the item.


28

Figure 15: Wordpool editor

In the wordpool editor the user can type the text for both the words that are by default included in

the answer as well as the ones that are included in the available elements that can be included in

the answer.

Results

After the students have sent their answers the results can be shown in a list or in a word cloud. The

list is a frequency reduced list of entire answers that is particularly useful when several answers

might be the same. The wordpool items allow a bigger variation in the answers (depending greatly

on the task given to the students) compared with the word order items. Thus, depending on the

task sometimes it might be more appropriate to view the results in a word cloud rather than a list.

Wordpool items avoid as well problems with typos, additional spaces, character casing and other

irregularities that are inherent to the text entry, especially on the mobile devices.


29

Figure 16: Wordpool results shown in a frequency list

Manipulating text

In the iLike teacher client there are a lot of text elements that can be drag and dropped. The texts in

the results, collector, tag-words editor, sentence manipulator etc. can be dragged and dropped on

to specific zones that allow various actions to be performed in a fast and easy manner. Additionally,

the sentence manipulator, collector and the tag words editor allow text to be dropped into them.

The specific zones (text drop targets) allow the user to select a default action to perform when

something is dropped in that specific target. There are three main drop targets: integrated web

search, text collection and manipulation and integrated iLike language web service.


30

To collect text from outside of the application (from a text file, office document, browser etc.) one

can drag and drop the text over the iLike application button. Basically click the button to minimize

the iLike teacher client and then just drag drop the text over the button to collect the text.

The text collector

The collector window allows the user to gather blocks of texts for later use. For example user

answers can be dragged from the result list, individual words from the word cloud and so on.

Figure 17: Text drop targets showing while dragging text


31

The text bits can be added to the collector in several ways: drop text on the iLike button, drop text

on the text drop target resembling a list, with the action selected “Add to list” or if the collector is

opened already one can directly drop text in the list.

To open the collector one can use the main application button:

The text from the collector can be used to create new tag-words items without any need to type or

to discuss and explore the text using the manipulator tool.

The texts in the collector can be removed individually by cli9cking the “x” to the right of selected

item or by purging the entire list contents by clicking the trash can icon to the bottom of the

window.

Figure 18: Text added to the collector using a text drop target

Figure 19: Application menu with the collector icon highlighted


32

Integrated web searches

The iLike teacher client has an integrated web search facility. One of the text drop targets is

destined for these kinds of operations. One can easily drag and drop a word or a phrase from any

draggable text source in the application in order to make a web search, image search or an

encyclopedia search.

In the Figure 20 it is shown how the user is about to drop a word on the encyclopedia search text

drop target. When the word is dropped the application will open an embedded browser window

that will show in this case a Wikipedia page (Figure 21).

Figure 20: Dropping a word on the encyclopedia search drop target


33

In a very similar manner the user could search for images using Google image search

When a drop target has a text inside it will stay visible allowing the user to easily switch between

the integrated web searches from the same search term. Additionally the word in the drop-target

can be dragged directly onto another drop target to trigger another action.

Figure 21: Embedded browser opened in wikipedia after "buoy" word is dropped onto the corresponding drop target

Figure 22: Embedded browser opened in google images after "buoy" word is dropped onto the corresponding drop target


34

iLike Language web service integration

The iLike Language web service integration is achieved in two main ways: specialized drop target

that allows synonym and verb searches and sentence manipulator functions for tagging, synonyms

and verb tenses.

The synonyms search is triggered by dropping some search term on the corresponding drop target.

This action will open the results for the search in a special window.

The various synonyms are presented in a list that has expandable elements. In the first level there

are the explanations and in the second level are the actual synonyms and examples if available.

The verb search will show a table with the various forms if the verb can be processed by the service

(or if the search term is indeed a verb).

Figure 23: iLike language service synonym search opened via drop target


35

In a similar manner with the web searches the actual service query can be switched from synonyms

to verbs by just clicking the drop target and selecting the desired service.

The integration part that concerns the sentence manipulator will be presented in the next section

that deals with the sentence manipulator tool.


The sentence manipulator is a tool that aims to facilitate language exploration and discussions

under the teacher guidance.

The text is presented as a list of words that can be reordered, tagged, edited or removed as

pleased.

In the manipulator there are 2 ways of selection. One is the default way that for multiple selection

requires pressing the CTRL or SHIFT keys (mode that is suitable for desktop use) and another way

that is toggling token selection by simple click (mode that is suitable for smart board usage)

In the edit view the user can change the selection mode, perform basic clipboard operations, edit

individual token, delete tokens, reorder the tokens and also change the case for the various tokens

Figure 24 iLike language service verb search opened via drop target


36

to sentence case, lower case and upper case.

Figure 25: Sentence manipulator- edit view


37

In the tagging view the user can attach tags to the words and control which tags are visible. The tags

can be added either manually or by the use of the iLike language web service4

4 The automatic tagging is based on NLTK engine. The results are not always correct especially for complex phrases, incorrect sentences and awkward topic.

Figure 26: Sentence manipulator - tagging view; manual tags added to some words


38

The sentence manipulator is integrated with the iLike Language web service for synonym and verb

searches as well. A synonym from the list can be replaced into the text. The same is for the verbs,

where the user can change the verb.

Figure 27: Sentence manipulator automatically added tags

Figure 28: Sentence manipulator - synonym search


39

When the user makes a verb search the first stage will allow selection of the main point in the time

(past, present or future). In the second stage the user has more options to select the desired verb

form.

Figure 29: Sentence manipulator - verb search, showing the first stage

Figure 30 Sentence manipulator - verb search, showing the second stage


40

Student client

In order to connect to the iLike session the student needs to load the student client app in to a

compatible browser (webkit based browser as described in the requirements section).

This client is available at http://ilike.stimuli.no/ilike/plugins/app2/?mode=ilike

After loading the app the student needs to enter the same session code as the one that is currently

active and shown in the teacher client in order to join that particular session.

After joining in the client will react to the changes made by the teacher displaying the appropriate

user interface elements so as to allow the student to reply to the questions.

Figure 31: Student client login screen


41

Tag-words

When the teacher creates a tag-words item in the session the connected students will see in a short

while the corresponding interface for responding to that particular item. Initially the text is enclosed

in a red border showing that there is no current answer saved.

The student can simply click / tap the words he desires to select according to the task and the

instructions received from the teacher.

When tapping the words these change the background to suggest that they are selected and part of

the answer. If saving the answer fails, the user is notified via a message dialog announcing the error

and asking the user to retry to save the answer.

The answers are saved gradually on the server. Each new selected or deselected word will be

immediately sent to the server.

Figure 32: Student client showing an unanswered tag-words item

Figure 33: Student client showing an answered tag-words item


42

Text items

When the teacher creates a new text item within the session, all connected student clients will

show the corresponding user interface for the text item answering. This is basically a minimalistic

interface showing just a text box where the users can type in their answer.

In a same manner as with the tag-words and also multiple choice items, before having some answer

saved the text box will feature a red border indicating that the answer is not existing yet on the

server (no answer at all or it is not saved yet).

After the user types the desired answer, it is enough to just tap / click away from the text box in

order to save the answer to the server or click the “Save answer” button in some versions.

Figure 34 Student client showing an unanswered text item

Figure 35: Student client showing an answered text item


43

Order words items

When the teacher creates a new order words item within the session, all connected student clients

will show the corresponding user interface for the text item answering. The user interface shows a

list of boxes that each contains a text token (word or punctuation mark).

The user can tap and drag the boxes around in order to change their order. In a same manner as

with the other item type interfaces, before having some answer saved the text box will feature a

red border indicating that the answer is not existing yet on the server (no answer at all or it is not

saved yet).

Figure 36: Student client showing an order words item


44

Wordpool items

When the teacher creates a new wordpool item within the session, all connected student clients

will show the corresponding user interface for the text item answering. The user interface shows

two lists of boxes that each contains a text token (word or punctuation mark). The top list is the

answer the student is sending while the bottom list contains the words that might be used in the

answer.

The user can tap and drag the boxes around in order to change their order. The boxes with text

tokens can be moved within the list or move from one list to another allowing the users to either

change the order of the tokens or to add or remove tokens from the answer.

In a same manner as with the other item type interfaces, before having some answer saved the text

box will feature a red border indicating that the answer is not existing yet on the server (no answer

at all or it is not saved yet).

Figure 37: Student client showing a wordpool item


45

User interface improvements

The user interface has got several improvements in the final version of the software. The collector

and the answer lists will display the text of the selected items with larger fonts making it more

visible for use on a smart-board or projector.

The text results allow turning on and off the additional whitespaces (blanks, tabs new lines, etc.),

the punctuation and case sensitivity. This way the teacher can reduce the variations in the answers

so that it is possible to manage the feedback from the class in a better way.

Many windows can be pinned, including the collector and one of the results windows allowing the

teacher to link a new item to the results of a previous item or to easily get the text from the

collector to create new items. For pinning results windows the window pinning has been integrated

to the pinning feature of the results bin to achieve a more consistent experience.

Several defaults settings have been adjusted in order to accommodate the actual patterns of use

from the teachers and students. For example the default interval for the countdown timer has been

increased from 20 seconds to a minute and by default the timer is disabled. The default size for the

results windows was adjusted to better suit most common usage.

The results bin has been improved to show the type of the question for all the types added.


46

Statistics tools

In the frame of the iLike project another new tool has been developed that aims to allow the

teacher to explore statistical data about a class over a period of time. The supported data includes

PeLe tests. The tests feature multiple choice items and can be used in the language learning

activities. These tests can be produced using the PeLe tool that was developed in the frame of

another project.

The statistics tool prototype allows the user to select a number of tests and from those it will

generate a number of visualizations. Teachers can track single students or a set of predefined

groups of students that are formed based on a grouping strategy. The grouping strategy needs

further research in order to identify optimal strategies for grouping students.

Figure 38: Statistics tools test list

In the test list the user can search tests by various criteria or order them as he wishes in order to

select the ones of interest at the time.

After selecting the desired PeLe tests the teacher can select the “Statistics” icon to open the

visualizations. The visualizations include graphs and tables for results, participation and so called

risks.


47

Results visualizations

There are various results visualizations possible. Each of the available visualizations suits better

some type of task. There are column charts allowing the user to focus on a few students and to

compare students and the available predefined groups of students. There are also line charts that

would suit well spotting trends and eventually outliers in the group. Other types of graphs include

bubble charts, either animated or static. User can drill down into the data and consult also detail

charts for a single test.

Overview column charts

One way to view the results from several tests is to examine the average scores for each test for

either student groups or individual students.

Figure 39: Results visualizations showing a column chart with 2 groups plotted along with the standard deviations and averages

Depending on the size of the student group the standard deviation may be or may be not relevant.

In the Figure 39 it is depicted a graph representing the average scores for 2 student groups over 4

tests. On the x axis we have the tests in chronological order while in the y axis we have the relative

score (in percent) to allow comparisons between tests that have different nominal total scores.

In each test we have column group containing the currently selected groups and in the background

we might have indicated the average and the standard deviation corridor.


48

On the same type of chart we could plot columns for individual students. (Figure 40)

Figure 40: Column chart with both groups and students

Overview line charts

The line charts plot same data as the previously described column charts

Figure 41: Line chart with lines for groups and students


49

In the Figure 41 it is depicted a graph representing the average scores for the 3 student groups over

4 tests and one individual student. On the x axis we have the tests in chronological order while in

the y axis we have the relative score (in percent) to allow comparisons between tests that have

different nominal total scores.

In the graph it is possible to have again the average line and the standard deviation corridor.

Bubble charts

The bubble charts depict groups of students over a period of time showing also variations in the

group sizes and not only their average performance. We have 2 types of bubble charts: motion (or

animated) bubble charts and static bubble charts.

Motion bubble charts

In motion bubble charts the user can go from test to test with the transition between the states

being animated showing trends in group sizes and performance.

Figure 42: Motion bubble chart

The user can play the animated chart or he can manually move from one test to another using a

slider.


50

Static bubble charts

In the static bubble charts all the bubbles for each test are shown in side by side columns.

Again on x axis we have the tests and on the y axis we have the score in percentage to allow

comparisons.

Figure 43: Bubble chart detail view (after clicking on a bubble)

The size of the bubbles is proportional to the number of the students in the bubble. Clicking on a

bubble will display detailed information for the people in that group. (Figure 43)


51

Additionally, on the bubble charts there is depicted also the “Missing group” i.e. the students that

are found in the other tests but not in this particular test

Detail charts

For each test it is possible to get couple of detail charts: a distribution chart (that uses 5% bins to

create the distribution) and a column chart that shows the average scores and standard deviations

(if desired) on each individual question in the test.

Figure 44: Detail chart with per question averages and standard deviations

I the detail chart in Figure 44 we can see the average columns for each question in the test.

Additionally, it is possible to see the average line and the standard deviation corridor. Again the

relevance of such view is dependent on the complexity of the individual questions scoring and the

possible variations in each question score. Equally important for the relevance of the annotation

elements is the size of the class.


52

Figure 45: Distribution chart for a test

Participation

The participation chart allows the teacher to see which students did not attend all the tests.

Figure 46:Participation chart


53

Depending on the user options the values above a certain threshold could be highlighted on the

graph by means of different column color.

The participation chart can be combined with the risks chart. The participation is calculated based

on the union between the participants in all the tests selected for analysis

Risks

The risks chart indicates the number of times a student performed really poor at a test in which he

participated. One way to assess that is looking if the student score was below the average minus

the standard deviation. Another way is to just look if the student score was bellow a teacher

selected threshold.

Figure 47: Risks chart

Based on a certain threshold the column color for a user in risk can be highlighted. The participation

can be stacked on top of the risks


54

Overview table

In addition to all the charts the user has the possibility to consult a table that has overview

information about all the students.

Figure 48: The overview table

The overview table provides information for each score obtained by each student in each of the

tests along with the total average, number of participations and the number of times in the risk

zone.

iLike - histproject.nohistproject.no/sites/histproject.no/files/iLike - D4_2... · 2014-11-20 ·...

Documents

Transcript of iLike - histproject.nohistproject.no/sites/histproject.no/files/iLike - D4_2... · 2014-11-20 ·...