UNIVERSITY OF JORDAN

FACULTY OF ENGINEERING and

TECHNOLOGY

COMPUTER ENGINEERING DEPT

Graduation Project || Final Documentation

Supervised By: Dr. Gheith Abandah

Team Group

Mohammad Hijazi 0076631

Maher Khalifa 0087130

Malek Abu-Ghanimah 0076627

Supervisor Signature:

Date: 15-5-2012

II

Abstract The Educational Facebook (EF)

System is an educational website intended

to improve the educational process at any

educational organization such as school,

college and university. The EF enables

students to keep in touch with their

instructors and other colleagues and

enhance the communication between the

various parties of the academic process.

There are many systems on the

web to support the educational process

and to keep people connected together for social purposes, like Facebook, Moodle, Blackboard,

and personal academic sites.

We tried in our project to benefit from the concepts in modern social networking and the

useful tools used in the normal academic websites. So we reached the idea behind the

Educational Facebook. In other words, our system is an academic site and a social network at the

same time, where users can communicate easily and share their daily and academic experiences.

Within the planning phase of this project, we divide it into five stages: specification,

design, implementation, testing, and documentation.

The EF system provides multifunctional tools that support the educational process at one

place and provides security and social networking. Also EF provides communication between

students and instructors where the users can share their issues online and make conversations

with other users about these issues. EF has many advantages; it is fast, ease of use, and secure. It

allows publishing course data and important documents. Also EF has the ability to organize a calendar and

to make schedule dates and notes, and users can communicate easily with each other by posts or messages.

Also it supports the educational process with the whole functionality at this system where courses are like

groups for students managed by instructors to have E-learning Course.

A stage in the future of our project will be adding more tools and services for the system,

like connecting it with other academic and social-networking websites, improving archiving

tools, improving libraries for different class‟s materials, adding guest browsing service, adding

online chatting tools, and improving online study tools (like video conferencing).

III

Dedication We dedicate our project to

Our respective families, specially our parents, who have helped us to

tackle any task with enthusiasm and determination. Without their love

and support this project would not have been made possible.

Every doctor and engineer who were the cause of our success and

helped us to get to this stage.

Special thanks also to all our graduate friends.

To all of them, we dedicate this project.

Mohammad Hijazi Maher Khalifa Malek Abu-Ghanimah

IV

Acknowledgment

This project would not have been possible without the support of many

people, our team wishes to express their gratitude and thanks to their great

supervisor, Dr. Gheith Abandah, who has the patience and bear with us, he has

been our constant source of inspiration.

Table of Contents Abstract ......................................................................................................................................................... II

Dedication .................................................................................................................................................... III

Acknowledgment..........................................................................................................................................IV

Chapter 1: Project Overview ......................................................................................................................... 7

1.1 MOTIVATION ...................................................................................................................................... 7 1.2 PROBLEM DEFINITION ........................................................................................................................ 7 1.3 PROJECT APPROACH ........................................................................................................................... 7 1.4 REPORT OUTLINE ............................................................................................................................... 7 1.5 WORK PLAN ....................................................................................................................................... 8 Chapter 2: Related Work ............................................................................................................................... 9

2.1 RELATED SYSTEMS ............................................................................................................................. 9 2.1.1 FACEBOOK ........................................................................................................................................ 10 2.1.2 BLACKBOARD ................................................................................................................................... 11 2.1.3 MOODLE: .......................................................................................................................................... 12 2.1.4 DR. GHEITH ABANDAH “BLOG” ........................................................................................................ 13 2.2 WORK DONE ..................................................................................................................................... 14

Social Interaction ............................................................................................................ 14

Classes ............................................................................................................................ 14

Messages ........................................................................................................................ 14

Calendar ......................................................................................................................... 14

Chapter 3: Specifications ............................................................................................................................. 15

3.1 USER TYPES ...................................................................................................................................... 15 Student ........................................................................................................................... 15

Instructor ........................................................................................................................ 15

Administrator (Admin) ................................................................................................... 15

3.2 FUNCTIONAL REQUIREMENTS ........................................................................................................... 15 3.3 NON-FUNCTIONAL REQUIREMENTS .................................................................................................. 16 Chapter 4: Use Case Diagram ...................................................................................................................... 17

4.1 USE CASE DIAGRAM ......................................................................................................................... 17 4.2 USE CASE SCENARIOS ...................................................................................................................... 18

Sign Up ............................................................................................................................ 18

Login ............................................................................................................................... 18

Confirm Registration ...................................................................................................... 18

Add and Remove Colleague ........................................................................................... 18

Send and Receive Message ............................................................................................ 18

Submit Post and Comment ............................................................................................. 18

Search and Browse ......................................................................................................... 18

6

Edit Access Settings ........................................................................................................ 18

Create Class .................................................................................................................... 18

Maintain Class Information ............................................................................................ 19

Join and Leave Class ....................................................................................................... 19

Add Calendar Item .......................................................................................................... 19

Chapter 5: Data Base ................................................................................................................................... 20

Chapter 6: Interface Design ......................................................................................................................... 21

Registration Page ............................................................................................................ 21

Personal Page ................................................................................................................. 23

Class Page ....................................................................................................................... 33

Admin Page ..................................................................................................................... 34

Forget Password Page .................................................................................................... 35

Chapter 7: Conclusions ................................................................................................................................ 36

7.1 PROBLEMS FACED ............................................................................................................................ 36 7.2 LESSONS LEARNED ........................................................................................................................... 36 7.3 FUTURE WORK ................................................................................................................................. 36 References ................................................................................................................................................... 37

7

Chapter 1: Project Overview

1.1 Motivation Based on our use of social networking websites through our academic and university life,

we noted that these networks provide a rapid means of

communication between friends and colleagues, which

enhances the exchange of experiences.

However, at the same time, we noticed that most of

these sites do not provide tools for education and academic

process, from that was the idea of our project.

1.2 Problem Definition At this time, while the communication technologies

are improving very fast, we didn‟t found an easy and efficient way to provide the educational

institutes the ability to communicate and interact between the different parts of the educational

process.

The Educational Facebook (EF) System is intended to improve the educational process at

any educational organization, providing their people ability to keep in touch with their instructors

and other colleagues and to enhance the communication between different parts of the academic

process.

1.3 Project Approach We tried in our project to take the advantages of social networking websites beside the

useful tools used in the normal academic websites, so it was the idea behind Educational

Facebook. In other words, our system is an academic site and a social network at the same time,

where users can communicate easily and share their daily& academic experience.

1.4 Report Outline Through reading this report, Chapter 2 “Work Done” will deal with what work was done

in planning and preparing for the “Educational Facebook” project, among that we will talk about

some social-networking and academic websites. Then you can find a brief about the main

features in the websites.

In Chapter 3, we will discuss the “Specifications” for the project, introducing the user

types: Students, Instructors and Administrator. After that we have listed functional and non-

functional requirements.

Chapter 4 explains use case diagrams and scenarios which used in our project. Also

Chapter 5 explains database tables, and describes the entity relationship between tables that

created to ensure secure, fast and reliable access to it.

8

In Chapter 6, we will have a look about the website interface which is made in a smooth

and simple form to ensure easy use for users; it introduces the websites main pages: Registration,

Personal and Class pages.

Finally, in Chapter 7, we mentioned briefly miscellaneous topics that we faced like what

problems we‟ve been faced during our work, lessons that have been learned from the project and

what can be done in future to improve the website.

1.5 Work Plan According to the work which we did in this project, we divide it into five stages;

specifications, design, implementation, testing and documentation. The user interface contains all

the pages in the system, so we categorize these pages into three main packets. First packet

consists of the student user pages. The second one contains the classes pages. The third one

consists of instructor and other miscellaneous pages. Also the implementation process divides

into three stages according to these packets. In order to ensure the system we have tested the

system; this process guarantees the sequence of actions and flow of information.

Process Work on Time Line

Use

r In

terf

ace

an

d

Imp

lem

enta

tio

n

First Packet Maher Khalifa 12/2 – 30/3

Second Packet Malek Abu-Ghanemeh 12/2 – 30/3

Third Packet Mohammad Hijazi 12/2 – 30/3

Website

Design Whole System Malek Abu-Ghanemeh 30-3

Final Review Whole System Mohammad, Maher and Malek 31/3 – 15/4

Testing Whole System Mohammad, Maher and Malek 16/4 – 1/5

Final

Documentation Whole System

Malek and Maher and

Mohammad 2/5 – 15/5

Presentation Whole System Malek Abu-Ghanemeh 2/5 – 15/5

9

Chapter 2: Related Work

2.1 Related Systems At the first time we thought in this project, we decided to study the related works done

before. So we read and studied some systems like Facebook, Moodle, Dr. Gheith blog site and

Blackboard. After that point, our team group started to choose the requirements; functional and

non-functional one. Also we could determine the possible user types of the system, then we

started working on the prototype of user interface and we made some pages to choose the right

one.

In addition, the use case diagram was drawn and the scenarios was been written.

According to the data base; we created the tables of the system and made the relationships

between them. After that we started learning the right language that we need to use, so we chose

the Asp.Net using C# and SQL Express for data base.

There are many of systems on the web to support the educational process and to keep

people connected together for social purposes. The following pages will discuss some of them.

10

2.1.1 Facebook Facebook is a social networking service and website launched in February 2004, operated

and privately owned by Facebook, and the global logo of this system is shown at Figure 1 below.

Users must register before using the site, after which they may create a personal profile, add other

users as friends, and exchange messages, including automatic notifications when they update

their profile. Additionally, users may join common-interest user groups, organized by workplace,

school or college, or other characteristics.[1]

Advantages

Facebook has a lot of advantages; it is simple, easy, secure, fast, trustable and elegant

website. Also it helps people to

find their friends and classmates,

and it entertains them through

some games and applications. In

addition, Facebook allows creating

groups and students can use these

groups as educational blog to

share their knowledge, also it has

new subscribed features.[2]

Disadvantages

Facebook has some disadvantages; it has a lot of spams, scams and viruses. And

sometimes message notification is annoying, also it is overcrowding. Actually Facebook doesn‟t

support the educational purpose.[3]

Compare Facebook with EF

Facebook is a social website and doesn‟t support the educational purpose. Also Facebook

is overcrowding. The EF system is special one for some college or any educational institution,

and this site is designed to support the educational process and it isn‟t crowding, it is just for

students and instructors.

Figure1: Facebook Logo

11

2.1.2 Blackboard Blackboard is an enterprise software company with its corporate headquarters in

Washington, D.C. and is primarily known as a developer of education software, in particular

learning management systems, and the main page of this system is shown below at Figure 2. The

company provides education, mobile, communication, and commerce software and related

services to clients including education providers, corporations and government organizations.

Blackboard software and services are used by over 9,300 institutions in more than 60 countries.

In early 2010, Blackboard launched Blackboard Student Services, following the

acquisition of Presidium Inc.Student Services provides management services for student

admissions and enrollment, financial aid, and student accounts and retention. It also provides IT

and helpdesk support to students and faculty for learning management systems.[4]

Advantages

Blackboard has a lot of advantages; it contains multiple E-learning courses online, and it

supports the educational process with all materials and other announcements.

Disadvantages

Blackboard has some disadvantages, but the most important one is the weakness of

communication between students and instructors.

Compare Blackboard with EF

Blackboard is an E-learning website and supports the educational purpose. But it cannot

support communication between students and instructors. Users cannot keep in touch with each

other and this is a big gab in the educational process. The EF site supports and provides an

interactive communication between users and it keeps them in touch with each other.

Figure2: Blackboard homepage

12

2.1.3 Moodle: Moodle is a Course Management System, also known as a Learning Management System

(LMS) or a Virtual Learning Environment (VLE). It is a free web application that educators can

use to create effective online learning sites, and the main page for Moodle is shown below at

Figure 3. Also it is software package to produce internet-based courses and websites. Its global

development project designed to support a social constructionist framework of education. It

supports open source codes for software and projects. Moodle system is created by Martin

Dougiamas.[5]

Advantages

Moodle has a lot of advantages; its low cost, high level security, flexibility, available

source code, technical support and developed in multiple languages. Also it contains updates and

plugins and variety of skills and tools.[6]

Disadvantages

Moodle has some disadvantages; it is difficult to integrate with human resource systems

and lack of integration with student management systems. Also there is difficulty carrying out a

distributed management model with multiple schools and departments, and it is inefficient use of

space in the user interface.[7]

Compare Moodle with EF

EF gives the advantages of guarantee personal data from steal, and there is no need for

extra software to be used. Free download published to all users.

Figure3: Moodle homepage

13

2.1.4 Dr. Gheith Abandah “blog” „Personal Effort‟ website supports E-learning courses, advance researches and

presentations. It helps students and researchers to have online courses material and researches;

also they can have some contact with Dr. Gheith using the contact tool. And the Figure 4 below

shows the home page of this blog.

Advantages

Dr. Gheith blog has many advantages; it contains multiple E-learning courses online, and

it supports the educational process with all materials and other announcements. Also it is ease of

use and compatibility issue, and it provides feeds and shortcut for important content and updated

one.

Disadvantages

Dr. Gheith blog has some disadvantages, but the most important one is the weakness of

communication between students and instructors.

Compare Dr. Gheith blog with EF

Dr. Gheith blog is an E-learning website and supports the educational purpose. But it

cannot support communication between students and instructors. Students cannot keep in touch

with each other and with their instructors, and this is a big gab in the educational process. The EF

site supports the communication between users and it keeps them in touch with each other.

Figure4: Dr. Ghieth blog site

14

2.2 Work Done In this chapter we will pass on some of the main characteristics in our system: Social

Interaction, Classes, Messages, Files Uploading and Calendar.

Social Interaction Every student can contact with other students or instructors to get any needed educational

assistance, besides taking the advantage of instant and fast interaction between different users to

share their daily experience, whether it was personal or academic one. Thus, the website provides

the ability to publish “posts” for users on their personal pages (walls) or colleagues‟ pages. Also,

users can interact with the posts using “comments” provided by the system.

Classes

For example, every course has a group in the EF which called a “class” which is created

and managed by an instructor. Each student can join the class to find all the course materials

inside it and find the solution of his/her problems about this class, besides interacting with his

colleagues.

Messages To provide users with a personal communication tool while maintaining their privacy, the

website gives them the ability to use the messages to send text messages or files for other users.

Calendar In order to help students to organize their time and effort, the system provides a calendar

for each user; where they can schedule their important notes and other personal events. Also it

contains the important dates (Exams, quizzes. etc.) for every class registered by user for the

current semester.

15

Chapter 3: Specifications

3.1 User Types The FE system has three types of user. The main different between user types is about

authentication and authorization, and this affect what they can do in the EF system.

Student The student user type represents students who are registered in a course in the system and

they are called “colleagues”. This user can do the following actions:

1. Login and sign up as a new user

2. Join a course class and leave it

3. Post assignments to a class to let instructor review the assignments

4. Submit a post and a comment

5. Send a new message to another student or instructor

6. Edit access information

7. Find other colleagues

Instructor The Instructor user type represents lecturers who teach a course in the system and they

called instructor. This user can do the followings:

1. Login and sign up as a new user (with privileges to create classes)

2. Submit a post and a comment

3. Create a new course class

4. Join and leave a class

5. Post course material at a class

6. Upload materials files.

7. Send a new message to another student or instructor

8. Edit access information

9. Find other colleagues

Administrator (Admin) The Administrator user type represents admin who controls the system and the only

action that this user can do is to approve instructor users.

3.2 Functional Requirements The functional requirements means the actions can be done inside the system by users,

and at the EF system we have to determine these requirements to proceed with implementation

and testing. Firstly users must sign up for the first use, and the sign up process needs some

personal information, username and password. Also if the user already has an account, then

he/she can login the system by insert the correct username and password. Once the user is in the

16

system, the user can do a lot of actions; user can send and receive messages, make a search for

other users and they called colleagues, make a search for classes, browse these colleagues and

classes, show the last update of his/her colleagues and classes. Also the user may submit a post

on any other colleague‟s wall or on any class‟s wall and make comments on these posts, and user

can see his/her last updates and posts. And user can schedule his/her appointment and important

dates in special calendar at the personal page. These requirements are general for the two types;

students and instructors.

In addition there are groups called classes for courses, inside these classes users can see

the class‟s wall with all updates, the class member, class information like course name and ID,

the instructor information and the instructor posts. Also user can see the course material, student

grade, course exams and home works at the class page, and the students can upload the home

works to the instructor. And the instructor who teaches certain course can create a class for this

course, this instructor manages all the posts and materials inside the class page. This instructor

may use a calendar to determine important dates and to schedule the course time. Other users can

join these classes or leave it by their choice. In addition users can edit their contact information

like username, password or any other personal information. According to the administrator; he

just provides confirmation for the instructor users to have the required authentication.

3.3 Non-Functional Requirements Non-functional requirements are global constraints on the software system, and there are

some examples of non-functional:

1. Usability: the ease of use and learnability of this software application. And it is the

extent to which a product can be used by specified users to achieve specified goals

with effectiveness, efficiency, and satisfaction in a specified context of use.

2. Security: permissible information flows and protection for every account.

3. Obvious Documentation: so there is no need for learning.

4. Compatibility with different browsers (Firefox, Google Chrome).

5. Good Performance: fast response time and available storage place and the system

should handle a lot of transactions process per second.

6. Reliability: the availability of components and the integrity of information

maintained and supplied to the system.

17

Chapter 4: Use Case Diagram

4.1 Use Case Diagram As shown in Figure 5 below; the use case contains three actors and fifteen actions

distributed on those actors. These three actors are the same of user types; students, instructors and

administrator. Where the students and instructors can do some of the same actions like sign up

and login, make a search and browse other users, submit posts and comments, send and receive

messages, add or remove other users from his/her colleagues list, add dates and notes to the

calendar and edit his/her access settings. Instructors can create classes, determine the information

of the course and post the course material; also they can join other instructor‟s classes but

students can join and leave a class only. And the last actor is the admin; he can login to provide

the confirmation to instructors.

Join Class

Search

Browse

Submit a post

Submit a comment

Edit Access Settings

Send & ReceiveMessage

Add & RemoveColleague

Login

Sign Up Confirm Registration

Leave Class

Student Instructor

Admin

Create Class Maintain Class Info

Extend

Add Calendar Item

Figure 5: Use Case Diagram

18

4.2 Use Case Scenarios

Sign Up This process gives a new user who needs an account to use the system the authority to

register a new profile on EF. Any new user can create a new account at this system by filling the

required data then he/she can use the system then this user can use the benefits of the system.

Login

Each user has an account inside the EF, he/she can log in to his/her profile by filling the

correct username and password to be able to use the services and the tools.

Confirm Registration This process is assigned for the administrator user to confirm the registration for the

instructor user; it means this admin determines the authority inside the system between the users.

Add and Remove Colleague This process is used by all users for adding other users as colleagues to let the

communication between users easy as possible. And the remove process is used to make a

colleague of the user to be un-colleague.

Send and Receive Message All users in the system can use this benefit, this process is used to send texts between

users or it can be attached a small file by users. Also user can receive messages from other users

and read them.

Submit Post and Comment Every user can post a text on his/her wall or at other users‟ wall or even at the class‟s

wall. Also each user can make a comment at all of these posts wherever it is.

Search and Browse Any user can make a search for other users and classes. The search process can be done

by the user name or user E-mail. Also the user can browse any other user‟s profile or class‟s

page.

Edit Access Settings Each user can update his/her personal information using this process and change the

contact information like username, password, E-mail and personal photo.

Create Class Only the instructor users can use this process which allows creating new classes inside

the system.

19

Maintain Class Information This process is connected to the class where the instructor can maintain the class

information like course name, course ID, course location, instructor name, instructor information

and office hour. Also this process contains the uploaded file by the instructor in the system.

Join and Leave Class Any user in this system can use this process where user can join any un-joined class and

can leave the joined class.

Add Calendar Item The users can add some important dates and useful notes to be like events using this

special calendar. There are two types of calendar inside the system; one is for the user, and the

other is for the class.

20

Chapter 5: Data Base The data base contains a lot of tables and relations and each table consists of attributes.

The tables and their relations can be shown below in Figure 6.

Figure 6: Entity Relationship

21

Chapter 6: Interface Design

Firstly at the home page of Educational Facebook, it contains four main parts; log-in

block, sign up block, EF logo and promo. This home page is called the Registration Page; it is

shown below at Figure 7.

Figure 7: Registration Page

Registration Page This is the first page the user will see once the system starts; it is the home page of the

system. The purpose of this page is:

1. Log in the system

2. Sign up as a new user

3. Connect to some shortcuts in the footer block

According to the Login fields, this part allows users to login to their profile and account.

This field contains two text boxes and two labels with a check box to keep the user logged in.

Once the user enters the correct username and password, this user can access his/her personal

page and use the functionality of the system.

In addition at the same page; there is the sign up fields that concerns a new user wanted to

have an account. These fields contain a lot of text boxes, labels and check boxes. These labels are

first name, last name, password, confirm password, E-mail, and type of user. According to first

22

name and last name; the user should enter his/her real name to let other colleagues and instructors

knows him/her. User should enter a password for his/her account to provide security, also user

must enter the password again in the confirm password field and must be matched. The user can

enter his/her E-mail to login, also the E-mail is needed to be confirmed to communicate easily

Also the user must define the specific type he/she really is, there are two types of user that

specifies the authentication for user (what he/she can do or cannot). These two types of user are:

the student who is a normal user and the instructor who is an admin for classes and courses. But

this instructor needs to approval from other user which called administrator.

And like every system in the footer of page, there are quick links for Terms of Use,

Contact Us and FAQ. Once clicking on the terms of use, the page of those conditions will open;

later we will confirm those conditions and terms.

Figure 5: Personal Page of student

23

Figure 6: Personal Page of Instructor

Personal Page This is the first page the user will see once he/she login into the system. And the purpose

of this page is:

1. Can post a new status and see his/her old posts

2. Can make any dates on his/her calendar

3. Can see the colleagues list he/she has

4. Can show the latest messages sent or received

5. Can see the latest update of his/her colleagues and classes

6. Can see the joined class

7. Can change any settings in his/her profile

8. Can create a new class (just for instructor users)

At the personal page, firstly as shown above in Figure 6, there is the first block which

called post block which contains the latest posts for this user and there is a show more button.

This button once clicking on it, the posts viewer will expand in the same block at the same page.

In addition there is the colleagues list which defines as friends list contains the colleagues this

user has and there is a show more button. This button once clicking on it, the posts viewer will

24

expand in the same block at the same page. In the middle of the page; it‟s shown the profile

picture for user and his/her last status. Also the user can view other user‟s updates at his/her page

and also can view courses‟ updates in the interactive block and there is a show more button. This

button once clicking on it, the posts viewer will expand in the same block at the same page.

Also there is a block for the joined class that shows the joined class by user, and there is a

show more button. This button once clicking on it, the joined classes will expand in the same

block at the same page.

Figure 7:All Classes Page

In addition any user can make a search for any other user or class. This means that any

user can find his/her colleagues, instructors and classes. The search page contains a text box and

a button. When the user clicks on the search button, the result will appear in the interactive block

and the user can make a search by user or class as shown in Figure 8.

25

Figure 8: Search Page

According to the messages function, user can view his/her inbox at the personal page.

And user can view more messages at the same page by clicking on the show more‟ button. When

the user clicks on any message text, the received message view page will appear with the whole

text as Figure 9 shows. Also the user can send new message using new message button, but it

needs to determine the receiver user and the text as Figure 10 shows below, and it is optional to

attach a file in the message. In addition the user can view the whole inbox list by the inbox button

as Figure 11. The user can show his/her log sent message by the sent button..

26

Figure 9: A Received Message preview

Figure 10: New Message Block

27

Figure 11: Received Messages Page (Inbox List)

Also the user can browse for any other users. And if this user is a colleague for him/her,

the colleague page will be shown in Figure 12 where the user can post any text to other one. Also

the user can view his/her list of colleagues using the colleagues block shown in Figure 13. If a

user is not a colleague, his/her wall page will appear as Figure 14 where the user can add other

one to be a colleague without needing for his/her approval.

28

Figure 12: Colleague Wall Page

Figure 13: Colleagues Block

29

Figure 14: Un-Colleagues Browse Page

At the header of every page in the system, we will notice the edit button where the user can

update the personal setting of his/her profile. By clicking at this button the access settings page

will appear. From this page, which is shown in Figure 15 the user can change any information

about him/her and can edit his/her profile by settings access which let user to change password,

recover password, change contact information like E-mail, name and photo. Also at the header,

the user can go back to his/her personal page by clicking on the EF logo at the header of the page.

In addition; the classes‟ button is used to show all classes this user intended to in the interactive

block as shown in Figure 16, and the messages‟ button to show the inbox list as Figure 11 shows.

30

Figure 15: Edit Access Settings Page

Figure 16: Class Review Page

31

The calendar item is special for users to help this user with his/her important dates or any

other notes; once the user clicks on the add notes button, the calendar item page will appear as

Figure 17.

Figure 17: Calendar Items Page for User

In addition as an instructor at the personal page, there is a button to create a new class and

the other button is used to show all the classes managed by this instructor. When instructor clicks

on it, the create class page will appear and the instructor can add the information of this class then

instructor creates the class as Figure 18 below.

At the personal page, the user can see his/her joined class where this block views the class

name and the class information. Once the user clicks on any class name, the class page will

appear; this view is for a simple user not instructor for this class (admin). The user can join any

class by click on the join class as Figure 18. And if user is already joined the class, he/she can

leave the class as Figure 19 .

32

Figure 18: Create Class Page

Figure 19: Un-joined Class Page as a colleague

33

Figure 19: Joined Class Page as a colleague/ instructor

Class Page This is the page the user will see once he/she clicks on any course class. And the user of

this page once joining this class can:

1. Post a new status

2. See the instructor‟s posts

3. See the colleagues list at this class

4. See the instructor information

5. See the latest update of his/her colleagues at this class

6. See the material posted at this class by instructor including exams, home works

and grades

7. See the important dates determined by the instructor for this class

At the first block which called instructor‟s post, it contains the last posts of instructor at

this class. Also there is a special block to provide information about the instructor like office hour

and instructor degrees. In addition there is the class member which contains all students who ask

to join this class. And also there is a small block for class information which called the about

block, this block contains the course name, course ID, syllabus and also time and location of

34

class. The instructor can edit the class by clicking on the edit button at the bottom of the class

page and the edit class page will appear as shown at Figure 20. This page is just for instructor.

Figure 20: Edit Class Page

In the middle of page there are the last posts in this class by users or instructor. Also there

is a special calendar for this class contained the main important dates scheduled by the instructor

like exams, home works and any other important notes, the instructor can add some events using

the add notes button and fill the required field.

The last part is considered for the class data. The class data contains home works, exams,

quizzes, marks and grades for students. The students who joined the class only can go to the

download page then they can download the files. But as instructor view the instructor can upload

the material of course. According to the upload home works button, once any student clicks on it,

the new message page will appear and the receiver field is assigned to the instructor of this class.

And the last important thing about class is just when the class is created; it cannot be deleted or

removed.

Admin Page Figure 21 shows the Admin page that is used to approve requests for instructor users.

35

Figure 21: Admin Page View

Forget Password Page As in most websites that requires information from user to login, it is still possible for a user to forget

his/her password, so EF system provides the needed tool to recover the forgotten password. This tool

can be accessed from the registration page under the login fields, which yields to the page shown in

Figure 22.

36

Chapter 7: Conclusions

7.1 Problems Faced During our work on this project, we have faced some problems which we work to solve them,

most notably of them were as the following:

Programming languages:

As we have a simple knowledge of programing languages, we faced some

difficulties in learning it.

Designing the interface

Also, as programing languages, we faced some difficulties in designing the

websites‟ graphic interface, but using online tutorials we could override

this problem.

University Life Duties:

Like any other engineering students, sometimes we were faced with time

constraints due to our study like having exams, quizzes and other projects!

7.2 Lessons Learned We‟ve learned from this project a lot of things, like:

Working as one team, where everyone of the team has done a part of the project.

Learning about some programming tools and website building techniques

Time Management and scheduling

Project Planning and management

Working under pressure

7.3 Future Work A stage in the future of our project will be adding more tools and services for the website,

most notably ideas are:

Connecting the website with other academic and social-networking websites

Improving achieving tools published data (Specially for classes)

Improving a materials library for different class‟s materials.

Adding guest browsing service

Improving online chatting tools

Improving tools for online study and lectures

37

References 1. Wikipedia, Facebook, http://en.wikipedia.org/wiki/Facebook, last access on Feb 2,

2012

2. Praveen, Internet Reviews, http://www.geeks4share.com/2010/12/advantages-of-

facebook-2/, written on Dec 30, 2010, last access on Feb 2, 2012

3. Praveen, Internet Reviews, http://www.geeks4share.com/2010/12/disadvantages-of-

facebook-2/, written on Dec 29, 2010, last access on Feb 2, 2012

4. Wikipedia, Blackboard, http://en.wikipedia.org/wiki/Blackboard_Inc., last access

on Feb 2, 2012

5. Wikipedia, Moodle, http://en.wikipedia.org/wiki/Moodle, last access on Feb 2,

2012

6. Leonela Salgado, article written on May 13, 2012, http://leonelacursodeingles

blogspot.com/2011/05/moodle-advantages-and-disadvantages.html

7. Leonela Salgado, article written on May 13, 2012, http://leonelacursodeingles.

blogspot.com/2011/05/moodle-advantages-and-disadvantages.html