CS 402: Design, Development and CS 402: Design, Development and Evaluation of Educational SoftwareEvaluation of Educational Software

Nikos Athanasis - Nikos Naoum - Nikos Bertes - Antonis Apostolidis

NCSANCSA

National Center for Supercomputing Applications.

Opened to the national research community in January 1986.

A high-performance computing and communications facility designed to server U.S. computational science and engineering communities.

NCSA HabaneroNCSA Habanero

A set of applications and a collaborative framework.

You can create and work in shared applications from remote locations over the Internet. The framework enables developers of groupware applications to build powerful collaborative software in a reduced amount of time.

NCSA HabaneroNCSA Habanero[cont][cont]

Through Habanero you can interact with other people on the Internet using a variety of applications that share state and events.

The framework provides the necessary methods that make it possible to create or transition existing applications and applets into collaborative applications.

The Habanero The Habanero EnvironmentEnvironment

The environment includes a server that hosts sessions and a client that interacts with sessions using a variety applications called Hablets.

The client defines, lists, creates, joins or interacts with a session.

The client is capable of interacting between multiple sessions, each with multiple tools.

The Habanero ServerThe Habanero Server

The server is a process that runs in the background and does not have a GUI.

It links the clients during a collaborative session. Only one server is required for each session and all participating clients connect to that single server. Sessions are defined and distinguished by their session name, machine name or IP number and the listening port number.

The Habanero ServerThe Habanero Server[cont][cont]

The server is typically started from a script or a command line.

The Habanero clientThe Habanero client

When you first start the Habanero client it appears in session definition mode with the basic feature set.

The Habanero clientThe Habanero client[cont][cont]

Creating or joining a session is achieved by typing the session name, server name and port number into the appropriate fields or by selecting a session definition from the session definition list.

The Habanero clientThe Habanero client[cont][cont]

After the session data is set, click the button and Habanero will attempt to make a connection with the server and join the defined session.

The Habanero clientThe Habanero client[cont][cont]

When the join request is successful the client will open into the session mode.

The Habanero clientThe Habanero client[cont][cont]

After the active applications are open the user is able to interact with the other members of the session.

Most actions he takes within an application will be shared with the other members of the session. For example, if he closes a window it will close for everyone.

MenusMenus

Mail:Mail: Opens the Mail Composer. Edit ID Card: Opens a window that

contains the users identification data. User Options:

– Network: email server and email address.

– Notification: How the client will notify other users when creating a session.

– HTTP Proxy:Proxy Host name and Proxy Port number.

The Meeting MenuThe Meeting Menu

Terminate:Terminate: Leave or terminate the session. Leave or terminate the session. Record:Record: Opens the Record window and Opens the Record window and

writes the recorded data to the specified file writes the recorded data to the specified file (user.props file). (user.props file).

Save/Delete/Duplicate: Takes a snapshot of the meeting and saves it as a session template. The template includes: the participant list, the active tools, the agenda information and any security options.

The Views MenuThe Views Menu

More info:More info: Displays information about the selected session in the side panel.

Tools in use: Displays a list of the active applications in the side panel.

Participants: Displays the other clients of the session, by picture (the icon of the participants), or by location (a red spot in a world map).

The Views MenuThe Views Menu[cont][cont]

Security:Security: Displays information about Displays information about the security of the system.the security of the system.

Notification:Notification: Displays a list of the names and contact information for everyone whom the client has collaborated with in a Habanero session. Using the add and remove buttons, he can add or remove a person from a session definition.

Client ModesClient Modes Session definition Session definition

mode(red border): mode(red border): ItIt is used to define sessions off-line (in the start).

Session mode(green border): It is used when the client is connected to an active session.

The session locationThe session location

It defines where a particular session is hosted: the name of the session, the location of the server which hosts the session and the port number used by the server to communicate data.

The ToolbarsThe Toolbars

Leave Session Record a Session Save Session Definition Send mail:

The Session ToolbarThe Session Toolbar

The session toolbar buttons are shortcuts to functions found in the Views menu.

Hide, Session Information, Hide, Session Information, Tools in Use, Participants Tools in Use, Participants by Picture, Participants by by Picture, Participants by Location, Notification, Location, Notification, Security.Security.

The Tools PaletteThe Tools Palette

This palette defines the collaborative tools that are available to the clients environment.

With double clicking on the folder the client can open it or close it.

With right clicking the mouse on empty space in the palette the client can add and remove a folder.

NCSA Habanero NCSA Habanero FrameworkFramework

The Habanero framework allows the sharing of Java objects with other clients over the Internet.

It is an API designed to let the developers create collaborative applications, called Hablets.

NCSA Habanero NCSA Habanero FrameworkFramework[cont][cont]

The server reads events from and writes events to a stream, controls the order in which events execute, and makes sure events get shared by everything that needs them.

Events and data are sent to the server, and the server makes sure that these events and data are sent out to each client.

Serializers Serializers

Serializing is the process of copying an object.

The Habanero serializer assigns each object (event or data) a numbered ticket.

The tickets are used to guarantee that events happen in the same order as they are replicated on all clients.

ArbitratorsArbitrators

Arbitration is the process of deciding the order in which events are processed.

The central arbitrator makes sure that all the clients see the events in the same order. Arbitrator code at the client ensures that events execute in the order prescribed by the tickets assigned by the serializer.

Communication Managers Communication Managers - Networking- Networking

The communication-manager accepts events and makes sure that they go to all the appropriate clients.

The networking software of Habanero takes care about establishing network connection.

Habanero EventsHabanero Events

Habanero uses a hierarchical naming scheme to ensure that events from one client are shared with the corresponding part of all other clients.

Session manager

Session

collobject

frame

Children of frames

event

Sequence of EventsSequence of Events

The button is pushed on a client running a session. Each session has multiple listeners that listen for events. One of the listeners takes note of the button being pushed and sends the information to a listener manager.

The listener manager sends the event "a button has been pushed" off to the Habanero server.

Sequence of EventsSequence of Events[cont][cont]

At the server, there are multiple listeners as there are on the client. A listener receives the event "a button has been pushed" from the client. The server processes this event, giving it a numbered ticket (serialize). The ticket is sent to all other clients. A listener on the client receives the ticket and then passes it to the target, which is the correct button on the correct Hablet.

Habanerization Habanerization

The habanerization of an applet would allow multiple users wherever in the world with an internet connection to interact with the same application.

For example, with the Whiteboard application, all the users can draw on the whiteboard and see what the other users have drawn as if they were all viewing the same whiteboard.

HabanerizationHabanerization[cont][cont]

Change superclass, imports, and initialization.

Specify the default window parameters. Write methods to transfer state to other

instances. Take care of event handling. Compile the hablet. Install it into the Habanero environment.

The Hablets: WhiteboardThe Hablets: Whiteboard

The Habanero Whiteboard can be used to share images and drawings during the collaboration.

The Hablets: Savina The Hablets: Savina BrowserBrowser

NCSA Savina 1.0 supports the latest HTML standard, (currently 3.2), plus many popular HTML extensions.

The Hablets: TelnetThe Hablets: Telnet

Telnet with multiuser Telnet with multiuser capabilities:teacher capabilities:teacher mode-student mode.mode-student mode.

The Hablets: Voting PoolThe Hablets: Voting Pool

Voting pool Voting pool

brings brings democracydemocracy

to a to a collaborative collaborative

session.session.

The Hablets: ChatThe Hablets: Chat

This Chat This Chat

window window uses uses

the the Habanero Habanero

sharingsharing

mechanism.mechanism.

Hablets: Audio ChatHablets: Audio Chat

Participants can speak Participants can speak

to each other in an to each other in an

organised manner.organised manner.

Hablets: mpEditHablets: mpEdit

This JavaThis Java

application application is is

an openan open

source textsource text

editor.editor.

Hablets: NeighborhoodHablets: Neighborhood

A distributedA distributed

file system file system usingusing

the Habanerothe Habanero

framework.framework.

Hablets: ClipNShipHablets: ClipNShip

It allows to It allows to

share individualshare individual

files for otherfiles for other

clients to save clients to save onon

their systems.their systems.

Hablets: Gis VieverHablets: Gis Viever

A tool that A tool that

allows you to allows you to

display anddisplay and

manipulate manipulate sets sets

of of geographicalgeographical

information. information.

Hablets: VNC ( Virtual Hablets: VNC ( Virtual Network Computing )Network Computing )

It allows It allows

users tousers to

remotely remotely

controlcontrol

any system any system

runningrunning

a VNC Server.a VNC Server.

The Hablets: Colors HabletThe Hablets: Colors Hablet

A collaborative A collaborative tool that allows tool that allows its users to its users to manipulate and manipulate and combine combine different aspects different aspects of three color of three color squaressquares

The Distance and The Distance and Displacement HabletDisplacement Hablet

It lets the user It lets the user draw a path of a draw a path of a vector and then vector and then see what the see what the length of that length of that vector isvector is

Gas HabletGas Hablet

The Gas Hablet The Gas Hablet is a visual is a visual demonstration demonstration of the motion of of the motion of Ideal Gas Ideal Gas molecules molecules within a cylinderwithin a cylinder

Interference HabletInterference Hablet

The interference The interference effect in light effect in light waves. Two light waves. Two light rays pass rays pass through two slits, through two slits, separated by a separated by a distance d and distance d and strike a screen a strike a screen a distance, L, from distance, L, from the slitsthe slits

Orbital HabletOrbital Hablet

The Orbital The Orbital Hablet is a Hablet is a gravitational gravitational simulator of simulator of orbits in spaceorbits in space

Sun & Earth Hablet Sun & Earth Hablet

Displays the Displays the position of the position of the earth relative to earth relative to the position of the position of the sunthe sun

Thin Lens & Mirror HabletThin Lens & Mirror Hablet How an object is displayed in front of lens or a How an object is displayed in front of lens or a

mirrormirror

The Visibile HumanThe Visibile Human

This Java applet allows you This Java applet allows you

to select and view high-resolution to select and view high-resolution

imagesimages of 2-dimensional slices of 2-dimensional slices

of aof a human bodyhuman body

Molecular ModelerMolecular Modeler

was designedwas designed to to

skeletally view model skeletally view model

molecules in molecules in

3-dimensions3-dimensions

Collab XYZCollab XYZ

Originally called the Originally called the

molecule viewer,molecule viewer,

this application is this application is

capable of displayingcapable of displaying

chemical compoundschemical compounds

written inwritten in the *.xyzthe *.xyz

file format.file format.

VRML Viewer 1.0VRML Viewer 1.0

This Hablet is based This Hablet is based

on the VRML applet on the VRML applet

that parses and that parses and

displays a *.wrl file, displays a *.wrl file,

although limited toalthough limited to

a wireframe view of a wireframe view of

vertice specified vertice specified

polyhedrons only. polyhedrons only.

Bezier Plane Simulator Bezier Plane Simulator

This Hablet is based This Hablet is based

on Bezier Surface on Bezier Surface

Modeler applet whichModeler applet which

illustrates the illustrates the

properties of bezier properties of bezier

surfaces. surfaces.

Big Calculator Big Calculator

It has all the major It has all the major

features of a scientificfeatures of a scientific

calculator and it rounds calculator and it rounds

to whatever decimal to whatever decimal

place the user desires. place the user desires.

Tic Tac ToeTic Tac Toe

WWas created as aas created as a

source code example. source code example.

In this version of this In this version of this

classic game, N numberclassic game, N number

of people play against of people play against

the computer. the computer.

CheckersCheckers

The popular game The popular game

of checkers.You can of checkers.You can

play with any other play with any other

client in the sessionclient in the session