Online Design-based Learning Environment

The students participated in an Arabic online design-based learning (DBL) environment, which was inspired by the LBD approach (Kolodner, 2002), with the aim to design, build and publish tourist websites about Egypt by the aid of the software “FrontPage” as a design task. The online DBL environment was established via “Moodle 1.9.10”, which is an open source course management system (CMS). The online DBL environment was accessible via the World Wide Web and built on standard html-web-pages. This section illustrates the different aspects of the online DBL environment and the experimental phases.

After logging in, the students were directed to a start page to welcome and give them an initial description about the structure of learning environment that they would use throughout the course. After that the students were able to access the interface of the online DBL environment. In the following paragraphs, the interface will be presented first; next, the structure of the online DBL environment will be addressed in details.

6.2.1. The interface

The learning environment interface had a rather simple design to enable the students to use and interact with each section easily (see figure 6.2.1). In the middle section of the interface, a short introduction about the course (design websites) and learning method (collaborative learning) that students had to follow through the course was presented, followed by a link to enable the student to login to the DBL environment. The link to the course appeared only after the student entered his/her correct username and password in the login block. In the right-hand and left-hand side of the interface eight blocks (four in each side) were located to provide information (e.g., date and time), security (e.g., login to the course), and/or learning services (e.g., needed software and translation) to the students. (1) The interface tutorial block included a video file explaining the function of each component as well as showed how the students could reach the learning environment and dealt with each single block and section in the learning environment interface. (2) Login block allows the student to login the online learning environment. After the student enters his/her username and password correctly, the login block disappears and the student gets the course’s link. (3) Software block involved specific software was needed to the students before and during the course, such as “Firefox 2.0”, which is the only browser that allows the collaboration script to work correctly (see section 6.4.2) and “FrontPage 2003” software that the students had to use for designing and building their websites. (4) The online users block shows the teacher and a list of students who have been logged into the course. This block was devoted to provide quick technical support to the students by exchanging private messages between the teacher and the students. (5) It was important to remind the students with the events of the course and groups as well as enabling each single student to create personal events during the course. Therefore, the learning environment interface was supported with a calendar block. (6) Using the clock block was useful for knowing the current time as well as to make sure that students

were on time and no-one miss out on activities due to slow or fast watches. (7) Because the first language of the students was Arabic, it was necessary to support the students in all conditions with the translator Google block to enable them to translate difficult and vague foreign words to their language. (8) The notes block was customized to provide important information to the students, such as the best screen resolution fit the learning environment and important dates for the students. All eight blocks were fixed and available throughout the course period.

Figure 6.2.1: Screenshot of the learning environment interface

6.2.2. Structure of the online DBL environment

After clicking on the course link at the interface, students were directed to the online DBL environment, which was divided into three sections (see figure 6.2.2): (1) Tutorial videos, (2) course instructions and learning phases, and (3) communication tools. All three sections of the online DBL environment will be introduced in the following sections.

6.2.2.1. Tutorial videos

The left part of the screen included a set of tutorial videos about how to use the DBL environment and the communication tools (chat, Wiki, and e-mail) effectively. For example, the “About course” video described and explained the function of each component in the DBL environment and the “Chat” video showed the instructions and steps that the students had to follow during the chat session. The tutorial videos and lessons were built by using “Adobe Captivate 3” software.

6.2.2.2. Course instructions and learning phases

The middle section of the DBL environment involved two sub-sections: (1) the course instructions section involved general course instructions that the students had to follow during the course, such as “user account is secret and should not be shared with anyone”. In addition, there was a news forum that could be used by the teacher to inform the participants with news and general announcements related to the course. (2) Learning phases section that was divided into seven sub-sections (one section for each learning phase), which in accordance with the course schedule appeared in a sequential order. Each learning phase consisted of (a) an introduction describing the learning phase and its goal that the students had to achieve before moving to the next phase and (b) links to the learning materials that the students had to use during the learning phase, such as Arabic and English resources, tutorial lessons, and standards for designing websites. Additional two links were found consistently in all learning phases (c) instructions for what the students had to follow during each learning phase. For example in learning content phase, “you have to write down all questions and notes that come up to your mind during learning lessons to share and discuss them with others through the Wiki session”, and (d) the tutorial video to show the students how they can use each learning phase effectively (see figure 6.2.2.2).

Figure 6.2.2.2: Screenshot of the content learning phase

6.2.2.3. Communication tools

Since the course was realized completely online and the students were not physically present in any case,, three communication tools (i.e., Chat rooms, Wiki pages, and email)

were located in the right section of the DBL environment. Each dyad had a private chat room for conducting small-group discussions which were enhanced by either a collaboration script, an incomplete concept map, both, or none of the two. As pre-procedures of each chat session, the teacher had to make sure that each dyad was online on time before starting the chat session and that the duration of each chat session is equally set for all dyads. Therefore, the chat rooms were only available for discussion after teacher confirmation that each dyad appeared in the online users block and received confirmation messages from them that they are ready to start their discussion. Subsequently, the teacher had to adjust the chat room settings to be available for 90 min. In addition, each dyad had a private wiki page to receive comments, questions, and answers from other groups during the sessions. The duration of each Wiki session was one day. Through this time, each dyad was allowed to evaluate only the group, which was assigned to them before the session by the teacher. Moreover, the students had to use their email accounts to send messages and files to each other and/or teacher.