NYSS SOFTWARE SOLUTIONS

Barcoded Assessment System For Independent Learning(BASIL) User-Interface Prototype
Version 1.2

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

Revision History
Date 05/11/2010 10/11/2010 20/11/2010 Version 1.0 1.1 1.2 Description First Draft Second Draft Final Draft Author Ndumayak Onomo Ndumayak Onomo Ndumayak Onomo

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

Table of Contents
1. Introduction 1.1 1.2 1.3 1.4 1.5 2. Purpose Scope Definitions, Acronyms, and Abbreviations References Overview 41 Error! Bookmark not defined. 41 41 41 41 42 Error! Bookmark not defined. 42 42 42 42 43 43 Error! Bookmark not defined. 43 44 Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. NYSS SOFTWARE SOLUTIONS, 2012

Primary Window 2.1 2.2 Home page/ Selection Interfaces Purpose 2.2.1 Objects and actions 2.2.2 Composites 2.2.3 Visual Dimensions 2.2.4 Screenshot Sample

3.

Primary Window 3.1 Module Assessment Interface 3.2 Purpose 3.2.1 Objects and actions 3.2.2 Composites 3.2.3 Visual Dimensions 3.2.4 Screenshot Sample

4.

Secondary Window 4.1 Course Lecturer 4.2 Purpose 4.2.1 Objects and actions 4.2.2 Composites 4.2.3 Visual Dimensions 4.2.4 Screenshot Sample

5.

Secondary Window 5.1 Requirement Interface 5.2 Purpose 5.2.1 Objects and actions 5.2.2 Composites 5.2.3 Visual Dimensions 5.2.4 Screenshot Sample

6.

Secondary Windows 6.1 Faculty/ Module Registration 6.2 Purpose 6.2.1 Objects and actions 6.2.2 Composites 6.2.3 Visual Dimensions 6.2.4 Screenshot Sample

7.

Secondary Window

Author: Ndumayak Onomo

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx 7.1 Log out Interface 7.2 Purpose 7.2.1 Objects and actions 7.2.2 Composites 7.2.3 Visual Dimensions 7.2.4 Screenshot Sample Primary Window 8.1 Log in Interface 8.2 Purpose 8.2.1 Objects and actions 8.2.2 Composites 8.2.3 Visual Dimensions 8.2.4 Screenshot Sample

Version: 1.2 Date: 20-11-2010

Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined. Error! Bookmark not defined.

8.

9. 10.

Graphical Standards Browsing Hierarchies

Error! Bookmark not defined. Error! Bookmark not defined.

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

User-Interface Prototype
1. Introduction
The user interface prototype document of the BASIL system is a document that deals the

creativity/ designing of user interfaces. It also consists of computer graphics, windowing architectures which can be used to present information to the users of the system through (graphical displays, textual displays, onscreen displays, on-printer displays, etc). This document also collects information from users through the input devices such as: keyboard, mouse, etc. The characters on the system, and the way the words are coordinated enables users to understand, read, and perform a particular task.
1.1 Purpose

The main objective of the user interface prototype is to provide or display information’s to the users (graphically, textually, on screen, etc) to enable them perform a specific task. It also collects information from the users of the system that is been transferred to the main program for processing. It also displays graphics, designs that are easy to read and understandable to the users in the BASIL system.
1.2 Scope

This document will be useful for the following departments in the BASIL system and they are:  Designers: the designers will need the user interface prototype to tests system’s compatibility with the internal architecture of the BASIL system.  Testers: to determine how the testing will be implemented in the BASIL system.  Analysts: to prepare the software requirements and specifications of the system.  Stakeholders: enables them to interact with the system and knowing the system deliverables.
1.3 1.4 Definitions, Acronyms, and Abbreviations

BASIL - Barcoded Assessment System For Information Learning
References Title Title Year

BASIL NEXT ITERATION PLAN BASIL VISION DOCUMENT BASIL USE CASE MODEL + SURVEY
1.5 Overview

Yavuz Erdem
Yavuz Erdem Saqib Abbas

2010 2010 2010

This document will be developed using the following interfaces which are:   

Home page/ Selection Interfaces. Module Assessments. Course Lecturer
NYSS SOFTWARE SOLUTIONS, 2012

Author: Ndumayak Onomo

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

   

Registration Interface Faculty/ Module Registration Log out Interface Log in Interface

2.
2.1

Primary Window Homepage/ Selection Interfaces
Purpose

2.2

This interface gives students/staff guidelines and directive of what the BASIL system is all about and it’s function through textual and graphical representation. 2.2.1 Objects and Action OBJECTS Push Button- Staff
ACTIONS

Push Button- Students

Push Button- Courses Push Button- Contact Us

Push Button- Help

Contains the information of the staff of the university, lecturer’s room number, email addresses, phone numbers and the modules each of the lecturer is lecturing. Signifies if the students are either post graduates, under graduates, part time, online and CPD. This contains the departments and the courses each of the student in a department offers. This gives contacts of the staff in the CuOnline department, their phone numbers and email addresses. Directs users to a search box which users can type in their enquiries or related search topics.

2.2.2

Composites

 

The BASIL system consists of the following layout which are: Top Frame: is made up of BASIL and the links to staff, students, courses, contact us, and help buttons. Centre Frame: Gives a brief description of what BASIL is all about and it’s objectives.
Visual Dimensions

2.2.3

2.2.3.1 Position

The position of the design is immovable and cannot be scrolled either up or down. In otherwords the interface design is fixed.
2.2.3.2 Size

The design does not have a title bar, so it cannot be maximized, minimized or closed.

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx 2.2.3.3 Shape

Version: 1.2 Date: 20-11-2010

The interface design was created using a rectangular web window.
2.2.3.4 Color

The interface design possesses mostly the following colors which are:  Lavender  Dark Blue  Light Turquoise
2.2.4 Screenshot

Fig I Homepage/ Selection Interface 3.
3.1 3.2

Primary Window Module Assessment Interface
Purpose

This interface is mainly responsible for students individual performance through the grading and scores each students gets in a particular module he/she registered for in Coventry University. The grading are done thus:  70-100 - Distinction  60- 69 – Merit  50- 59 - Very Good  40 ---49- Pass
Author: Ndumayak Onomo NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

0-----39- Fail Objects and Actions OBJECTS ACTIONS Text Displays the modules for a postgraduate student studying software development and the mandatory modules and optional modules a student is taking and the scores in each of the modules. Multi line Text Box Displays the specific scores gotten in each of the modules. Push Button Displays the modules (mandatory module and the optional “Modules” module choosen by a particular student in the department. Push Button “Scores” Displays the scores.
3.2.1

 

3.2.2 Composites The BASIL system consists of the following layout interfaces which are: Top Frame: is made up the BASIL and the links to staff, students, courses, contact us, and help buttons. Centre Frame: displays the modules of the student who enrolled for MSC Software Development and the scores gotten in each of the modules. 3.2.3 Visual Dimensions 3.2.3.1 Position The interface design is immovable and cannot be scrolled up or down. In otherwords the design is fixed. 3.2.3.2 Size The interface design cannot be minimized, maximized, restored or closed.

3.2.3.3 Shape The interface design is created using a rectangular web window page. 3.2.3.4 Colors The interface design possesses mostly the following colors which are:  Lavender  Dark Blue  Light Turquoise 3.2.4 Screenshot Sample

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

Fig 2 Module Assessment 4.
4.1

Secondary Window
Course Lecturer

4.2 Purpose This interface displays the module lecturers, their room numbers, email addresses and phone numbers of each of the lecturer in each department in Coventry University and the modules each of them lectures.

4.2.1 Objects and Actions Objects Table

Actions Displaying the information as written on the interface design.

4.2.2  

Composites The BASIL system consists of the following layout interfaces which are: Top Frame: is made up the BASIL and the links to staff, students, courses, contact us, and help buttons. Centre Frame: that displays the modules, module lecturer, lecturer’s telephone number, email addresses and the room number.
NYSS SOFTWARE SOLUTIONS, 2012

Author: Ndumayak Onomo

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

4.2.3 4.2.3.1

Visual Dimensions Position The interface design is immovable and cannot be scrolled up or down. In otherwords the design is fixed. Size The interface design cannot be minimized, maximized, restored or closed.

4.2.3.2

4.2.3.3 Shape The interface design is created using a rectangular web window page. 4.2.3.4 Colors The interface design possesses mostly the following colors which are:  Lavender  Dark Blue  Light Turquoise 4.2.4 Screenshot Sample

Fig 3 Course Lecturer Interface 5 Secondary Window
NYSS SOFTWARE SOLUTIONS, 2012

Author: Ndumayak Onomo

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

5.1

Registration Interface

5.2 Purpose The main objective of this interface is for a students to enroll for the course they want to study in Coventry University, and it redirects the users to a page for module selection/ registration. 5.2.1 Objects and Actions Objects Actions Text “New User For new students home page registration. Registration” Text “Personal Details” Confidential information about a particular student. Check Box “Male” To tick the box specifically a male student. Check Box “Female” To tick the box specifically a female student. Textboxes To display student’s first name, surname, date of birth, nationality, and address.

5.2.2  

Composites The BASIL system consists of the following layout interfaces which are: Top Frame: is made up the BASIL and the links to staff, students, courses, contact us, and help buttons. Centre Frame: displays the student’s personal information such as Surname, Firstname, either male/female student, date of birth, Nationality and address.

5.2.3 5.2.3.1

Visual Dimensions Position The interface design is immovable and cannot be scrolled up or down. In otherwords the design is fixed. Size The interface design cannot be minimized, maximized, restored or closed. Shape The interface design is created using a rectangular web window page. Colors The interface design possesses mostly the following colors which are:  Lavender  Dark Blue  Light Turquoise Screenshot Sample
NYSS SOFTWARE SOLUTIONS, 2012

5.2.3.2

5.2.3.3

5.2.3.4

5.2.4

Author: Ndumayak Onomo

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

Fig 4 Registration Interface

6 6.1

Secondary Window Faculty/ Module Registration

6.2 Purpose The main objective of this interface is to enable students enroll in the faculty and choose the module as outlined by the university. 6.2.1 Objects and Actions Objects Actions Text “New User Describes the new user registration page. Registration” Push Button “Personal Personal information about a particular student. Details” Push Button“Get List of mandatory modules and optional modules. Modules” Drop down List box List of faculties in the University. “Select Faculty” Drop down List box List of modules in the different faculties depending on the
Author: Ndumayak Onomo NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

“Select Module”

individual’s course.

6.2.2  

Composites The BASIL system consists of the following layout interfaces which are: Top Frame: is made up the BASIL and the links to staff, students, courses, contact us, and help buttons. Centre Frame: is an interface that contains new students information that deals with faculty registration and module registration.

6.2.3 Visual Dimensions 6.2.3.1 Position The interface design is immovable and cannot be scrolled up or down. In otherwords the design is fixed. 6.2.3.2 Size The interface design cannot be minimized, maximized, restored or closed. Shape The interface design is created using a rectangular web window page. Colors The interface design possesses mostly the following colors which are:  Lavender  Dark Blue  Light Turquoise

6.2.3.3

6.2.3.4

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

6.2.4

Screenshot Sample

Fig 5 Faculty/ Module Registration 7. 7.l Secondary Sample Log Out Interface

7.2 Purpose The interface signifies that the student is through with the online system and has successfully logged out or exits the application. 7.2.1 Objects and Actions Objects Actions Text Displays the message on the screen. Push Button Displaying “Log Out” 7.2.2   Composites The BASIL system consists of the following layout interfaces which are: Top Frame: is made up the BASIL and the links to staff, students, courses, contact us, and help buttons. Centre Frame: is an interface that displays how students log out of the BASIL system.
NYSS SOFTWARE SOLUTIONS, 2012

Author: Ndumayak Onomo

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

7.2.3 Visual Dimensions 7.2.3.1 Position The interface design is immovable and cannot be scrolled up or down. In otherwords the design is fixed. 7.2.3.2 Size The interface design cannot be minimized, maximized, restored or closed. Shape The interface design is created using a rectangular web window page. Colors The interface design possesses mostly the following colors which are:  Lavender  Dark Blue  Light Turquoise Screenshot Sample

7.2.3.3

7.2.3.4

7.2.4

Fig 6 Log Out Interface 8. Primary Window 8.1 Log In Interface 8.2 Purpose
NYSS SOFTWARE SOLUTIONS, 2012

Author: Ndumayak Onomo

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

The main objective of this prototype is for students to access the BASIL system by logging into the system. Using the student Id card for authentication. 8.2.1 Objects and Actions Objects Actions Text Displays all the information on the screen. Push Button Display the “log In” button. Picture of the card The device where the students Id card are swiped through to store swiper students data in the barcode. 8.2.2 Composites The BASIL system consists of the following layout interfaces which are:  Top Frame: is made up the BASIL and the links to staff, students, courses, contact us, and help buttons.  Centre Frame: is an interface that displays how students assessments can be accessed using the barcode technology by swiping the student id card through the card reader to store students data. 8.2.3 Visual Dimensions 8.2.3.1 Position The interface design is immovable and cannot be scrolled up or down. In otherwords the design is fixed. 8.2.3.2 Size The interface design cannot be minimized, maximized, restored or closed. Shape The interface design is created using a rectangular web window page. Colors The interface design possesses mostly the following colors which are:  Lavender  Dark Blue  Light Turquoise

8.2.3.3

8.2.3.4

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

8.2.4

Screenshot Sample

Fig 7 Log In Interface

9. GRAPHICAL STANDARDS The interfaces on the BASIL system used the following formats and tools for the design and development of the system which are: C#, HTML, DHTML, Times New Roman used for the text fonts, minimum screen resolution 800x600 and the maximum screen resolution 1024x768 between this range and above. Web technologies with standard image formats like (.jpg, .gif) etc. BASIL graphics team designed the logo that was used in the interface design.

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012

Barcoded Assessment System For Independent Learning(BASIL) Basil_rup_uiprt.docx

Version: 1.2 Date: 20-11-2010

10.

BROWSING HIERARCHIES

HOME PAGE/ SELECTION INTERFACES LOG IN INTERFACE FACULTY/ MODULE REGISTRATION

REGISTRATION INTERFACE COURSE LECTURER MODULE ASSESSMENT

LOG OUT INTERFACE

Author: Ndumayak Onomo

NYSS SOFTWARE SOLUTIONS, 2012