30
Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects Content Development and Workflow for e-Learning Projects Nadia El-Obaidi, Dr. Nadia Juhnke Freie Universität Berlin

Content Development and Workflow for e-Learning Projects · Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects Designing Effective e-Learning

  • Upload
    habao

  • View
    214

  • Download
    0

Embed Size (px)

Citation preview

Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Content Development and Workflow for e-Learning Projects

Nadia El-Obaidi, Dr. Nadia JuhnkeFreie Universität Berlin

2Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Project Management

Questionnaire for e-Learning Projects

Didactics

Content

Target Group

3Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Questionnaire for e-Learning Projects

What are the learning objectives?

Which previous knowledge do you expect?

How should the e-Learning materials be used?- website/CD-Rom for self-study- supported online course (LMS)- blended learning- classroom- online examination

What is the didactical concept?- encyclopedia- online textbook- explorative learning

Didactics

4Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

From Traditional Classroom to Blended Learning

Email

Web Presence

Library

Tutorials

Lectures

Without LMS

Information

Material Collection

Library

Tutorials

Lectures

Blended Learning 1 (Introduction)

Information

MaterialCollection

Library

Tutorials

E-Tutor

Lectures

Blended Learning 2(Extended)

OnlineFace-to-Face

Information

MaterialCollection

Library

Tutorials

ExamPreparation

Lectures

Multi-media material

Blended Learning 3(Optimum)

E-Tutor

Information

MaterialCollection

Library

Tutorials

ExamPreparation

Lectures

Multi-mediamaterial

Online Courses

E-Tutor

5Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Infor-mation

Commu-nity

CourseCatalog

University Library

Course Course Course Course

!! !

Evaluation

Learning Materials

Team workExam

Forums Self-tests Chat

central entrypoint

LMS – A Central Learning Platform for Teaching

Student Access to the Central LMS

6Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Questionnaire for e-Learning Projects

Which scientific content do you want to implement?

How do you want to structure the content?- index, map- navigation- storyboard

Which components do you want to include?- hypertext- tests- glossary- search- database- communication (discussion board, chat)

Content

7Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Sitemap

8Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Search

9Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Forum

10Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Glossary

11Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Test

12Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Authoring of e-Learning Contents

Lectora (Trivantis)- web-content without HTML knowledge- standardized learning modules (SCORM)- templates- multimedia elements (Flash, video, audio, math. formulas)- tests

Mediator (Matchware)- animations- interactions

Dreamweaver (Macromedia)- HTML-editor- additional tool for updates: Contribute

XML-Editors - separation of layout/design and content- structure-oriented authoring

Authoring tools

13Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Authoring of e-Learning Contents

Authoring Tools: Lectora

Structure Page

Template

14Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Questionnaire for e-Learning Projects

Which media elements do you want to include?- text- images- image maps- video- audio- animation (Flash)- simulation (Flash, Java)

Do you have examples/models in mind?

Should the material accord to e-Learning standards?- SCORM- IMS

Content (continued)

15Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Animation

16Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Questionnaire for e-Learning Projects

Who will be using your e-Learning materials?

What previous technical knowledge and which environment do youexpect?- familar with PC and internet- PC at home/at university- connection bandwith- software- hardware

Target Group

17Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Questionnaire for e-Learning Projects

What kind of resources are available for your project?- people- money- technical equipment

Are these resources sufficient?

When should the e-Learning materials be ready?

Should the e-Learning materials be updated regularly?

Project Management

18Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Designing Effective e-Learning Websites

1. Decide the purpose of your e-learning materials (objectives) 2. Specify the content3. Identify the target group4. Choose the correct tool or software for developing your e-learning

website

5. Create a flowchart6. Create a storyboard & layout

7. Develop your site8. Test your site

Take 8 Steps

19Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Preparation

Home

C D EA B

D.1 E.1A.1

A.2

Flowchart Example

Your flowchart (map) will show you the organization and navigation of your planned e-Learning website. In order to make a start, youshould:

1. make a list of topics and elements you plan to include2. group them3. draw a map of how the various parts of the topics and elements will fit

together

This map will be your guide for setting up the navigation concept foryour e-Learning website.

Create a Flowchart

20Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Organization

1. Approach sketching a storyboard for the screens needed

2. Ensure consistency by clustering your elements

3. Create a balance between the various groups of elements which isvery important concerning the usability of your materials

4. Provide whitespaces to enhance the visual focus on the content

5. If you wish to create an uniform style which improves theusability of your materials make sure that the different elementsreflect that style

Create the Storyboard & Layout

21Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Basic Layout

Example

Services

NewsContent

Search

RelatedLinks

Main Navigation

Credits

22Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Navigation

In your flowchart, you defined the direct links between topics and levels. Now you must decide what kind of access methods you areplanning to provide.

There are three kinds of users:Newcomers

- They need help getting started; they need motivation, e.g. introduction or a guided tour.

Advanced users- They need intuitive and consistent navigation, e.g. navigation bars or

zones. They need an overview of the topics provided, e.g. sitemaps. They need direct access to crucial pages, e.g. quick jump.

Experts- Search function, index pages,…

23Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

This site provides different levels of access and different navigation methods

Next >>

Example – www.distributed-campus.org

24Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Text and Fonts

Text- A wall of text is very bad for an interactive experience.

Intimidating and boring to read. - To draw users into the text and support scan ability, use well-

documented mark-ups,e.g.: heads, subheads, bulleted lists, highlighted keywords and short paragraphs.

Fonts- Sans-serif fonts are the basis of your website. Sans-serif fonts are those

fonts that have no "serifs": the little hooks on the end of the letters.- Some examples of sans-serif fonts are:

Arial, Geneva, Helvetica, Lucida Sans, Verdana- Verdana is a font family that was actually invented for use in the

WorldWideWeb.

25Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Pictures and Graphics

Pictures and Graphics are Important Information Elements

There are only two (or three) image formats for the web, but each is built for a specific purpose.

JPEGThis format is for images with millions of colors that have a more photo realistic look. You should use the jpeg format for photographs, and other images that have a lot of colors.

GIFThis format is for images with a small, set number of colors. GIF images use an index of colors for the image, colors that are not used in the image don't need to be included in the index. This format is good for graphics with limited colors.

Resize Web ImagesWeb images take up the majority of the download time in most web pages. But if you optimize your web images you will have a faster loading website.

26Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Graphicdesign

27Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Application of Multimedia Elements

Animation- Animations should be navigable- If there is an intro, one should be able to skip it- Animations should follow a consistent design

Sound- Sound should be navigable- Sound should support content- Sound should not compete against content- Narrators should be professionals

Animations & Sound

28Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Examples – Animation

29Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Software Multimedia Production

Picture Editing- Adobe Photoshop- Macromedia Fireworks

Grafic Creation- Macromedia Freehand- Adobe Illustrator

Animations- Macromedia Flash

Video Editing- Adobe Premiere

Audio Editing- Wavelab

Frequently Used Tools

Freie Universität Berlin, CeDiS, Content Development and Workflow of e-Learning Projects

Nadia El-Obaidi, Dr. Nadia Juhnke

[email protected], [email protected]

www.cedis.fu-berlin.de