for ETEC637
Concordia University 2003

Teacher Page

A WebQuest for the introduction of the 015A Screen Design Adaptation competency 582. A0 Multimedia DEC
Introduction | Objectives | Links to the QEP | Process | Evalutaion | Tips and Conclusion | Credits | Student Page

 

Introduction

This WebQuest targets learners exploring the world of Visual Design, Æsthetics and Creativity, all in the realm of Multimedia. It is specifically geared to beginners. The goal of the WebQuest is for learners to create a basic conceptual framework for creating and evaluating screen design, and to develop a solid foundation to build future knowledge on. The framework learners will create will include basic principles from the following design theories:

  • message and communication theory
  • design theory
  • color theory

Audience and Learning Context

Learners engaging in this WebQuest are young adults, enrolled in a Visual Design and Aesthetics course at the CEGEP (college) level in Quebec. Although learners in Quebec are often multilingual, the WebQuest was created in English as these learners attend the course in English, and a greater number of Websites exist in English.

Specific Course Objectives*

  • Analyze the structure of communication within the screen [015A-1]
  • Analyze the screen design [015A-2]
  • Propose modifications to the screen design [015A-3]
  • Organize the screen page [015A-4]
  • Verify the quality of the screen layout [015A-5]
* Partial completion of objectives

Specific Learning Objectives for WebQuest

Students will be able to identify good visual design principles that promote clarity and simplicity in interface, page layout, and proportion.

Student will demonstrate a basic knowledge of color combinations, contrasts, and harmonies in relation to color theory.

During Step 3 (the student led discussion), learners will demonstrate a fundamental knowledge and understanding of the structure of a well designed Webpage, the elements of a well designed message, and the fundamental difference between communication design and Website design in relation to message and communication theory.

The rubric will be used to assess how fully the students have understood the theories of message and communication, design, and color.

Links to the QEP

Domains/Subjects:

Screen Design Adaptation

Competencies targeted:

(Partial completion)
  • Analyze the structure of communication within the screen [015A-1]
  • Analyze the screen design [015A-2]
  • Propose modifications to the screen design [015A-3]
  • Organize the screen page [015A-4]
  • Verify the quality of the screen layout [015A-5]

Broad Areas of Learning:
  • Internet research skills
  • Website evaluation skills
  • Critical thinking skills

¬ top

Process

This WebQuest is best suited to take place in the first few weeks of class. It permits learners to do a preliminary assessment of what information exists on the Web about message and communication theories, design theories and color theory. There is a great deal of information but it is very scattered.

Most resources address a particular subject or gloss over a greater one. Few sites offer comprehensive, in depth information such as found in a text book. Websites also offer conflicting information about what is considered to be good screen design.

Prior to engaging learners in any WebQuest, it is recommended that each of the Websites listed are visited to confirm that they are still on-line and that they continue to contain the relevant information.


In order for any new type of learning activity, no matter how intuitive, to be successful, it is essential that instructors prepare the learners by providing them with a clear outline of the activity, the learning rationale behind the activity, and information that will scaffold them throughout the activity.

Instructor Preparation Step.

Engage learners in a class discussion about technology and knowledge, leading them specifically to a discussion about the internet and the abundance of information and designs that can be found there. Explain that they will be working on the WebQuest and explain the learning rationale and process.

Distribute a print-based outline sheet which clearly states the learning objectives, stages to be completed, due dates for each of the stages, and evaluation criteria.

Learner Step 1:

By answering the questions given to them in the WebQuest, the learners' mission is to collect, organize and compile a framework of recognized principles of Visual Design and Æsthetics. Learners will be given a list of Websites to explore.

Learner Step 2:

The learners will then choose three Websites and evaluate them according to the framework they have developed.

Learner Step 3:

Finally, based on the framework they developed, the learners will prepare a set of discussion questions related to a Website they analyzed, and using this information, will lead a class discussion.

Variations

... on the medium

Of course, the art of screen page design is not limited to the Web, although, it is often easier to conjure up examples as there are no shortages of Websites. However, the analysis of any on screen medium such as CD-ROM, DVD and all other computer based applications could be encouraged. In fact, cross analyzing the formats could prove to be quite an interesting learning experience. E.g. Does one design the same way for an interactive CD-ROM game as they would for a Website? If not, why?

... on the presentation

his assignment can be done individually or in groups. Furthermore, Step 3 indicates that there is a discussion to be animated on one of the analysed Websites. This can be done in class, or in the case of distance learning, via an online message board.

If you can think of ways to vary the way the lesson might be carried out in different situations (lab vs. in-class, for example), describe them here.

Learners could be encouraged to use the evaluation grid to provide peer-evaluation and feedback to their classmates. Instructors could choose to consider the class feedback when awarding final grades for the WebQuest.

¬ top

Evaluation

Use the rubric to assess how fully the students have understood the theories of message and communication, design and color in each objective.

They should be able to discuss the characteristics specific to a Webpage's structure, elements of a well designed message, basic elements required on a Webpage and the difference between communication designa and Website design in relation to message and communication theory.

In terms of design theory, students should be able to refer to visual design principles that promote clarity and visual simplicity in the interface and page layout and proportion principles of good design.

Finally, student should be able to discuss combinations and contrasts of colors and color harmonies in relation to color theory.

It is recommended to review each of these components on the Websites listed in case they have been revised and in preparation for the evaluation.

Beginning
1

Developing
2

Accomplished
3

Exemplary
4

Score

 


Analyze the structure of communication within the screen

Student shows s/he is limited in analyzing the structure of communication within the screen.

Student uses a limited but appropriate analytical vocabulary to discuss some structure of communication within the screen.

Student uses a developed and appropriate analytical vocabulary to discuss many elements of structure of communication within the screen.

Student uses appropriate analytical vocabulary to fully discuss structure of communication within the screen message in terms of communication theory, design theory and color theory.

 

Propose modifications to the screen design

 

 

Student is unable to propose modifications to the screen design.

Student is unable to propose modifications to the screen design. Student proposes a limited number of proposals to the screen design, some are not appropriate.

Student proposes a number of modifications to the screen design, most are appropriate.

Student proposes appropriate modifications to the screen design in relation to communication theory, design theory and color theory.

 

Organize the screen page

 

 

Student shows s/he is limited in discussing organization of screen page.

Student uses a limited but appropriate analytical vocabulary to discuss some elements of the organization of screen page.

Student uses an appropriate analytical vocabulary to discuss many elements of the organization of screen page.

Student uses appropriate analytical vocabulary to fully discuss organization of screen page in terms of message and communication theory, design theory and color theory.

Verify the quality of the screen layout

 

Student shows s/he is limited in discussing verification of the quality of screen layout.

Student verifies the quality of the screen layout in a limited but appropriate fashion.

Student verifies the quality of the screen layout identifying many appropriate elements.

Student fully verifies the quality of the screen layout fully identifying appropriate elements in relation to message and communication theory, design theory and color theory.

 

Analyze the screen design

Student shows s/he is limited in analyzing the screen design.

Student uses a limited but appropriate analytical vocabulary to discuss some elements of screen design.

Student uses a developed and appropriate analytical vocabulary to discuss many elements of screen design.

Student uses appropriate analytical vocabulary to fully discuss screen design in relation to communication theory, design theory and color theory.

 

Learners must be fully aware of the evaluation rubric before they commence the WebQuest. Having decided on how to manage the WebQuest in terms of timing, classtime devoted to the WebQuest, and learner interaction, specify how grades will be awarded, i.e. whether there will be a common grade for group work vs. individual grades, a grade for each stage, teacher evaluation, self-evaluation, peer evaluation or a combination. Remember to communicate all of this to the learners in advance. WebQuesting is a very enabling learning activity and learners must be kept in “the loop” at all times.

¬ top

Tips and Conclusion

Designing for the computer screen requires hybrid knowledge of technology and design. Learners with knowledge of print design theory may want to focus on the differences between on paper and on screen and students with a good grasp of technology may want to focus on how to polish their look.

Overall, learners will begin to see the relationships required for effective and æsthetically pleasing screen design.

¬ top

Credits & References

¬ top

Last updated on July 17th, 2003. Based on a template from