Saturday, May 26, 2007
Final Version of Group Project
URL of final version of group project:
http://iln.cite.hku.hk/com/1374/users/klcheng2/index5.swf
Information about Group Project
(1) Description of group project
Subject : Mathematics
Level : Secondary Three students in Hong Kong
Topic : Angles of Elevation and Depression
Design format : Interactive Visual Representation
Software used : Flash MX
Designers : Alan Cheng & Wong Yau Kit
(2) Role in group project
Alan and I are equally contributed to our group project. We always work together to our group project. By the way, Thank you very much to Dr. Daniel and other classmates, they gave us some useful suggestions, as a result, we can make our project more reasonable and interactive.
(3) How to run our group project
We design two “Sliders”, one for “Angle of Elevation” and one for “Angle of Depression”. User can move from “Start” position to “End” position to see angle change from 45 to 90 .
We design “hotspot” effects on the words “Angle of Elevation” and “Angle of Depression” in order to show the definitions of “Angle of Elevation” and “Angle of Depression”. On the other hand, hints or pictures will be given in order to let user know about hotspot effects.
(4) URL of group project
http://iln.cite.hku.hk/com/1374/users/klcheng2/index5.swf
(5) Source-code of group project
http://iln.cite.hku.hk/com/1374/users/klcheng2/index5.fla
Reflection on Feedbacks about Group Project
Reflection on Feedbacks about Group Project
- Daniel stated that visual and interactive representations are not drill and practice, quiz questions, tests or games, they allow a user to explore its content freely and this exploration is often externally directed. So our project should be kept to a single representation displayed on the screen. Since we had created several screens in our project, we will merge the contents and represent of information into a single screen in our final product.
- In our visual representation some classmates wonder that is it possible that the angle of elevation is an obtuse angle? In the local textbooks, the angles of elevation and depression are smaller than 90 degrees. After discussed with Daniel and other classmates during the lesson, we change the angle of elevation and depression between 0 to 90 degrees.
- In our project we found that the skill of placing a mouse cursor over a hotspot area is very useful. The information will appear when necessary and this helps save a lot of space in a visual representation with only one single display. But some classmates mentioned that it was quite difficult to discover the hotspot. As a result, we created some hints inside the visual representation in order to let user know about the hotspot.
- Designing slider is another important feature to know for effective creating of interactive visual representations in Flash. In our group project we designed two sliders in order to allow user to observe the change of Angle of Elevation and Depression. User dragging the slider can change not only numerical values on the screen but also display the movement of the object. The changes in visuals tell the user if a variable represented by the slider increase, it also change the related graphic representation. Some classmates found that the sliders were started at "end". So we will correct it in our final version.
- Some classmates pointed out that the plane and the ship will not move like this, they should move at a horizontal line. We will amend it in our final product.
Theoretical Discussion About Group Project
Introduction
Hammond and I are the secondary school teachers in Hong Kong. Hammond teaches Mathematics and Computer while I teach Design & Technology . Angle of Elevation and Depression are the topics in Form 3 Mathematics syllabus. According to our experience, students can learn above concepts easily if teacher can use more visual representations instead of words alone. In our group project, we will design an interactive visual representation using ‘Flash’ to explain the concepts of Angle of Elevation and Depression. We hope that the product will help students to understand concepts easily and attract their learning interest.
Process of Group Project
First Step
When we posted our proposed storyboard of group project in the Blog, we got some useful feedbacks from classmates. They suggest us to use photos to describe each page of our storyboard instead of words alone. It is believed that people can learn more deeply from words and pictures than from words alone (Mayer, 2005). Visuals can communicate complex ideas with clarity, precision, efficiency and convey the most knowledge in the shortest time in small space.( Tufte ,1983).
Second Step
Afterwards, we start to construct a web page for learners to study the concepts of Angle of Elevation and Depression. The contents of web page will consist of explanations, games and quiz. We will design more pictures less words in our group project because we believe that well designed graphics are far more effective than words. Other research throughout the 1990s has also demonstrated that visual displays have supportive effects on communication of information, thinking, and learning (Mayer, 2005). Interactivity can enhance information communication capability of visual display and allow for more information to be meaningfully structured. This can further engage a student to interact with the display and become more active that just passively view the display (Daniel, 2007). Furthermore, carefully constructed pictures as visual text adjuncts can not only have a decorative function, but also have functions of representation, organization, interpretation, and mnemonic encoding (Levin, Anglin & Carney, 1987).
Final Step
At the end of April 2007, When we posted our near-completed representation of group project into the Blog, we got a lot of useful feedbacks from Daniel, Ryan and classmates. Firstly, as Daniel stated that visual and interactive representations are not drill and practice, quiz questions, tests or games, they allow a user to explore its content freely and this exploration is often externally directed. So our project should be kept to a single representation displayed on the screen. Since we had created several screens in our project, we should merge the contents and represent the information in a single screen. Secondly, in our visual representation some classmates wonder that is it possible that the angle of elevation is an obtuse angle? In the local textbooks, the angles of elevation and depression are smaller than 90 degrees. After discussed with Daniel and other classmates during the lesson, we change the angle of elevation and depression between 0 to 90 degrees. Thirdly, in our project we found that the skill of placing a mouse cursor over a hotspot area is very useful. The information will appear when necessary and this helps save a lot of space in a visual representation with only one single display. But some classmates mentioned that it was quite difficult to discover the hotspot. As a result, we created some hints inside the visual representation in order to let user know about the hotspot. Fourthly, designing slider is another important feature to know for effective creating of interactive visual representations in Flash. In our group project we designed two sliders in order to allow user to observe the change of Angle of Elevation and Depression. User dragging the slider can change not only numerical values on the screen but also display the movement of the object. The changes in visuals tell the user if a variable represented by the slider increase, it also change the related graphic representation. Some classmates found that the sliders were started at "end". So we will correct it in our final version. Finally, some classmates pointed out that the plane and the ship will not move like this, they should move at a horizontal line. We will amend it in our final product.
Conclusion
After the project we were more clearly about the concept of visual representation. It is not like PowerPoint presentations or web page. It is always a single slide and all information is prepared for the user who can then interrogate it and interact with it. By the way, Thank you very much to Dr. Daniel and other classmates, they gave us some useful suggestions, as a result, we can make our project more reasonable and interactive.
Reference:
1. Mayer, R. E. (2005). The Cambridge handbook of multimedia learning. New York: Cambridge University Press.
2. Tufte, E. R. (1983). The visual display of quantitative information. Cheshire, Connecticut: Graphics Press.
3. Levin, Anglin & Carney, (1987). The psychology of illustration, vol 1 basic research: Springer, New York
4. Daniel Churchill (2007). Interactive representations of information and knowledge. http://wp.cite.hku.hk/
Saturday, April 28, 2007
Second Version of Group Project
Thanks to Daniel and other classmates' comments we decided to keep our assignment to a single slide. Angle of elevation and depression will rotate between 0 and 90 degree. Since visual and interactive representations are not drill and practice, we deleted quiz and game sections.
URL of second version of group project:
http://iln.cite.hku.hk/com/1374/users/klcheng2/index2.swf
Tuesday, April 24, 2007
Proposed Group Project
Hammond and I had confirmed the topic for our group project.
Subject : F.3 Mathematics
Topic: Angle of Elevation and Depression
You can click the following link to open our flash prototype.
URL of group project:
http://iln.cite.hku.hk/com/1374/users/klcheng2/index1.swf
Saturday, April 14, 2007
Storyboard of Group Project
Hammond and I had confirmed the topic of our group project: Angle of Elevation & Angle of Depression.
With the help of classmates comments we had added more visual elements in our project in order to explain the principle clearly.
URL of Storyboard:
http://iln.cite.hku.hk/com/1374/users/klcheng2/Storyboard_of_Group_Project.ppt
Monday, April 2, 2007
Group Assignment
Hammond teaches Mathematics in a Secondary school. Angle of Elevation and Depression are the topics in Form 3 syllabus. Some students found them have difficulties in understanding its concepts.
The concepts of Angle of Elevation and Angle of Depression are as follow:

α = angle of elevation,
β = angle of depression
In fact Angle of Elevation and Angle of Depression are the funny topics. They both can be applied in daily lives. For example we can used them to calculate (i) the height of a mountain. (ii) the depth of a hole. (iii) the inclination of a road.
We plan to use 4 pictures to explain and consolidate the topic:
Topic: Angle of Elevation and Depression
1. Introduce Angle of Elevation.
2. Introduce Angle of Depression.
3. Games.
4. Exercise.
Sunday, March 25, 2007
Proposed Group Assignment
- Hammond and I are teachers in Secondary schools. We are going to develop a teaching aid using Flash for students to learn.
- We are going to develop or explain a theory which allows interactivity and need not take a lot of time to download the animated images.
- We would like to use animated images to explain the theory because visual can make deeper impression in many aspects. Text is also important as good visual should contain well organized words in order to illustrate the pictures.
Session 4 Reflection
- During the lession I watched others' visual representation on raindrop. Some of the works are very well done by the classmates.
- Dr. Churchill had demonstrated the use of Flash in the lesson. As a beginner of Flash user I try to follow the steps to develop simple animation. The following is the simple work of me. http://iln.cite.hku.hk/com/1374/users/klcheng2/button-2.swf.
- Hammond and I had a talk about the assignment we are interested to do.
Sunday, March 18, 2007
Visual Display of Task Three
URL of visual display :
http://iln.cite.hku.hk/com/1374/users/klcheng2/task3.ppt
Monday, March 5, 2007
Visual Display of Task Two
Hammond Wong Yau Kit and I designed a single visual display to show the main ideas of the text, we hope all of you can understand what we drew and give us some comments.
URL of visual display : http://iln.cite.hku.hk/com/1374/users/klcheng2/task2.ppt
Steps to finish the task two:
Read the text (separation)
Discuss the text (combine)
Serach information and pictures (separation)
Design a visual Display (combine)
Apply PhotoImpact and PowerPoint to do visual display (combine)
Reference:
Wikipedia The Free Encyclopedia, http://en.wikipedia.org/wiki/Main_Page.
Monday, February 26, 2007
Week One Reflection
We can find some changes from the communication. Through using Blog we can reflect the new things we learnt. We can discuss changes in our thinking and provide artifacts, links to which we are developing. We can also invite class members to provide comments and feedback.
