KMWorld & Intranets

Personal Knowledge Management

From: DavePollard, 2 months ago





2006 KM World & Intranets presentation

Final Prototype

Final Prototype:
http://iln.cite.hku.hk/com/1374/users/wctang/INDEX-Changeable-3.swf
Other fla:
http://iln.cite.hku.hk/com/1374/users/wctang/INDEX-Changeable-3.fla
http://iln.cite.hku.hk/com/1374/users/wctang/default-3.fla
http://iln.cite.hku.hk/com/1374/users/wctang/Gallery-3.fla
http://iln.cite.hku.hk/com/1374/users/wctang/OtherInf-3.fla
Other swf:
http://iln.cite.hku.hk/com/1374/users/wctang/defaultmovie.swf
http://iln.cite.hku.hk/com/1374/users/wctang/Gizaslides.swf

A Brief Description on How Representation Works

The purpose of designing this representation

Firstly, I have discussed with one of my classmate to brainstorm the ideas of our assignment, however I completed the job individually after my partner had dropped out. The topics of “representing of mood” and “Egypt’s Tour” that we raised, and I choose the latter one as my representation. Browsing over the websites available, I found that there was full of information available for someone to search, but it was not easily to be differentiated and graphics should be selected precisely. For the convenience of both the friends and viewers who might came across with a glance or impression with limited time, it is essential to have a simple and vivid website in a visual and interactive format to introduce the sightseeing spots in Egypt. As my traveling experience 2 years before, photos and information might be used to construct our representation for the attraction to viewers, I regarded that a simple and colorful designed visual interactive representation could help to attain the objective. I decided to make the image as a type of planner book that could introduce basic attractions within several pages. Undoubtedly, there were many conditions to handle the software of flash in more assessable way. The last prototype was the challenge for me to handle well in operation of flash but it helped me to know how to make the product to be vivid and interactive with viewers.

The Use of the representation

This interactive visual representation was mainly designed for communication of information. Target users are able to get impression and basic information they need from this representation. The design of planner was made with more user-friendly process. Viewers just did a few clicks to get information needed and graphics were the main information. .This representation could also be used as a reference material for teaching and learning. For instance, when students were asked to write an impression and basic information for an essay or do a project to introduce tourist attractions in Egypt or to plan a trip in Egypt, they might collect useful information from this representation and it might help in learning purpose in a certain extent.

The functionality of the representation

Through these interactive visual representation tourists, someone could get preliminary information about the areas in Egypt. They would find the photos that attracted them to seek further information by clicking the pictures. Then the picture could be chosen to have a glance. At the same time, a page of hyperlinks appear to refer information if the viewer hoped to get something browsing for. The page of route and map presented my trace, photos and information. Someone could put the mouse on the interaction buttons to get information vividly. Then certain relevant information of books, CD would pop up as someone who clicked the links. The design was simple enough for all kinds of viewers who wanted to know more about tourist attractions in Egypt.

Reflection

As I have mentioned above, this representation is for the intention of sharing basic information and data for those who want to get initial glance on Egypt. With the technical limitation of IT skills and the time constraint, it is certainly necessary to improve in some areas. For example, the size of interactive stage and fonts should be bigger to attract others and presented clearly. More tourist attractions and information icons could be included in the representation. I have experienced a series of tasks that could make me insights on how to improve the interactive presentation and make a good representation.

Latest Version on the final prototype

Here comes my latest version on the final prototype that is the representation of the stuffs concerning Egypt. I hope that it may not be complicated to present the information upon our assignment. Several technical problems that I face against are the attachment between two objects of .swf. Anyway, I have finished my great part of pages and now I present here as the below link.

http://iln.cite.hku.hk/com/1374/users/wctang/INDEX-Changeable-3.swf

The above flash that I hope to insert into my page of Diary will be finished later.

Approaching to my final product - Part 3

(Click the photo above and try the hyperlinks that you want to browse)

The page of other information was attached with photos of websites, frontcover of books, CD and etc. I was the first time to copy the action scripts from other .fla that I could operate the pages for disaplay vividly. You could see that I inserted buttons to link with the pages that could be opened and moved into centre of window. The particular motion was controlled by the action scripts by copying from other, I had not any ideas why it could be done actually. This lesson urged me to learn that the action scipts could be borrowed into personal creation, and it saved time to dig into the profound syntax technically. All photos could be clicked by mouse and it would bring you into the webpages that you wanted.

Approaching to my final product - Part 2

(Click the above photo and see the effect)

By the comments from classmates, as the topic said, I decided to make the route for demonstartion of my trace in travelling Egypt. I used the gif. of shoes inserted along a moving line and then displayed my photos whle the shoes were passing by. The objective for this page that I regarded was accompanished with interactive button below. Someone could click on it and start off my journey along the spots in Egypt. Hoping that someone would give me comments on the effect of route, and other presentable ways to meet the task on this page.

Approaching to my final product - Part 1

(Please wait for a while and you can see all photos downloaded into page)

(you may click and open the above 2 files and see the photos displayed interactively)

I have finished my page of Gallery that comprised of several photos divided into two groups: People and Sceneries. The page that I felt much satisfactory carried out those of the effects with message graphically. I fully combined with the two pages as left and right, firstly it was convenient for user to click on the group on the left hand side and then the relevant photos could be seen on the right. Despite of the limited presentaiton for the photos pre-occupied in page, I made the photos presented user-friendly and impression with graphic orientation would be done. Lastly, I always met with the difficulity in handling the click that would link with other swf successfully in my directory of computer, however while I uploaded to server, it could not happen again, eventually I found that it should take time to load the photos that occupied memories in connection between pages.

Story Board for my final assignment - Part 7

It spent so much time to accompanish the tasks, especially in the linkages between .swfs, fused with more than 2 elements. The plan that I made the tasks into 5 pages had beated me down, since I was unfamilar to operate the commands of flash. I have decided few pages constucted with photos, however I could not combine them into a smooth file with one swf. I spent many hours to do it, and attempted many times by trial and error. Eventually, maybe I buy some books to follow the instruction. Here, I posted the background of my travelling experience, and it shoud be inserted into my main swf, probably I would try again later to make my task completed.

Story Board for my final assignment - Part 6

(download it for a while, and you may use mouse click below the screen to see it)

I created a flash of slides-player to present my photos, however I came across a problem of handling time-lap while I was loading other attached .swfs or photos from a distance site at ILN's server. Although part of my pages have been inserted with a loading screen, and the viewer could notice the files when the pocess of loading was completed 100%, it made me consider either all material were cutted down the size or, a preferrable site of blog could be stored with files with great extent of memories. Anyway, do any classmate find difficulty to handling loading or just I was too ambitious to enclose lots of stuff? I found that the topic of loading interactive materials would be my attention during learning process. In future, I should consider how to create interactive representation but it could be viewed promptly, and being user-friendly made for my viewer.

Story Board for my final assignment - Part 5

(please click on the upper photo to down the .swf and try it)

When I started to design and produce the content for each page, I prefered to start from the map that might fulfill my need to achieve new technique, and it urged me to adapt the operation of using Flash. During the session by Daniel, I learnt one of the technique that helped me to demostrate places of interest by clicking each mark on map. This was so much useful for me to present the scenaries to someone if he or she just clicked by mouse over the buttons. I have seen the products from other classmates who created the interactive map about their travelling experience. Interactive feeling is good and I am sure this technique to be my favourite model to create other content of pages.

Story Board for my final assignment - Part 4

(please click on the upper photo to download .swf and try it)

Finally, by using the main template of front page, I completed all other pages with interactive tags that were done by the structure of button in flash. someone might find interesting button on the left, named "Click Me", to get impression by a serie of photos. Music was inserted as well for the enhancement of attenion. Specific and colorful tags were created for someone who caught the separated topic clearly. The design of content for each topic will be left to further elaborate.

Story Board for my final assignment - Part 3

For the reason of convenient clicking, I created 5 tags or labels on the right hand fringe of the template. Someone should easily click on the tag and browse over the pages to select topic. Attractive background was attached on each page with specific photo or image that made distinctive impression for someone to view it. The selected topics are as follows:

1. Front page: the main purpose of front page is to demonstrate the main content on this website. Something attractive graphics is stated for enchanting someone to stay awhile. Front page may also be looked upon as a basic structure for the whole pages that are going to produce. Therefore, it is designed as a main template in which I could create other pages with similar design and pattern. I have posted a “Click Me” button to present several photos with interactive function; it may attract someone to pay attention to the representation.

2. Route and Map: I would use the technique that I learnt during the learning session. Posting photos and description is attached with the pointer over the places of interest. A route of my journey may be stated with a distinct line over the map. Several sceneries are used to introduce my journey and provide basic information on traveling.

3. Dairy: unique and precious experience is disclosed to share with viewers with sentimental approach since the reader may get interested in first impression, not just only searching traveling hints with informative mind.

4. Gallery: lots of attractive images and photos are posted as a pool so that the viewers can find something interesting by a glance of searching. Graphic information can enchant the viewers to pay attention on it.

5. Other information: I believe that no one can manage all the things that are enough for someone to fulfill the searching need, more importantly, further information should be provided as hyperlinks or websites as one’s preference.

Story Board for my final assignment - Part 2

The template of main page was my important part to finish since the viewer could use mouse click to enter into each page attributed to different topic, such as Route and Map, Diary, Gallery and so on. The shape and pattern of page was done with reference to my planner so that it may be a user-friendly guide within it. You will see below template that is separated into 4 parts. The left corner one is stated as the topic on that page. Below column on the left is scattered with several buttons, with the purpose of first impression by photos and cultural music. For the largest area one with grey color, the content with attractive photos and images will be presented. Lastly, at the right hand side, you can see 5 labels that are used to guide someone browsing each page with separated topic.

I attempted to insert music into the button and then made the photos changed one by one vividly. I hope to build up several buttons on the map, and the viewer could click on the button scattered on the map for previewing of Egypt’s sceneries.

Click me and try it

Story Board for my final assignment - Part 1

By the design of webpage for the topic, I prefer to create a foundation page with background template and put all designed pages pasted onto it, and make individual button attributed to each page for browsing by viewer’s preference. Therefore, the foundation page would be unified and enclosed common elements, such as background music, buttons and images in a same area. I made a link of my contact at the upper right corner for information exchange (however, it has not functioned yet). Lastly, I posted my website of blog and course’s name on the below and then someone could browse into my blog site to view the building process for this representation.

Preparation for my final assignment - Part 4

This is something that came to me during the process of focusing on my learning object. I drafted out the framework, likes organizational charts, as to consider the possible pages that I need to produce. Diary, map and album should be stated in my pages for demonstration of colorful representation. And more the relevant information about Egypt and more interesting, I planned to have a contact page for someone who would response to my experience. In the next step, I needed to consider the front-page of index and having unified design appeared in each page. Here comes my initial thought of that structure:

I forsee that there will have 6 pages of swf made in my assignment with simple design only. However, I expect the basic design to be simple and monitored as a way of my planner's function.

Preparation for my final assignment - Part 3

Literature Review

In this study, though I would be engaged much time spent on the technical operation for my assignment, however I learnt that literature review should be done for my realization of background in which some thought from professionals contributed to representation theories. Multimedia could effectively facilitate language acquisition as well as language comprehension, and these connections provided learners with two types of cues for the retrieval of learned materials effectively as compared to only one when they learn with text only. I learnt from the following theories form the references of powerpoint in session 4 and agreed to use both cues as my represenation.

Theories of learning from texts and visual displays:

Dual Coding Theory

Majority of theories state that people can learn more deeply from words and pictures than from words alone (Mayer, 2005). According to Paivio’s (1986) dual coding theory, there are two cognitive subsystems, one specialized for the representation and processing of nonverbal objects/events (i.e., imagery), and the other specialized for dealing with language. Paivio also assumes two different types of representational units: "imagens" for mental images and "logogens" for verbal entities. Logogens are organized in terms of associations and hierarchies while imagens are organized in terms of part-whole relationships.

Dual Coding theory identified three types of processing: (1) representational, the direct activation of verbal or non-verbal representations, (2) referential, the activation of the verbal system by the nonverbal system or vice-versa, and (3) associative processing, the activation of representations within the same verbal or nonverbal system. A given task may require any or all of the three kinds of processing.

.

Multimedia Learning Theory

.

Mayer (1997) also developed a multimedia learning theory, which combined the assumptions of dual coding theory with the notion of multilevel mental representations. A main assumption of Mayer’s model is that verbal and pictorial information are processed in different cognitive subsystems, processing results in the parallel construction two mental models individually, and finally they are mapped onto each other. Accordingly, an individual understanding a text with pictures selects relevant words, constructs a prepositional representation or text base, and then organizes the selected verbal information into a verbal mental model of the situation described in the text. Similarly, the individual selects relevant images, creates what is called a pictorial representation or image base, and organizes the selected pictorial information into a visual mental model of the situation shown in the picture. The final step is to build connections through a one-to-one-mapping between the text-based model and the picture-based model. Integrative processing is most likely to occur if verbal and visual information are simultaneously available in working memory, that is, the corresponding entities in the two models are mentally available at the same time (Chandler & Sweller, 1991).

Integrative Model of Text and Picture Comprehension

.

On the contrary, Schnotz (2002) holds another viewpoint who focuses not on pictures and text by itself, but on depictive (iconic) and descriptive (symbolic) representations. In this Integrative Model of Text and Picture Comprehension, mapping happens at the level of mental model construction and what results is not an integrated representation but complementary representations that can communicate with one another.

Other research throughout the 1990s has also demonstrated that visual displays have supportive effects on communication of information, thinking, and learning. 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).

Conclusion

With the help of above theories, interactive multimedia undoubtedly provide evident to enhance the effectiveness of teaching and learning. As my knowledge, well-designed multimedia is very time-consuming and necessary for money input; however, If the interactive learning purposes are managed to reach and identified by viewer or learner with impression, it could be a valuable media to use. Thus, interactive multimedia can help teachers streamline their preparations of teaching materials and be more efficient in deliver the message, information, or knowledge to other people. As my assignment of traveling information, I hope to achieve the prominent objectives to fulfill the basic principles by above literature information.

References

Chandler, P., & Sweller, J. (1991). Cognitive load theory and the format of instruction. Cognitive and Instruction, 8, 293-332.

Mayer, R. E. (1997). Multimedia learning: Are we asking the right questions? Educational Psychologist, 32, 1-19.

Mayer, R. E. (2005). The Cambridge handbook of multimedia learning. New York: Cambridge University Press.

Paivio, A. (1986). Mental representations: A dual coding approach. Oxford, England: Oxford University Press.

Schnotz, W. (2002). Commentary - Towards an integrated view of learning from text and visual displays. Educational Psychology Review, 14(1), 101-120.

Preparation for my final assignment - Part 2

The below information is the summary of my ideas on the final assignment:

Objective:

To reinforce that viewers can learn and retrieve basic information on "my wedding trip in Egypt" through visual and interactive information.

Reference of Theories:

Mayer's cognitive theory of multimedia learning and Paivio's dual-code theory.

Method:

Using softwares of Flash 8 and other photo-editors to create animated rollovers and pages to presenat effective and lively ablums or collections. Photos, graphic materials and music are introduced to enhance the attractiveness of representation.

Deliverables:

Interactive learning objects will be designed and implemented with Flash to maximize the learning and knowledge sharing effectiveness based on the theories of Mayer and Paivio.

Target Users:
My friends or any viewers who get interested in basic impression and travelling information from Egypt

Materials:

Photos (from my trip or referal from internet or books), maps(including route of trip), basic information from Egypt (Egypt's traveling websites), music/language(popular songs or simple arabic oral), user-friendly flashed pages(for the menu browsed by viewers) and etc.

Preparation for my final assignment - Part 1

My motive of assignment

When I prepared for constructing the framework of representation on my final assignment, I was browsing the internet and searching something insights from web-pages for my preliminary reference. Being an initial stage of information seeking,I have collected some thought and ideas, and they helped me to consider which topic that I would like to complete with my great interest. Firstly, I expected that it might be personalized in my life events since it could urge me to finish the assignment with a pleasure journey. However, I did not want the representation strayed far from the learning object with educational purpose. For my assignment, I hope it could have both personalized and educational components within my works and finally it would make me learn how to make representation with languages and imageries. As the dual coding theory proposed by Paivio attempted to give equal weight to verbal and non-verbal processing. Paivio (1986) stated: "Human cognition is unique in that it has become specialized for dealing simultaneously with language and with nonverbal objects and events. Moreover, the language system is peculiar in that it deals directly with linguistic input and output (in the form of speech or writing) while at the same time serving a symbolic function with respect to nonverbal objects, events, and behaviors.” (p 53). Therefore, I learnt from Paivio’s sayings that I must accommodate this dual functionality to present my works vividly. Lastly, I decided to create pages of traveling information that included one of my life events – Egypt Trip, which was my unforgotten wedding trip 3 years ago. I could use the photos and information about my traveling records and collect information with educational purposes. Not too much personalized materials, but I would like to make the representation to be interactive with text, photos, relevant web-links, music and etc.

One photo had been taken from Zoser's step-pyramid at Saqqarah. However, how I use this picture to demonstrate attractive learning object for my representation?

Interesting photo from Egypt, however, what type of theme or organizational plan to show this picure? Creating specific pages for collection of photos or something creative presentation?

Reference:

Paivio, A. (1986). Mental representations: A dual coding approach. Oxford, England: Oxford University Press.

Task 3: Raindrop

Actually, I experienced difficulty in handling powerpoint to present the concept for the shape of raindrop. However, I finally attained my objective to describe the freefall of raindrop after several attempts. I would try flash later to make the representation more vividly, however for my first product I would rather use simple tool as powerpoint to make it done. The below one is my product as your comment:

Reflection on Session 2

It is not how much information is there but rather how effectively it is arranged

Key Points from Tufte, 1990

Principles of information design are universals – like mathematics – and are not tied to unique features of a particular culture.

Key Points from Lester (2000)

During the lesson, I was impressed by the interactive representation from classmates, especially for their creativities in the design. It seemed that visual format could capture people’s attentions. As the task assigned by Daniel, examining the five visual display of same information about giant squid stimulated me much on the the desing of reprentation. Actually, physics concepts were frequently represented by picture, graphs, diagams or others. Concept map should be better seen by viewer for informaiton. In reading the picture, viewers caught the message from the limited information seen only by a glance or a small area. Visual display was usually more attractive than words. It impressed someone to remember the image that may be retained in human brain. This visual aids in teaching not only made student easier to learn, but also necessary to make them to understand. No matter what culture it is, or by any language can understand those concepts. Undoubtedly, visual display is universal.

How I design my representation for Task 2 - Part 4

Finally, I cut down the image for part of my illustration combined with other diagrams from internet, for example, Wikepedia and other documents. All mixed with each other, it could enhance the effectiveness of representation vividly and colorfully. And now I shared with you and hope to have comments on it. Please click on the below picture:

http://iln.cite.hku.hk/com/1374/users/wctang/Task2.ppt

Other sources:

The magnetic field between sun and earth:
http://www.weizmann.ac.il/ESER/People/Yinon-Rudich/courses/stratospheric_ozone.pdf
The earth's atmosphere:
http://en.wikipedia.org/wiki/Earth

How I design my representation for Task 2 - Part 3

I just learnt that "visuals” invented to communicate complex ideas from Lester(2000). Pictures could be a powerful instrument so that viewers captured the concepts easily, at least it enhanced the effectiness on initial impression. While I attempted to fill in the colors on my drawing script, it stimulated me to think about how people to reason the information, especially for those who youngsters, grown up with abundant information of multimedia, could catch up knowledge easily by the mean of images. Visualizing meanings from visual formate, it could assist to reason the concise. Therefore, I utilized the space and partitions to fills in colors and marked down keywords to illustrate the concept. The above key points tell me how important of understanding visual language. In the process of drafting, drawing and noting down the keywords, I could clarity how I learnt from the concepts profoundly, and it could encourage me to use more presentative formats, for example symbols, icons, diagrams, charts, mindmaps , even diagram with 3-dimensions. By Daniel's handouts, I hope to leant more methods to enhance the interactive outcomes and then viewers could capture my messages or information that I was eager to tell them about.

How I design my representation for Task 2 - Part 2

Upon the requirement of assignment, I decided to meet the purpose of illustration and look closely at an easy-captured ways for the people to get the concept. This often included keywords and graphic illustration by allocating the partitions to make people understand branches of concepts. For me, visual illustration was an useful instrument that helped me to clarify the concise and it would attract people to share with my ideas, and reason the messages that I wanted to deliver. In this assignment, I used a hand-made picture to illustrate part of the content and it could draw people’s attentions to get the impression firstly. However, I also collected other references for presenation of my ideas, and eventually I decided to use mixed approach for illustration with other ready-made diagrams. Sometimes, it could save my time to accomplish the residual concepts and highlighed all information with interactive enrichment

How I design my representation for Task 2 - Part 1

Initially, I planed to make the representation by noting down which keywords should be in cluded and illustrated within a confined area for one page only. I drafted out the ideas by the method of mind-mapping, I could clarify my ideas with respect to the keywords or concept assigned by the topic. One by one, I used the lines to associate with the related concept that included several keywords to demonstrate the contents. It was also the time for me to think about the method or style of presentation. I would consider choosing either referring other diagrams or pictures by ready-made format or hand made by myself.

A Baby or Not !?

Today was an utterly fantastic day. I gathered with my family members again since it was the day of chinese lunar year . My sister always chatted about baby and the stuffs after our marriage. She was such a wonderful woman and her interest in family planning gave me insight and inspiration.We talked about whether giving birth to have a baby or just breeding pets for living, and found that I needed to carry on embracing cats and dogs rather than children. I admited that my wife with I did not want to have a baby. This meant I had to maintain the family world just two of us. My wife expressed her fear of breeding baby because she had been a social worker, and the experience with marginal youngsters impressed her very much. She did not want to suffer burden from bringing up a baby. Frankly, I agreeded with her opinion as taking so much responsibility to feed a baby. My sister advised me that baby is a great creation and she or he would bring us happiness in my future life, particularly they could make our family as a whole. I didn't think it was right yet, however I would keep practicing our living in which my wife with I just enjoyed life with our lovely pets, 3 cats and 2 dogs altogether. I just knew that they didn't need going school and spent our money much on the expenditures in education activities. As for breeding dogs, we just felt easy to bring them out for a walk, throwing ball for them to catch up. Breeding cats was more easier than everything, we just kept them inside and they would walk around the place. Their behavours always made us smile and became relaxing. My sister said that the time to give birth for a baby was limited, we might catch the timing, and didn't miss it. That was a great idea, however running the schedule for a baby was not suitable for us, however I would enjoy the moment that my wife and I kept in going with our pets rather than baby. Might be changed in future moment with something inspiration....

Hi! everybody, I am Kenny Tang

http://iln.cite.hku.hk/com/1374/users/wctang/Kenny.ppt (4.63Mb)

My Insight in First Session

Interactive learning with the help of different materials stimulates me to boarden my experience to learn. The teaching slides in first session gave me lots of insights to think about how to utilize vivid and colourful stuffs to put into presentation. Probably it depends on the purpose of presentation that may help creator to organize different materials into one continuous platform, and it may have tremdous power to deliver messages from one to others

My Wedding