Multimedia Toolbench: A Chapter on Still Images

"Perhaps because of the noisy and chaotic nature of the production process, these tools are located in the south side of the encircling ring architecture." (Bakersmith Report, 2015, p.37)
 
Learning consists of several stages. The research stage can be seen as a form of mining.  What is there? The composition stage combines invention, design and production skills. Given what I've found and learned, what can I make? To be empowered to create requires both research and composition. Though these are essential, they are generally both dependent on another stage. To make something socially relevant requires audience. Who's interested? Who benefits? With these thoughts in mind, we will explore further problems and issues with linking (multimedia communication) in the context of two-dimensional images. Which comes first when a new idea comes to mind, the words or the picture? What is the relationship between text and image? How does this relationship impact the learning process? What impact should this have on future curriculum development?

Culturally we commonly use two-dimensional images in a wide variety of ways. Another term for this topic is "still image" to contrast it with image movement in animation and television. It is difficult to imagine any instructional event in any hour of the school day without some still image being involved.  The walls of our classrooms, halls, and homes as well as textbooks, magazines and our children's books are covered with still images. Where do they come from? What role can computers play in their creation? Why do we value images so highly?

A good beginning point is an understanding of some basic steps in the creation of images.  Three stages are useful here: input, manipulation, and output. These cannot be considered totally distinct stages however, for input and manipulation are controlled by the purposes of output or audience.

Input

In a sense, composition begins with the very selection of input tools and the emergence of the idea of the image you wish to have or see. Composition is framed by purpose. For example, to aim a camera is to position a virtual rectangle around a perspective in order to capture it.  This decision is a highly creative and inventive stage of the process. Why did you choose that view? What conscious or unconscious forces make that view seem relevant to you or others? Input devices represent a technology that has some way to place the images they capture into a computer readable (digitized) format.

Input devices for a two-dimensional image include: your hand as it paints and draws; cameras, both analog and digital which can be connected to a variety of lenses including telescopes and microscopes; the computer mouse; graphic tablets (e.g., pressure sensitive Wacom tablets and pens; price list ); scanners; CD and DVD players with clip art; videotape and videodisc players and video cameras including analog and digital.  Engineers might use large drafting table size graphic tablets which cost several thousand dollars.

The quality of the output also depends on the quality of the input.  The more pixels per space that can be captured, the greater the accuracy in reproduction. In turn, pixels vary in terms of the depth of color that they can display.

Input Tool Tutorials

Shooting an Image

Manipulation

There are a number of fine computer tools for the creation and manipulation of images. At a very basic level is the Paint program which is included free with the Windows operating system.  Microsoft Office 95, 97 and 98 included some basic draw features in its Word processor. More powerful and school affordable are the draw and paint tools in Appleworks (formerly Clarisworks), a program that runs on both Macintosh and Windows computers. The 5.0 and later versions of Appleworks save files in a wide variety of formats of use for both print and web display. Professional users, however, work with a series of programs that vary in their emphasis of tools for painting, drawing and image manipulation. The features of even these professional programs are well within the range of the ability of K-12 students once they have had some initial training. This first level of this knowledge base requires understanding of a few concepts.

Building an Image

Manipulation Tools

Output

Traditional Output

The type of output chosen depends on the way the audience will view the work. Printers may produce work from the size of a sheet of paper to 50 foot billboards. Printers print in black and white and in color and on a variety of different types and thickness of paper. Other output devices include: slide shows (both analog and digital); projection systems to large screen and video walls of dozens of large TV screens; color plotters, cutting knives that cut floor tile, sign printers, overhead transparencies and a wide range of posters that can be scaled to the size of highway posters and larger. Scanners can reproduce work in a wide range of resolutions whose output may vary from 72 dpi (dots per inch)  to 4000x3000 dpi. PhotoCD technology promoted by Kodak digitizes images and puts them on CDs in a variety of different pixel densities and graphic formats including JPEG. Different software applications specialize in display for computer screens and computer projection systems. On non-networked computers, the Powerpoint application is perhaps the most commonly used for image display. Among networked computers, the World Wide Web system on the Internet is most common.

Web Output

The Internet and its WWW (World Wide Web) have introduced a whole new set of image output considerations: blind users; speed; within-image control (image maps); and severely limited color selection.

Blind

For users of the Internet who are blind, a special technique is employed. An HTML special tag can be used to create a textual description of an inserted image that is hidden from sighted users but displays in text browsers, the ALT command. In Netscape Composer and other web editors, the commands that allow image insertion also have a special field to enter the descriptive text for the ALT (alternative) command. The ALT command then holds text that describes the image and if the browser is a text only browser, the text is transmitted, not the image. The text reader of the blind user then speaks this text or perhaps converts it to braille for a braille reader.

Speed

Because it takes much longer to transmit images than text, the WWW system require special handling of images. Another meaning of WWW is World Wide Wait! Multimedia elements such as still images are a major source of the wait. In the years ahead, fiber optic lines will make concern about waiting obsolete, but for now most users of the Internet are using standard telephone modems. If several images are included, one page could take several minutes of transmission on such modems before the page is complete. The smaller the image, the less data it contains and therefore the faster it transmits. Slow loading pages chase newcomers away from further exploration of a web site. The first strategy is to make the image smaller by scaling or cropping or both. In addition to making the image smaller so that it contains less data, different compression formats are used to optimize the transmission speed of the image. Pay close attention to the file size of your images to gain an appreciation of what happens as an image moves through different stages for different forms of output. Hotspots can connect parts of an image to other files. The underlying structure of every web page is HTML or hypertext markup language. HTML code allows specific parts of an image to be designated as a link point, so that a click of the mouse can connect with and force the display of another file.
Study this example.  Explore Sabrina's Web Site through the use of a clickable web site map.
The web site map clicks or links to other web pages that make up Sabrina's site. These clickable areas are referred to as hotspots. The more technical term is image map. There are many examples scattered across the Internet: The most efficient approaches to image map creation are built into the better commercial web editors. Specialized and free approaches are also available..

Commercial Software

How To Make Client-Side Image Maps  Even though current personal computers can display millions of colors, a significant number of older computers still in use around the world can only display 256 colors. This will be called the 256 color palette. Macintosh and Windows computers running in 256 color mode share 216 colors while varying on the remaining 40. By not using the 40 variable colors, web designers have a palette that can be used to create images without fear of an image drawn on one platform being hurt by a missing or poorly substituted color on another platform. This also applies to background colors and the color of text. Reducing the number of colors used in an image also allows better compression of the file and therefore faster transmission over the Net.

If a computer cannot find a color that it needs it can dither the color. That is, it takes pixels of different colors and puts them next to each other so that they blend in our eye to form a new color that should be close to the color that is missing. Sometimes dithering fails spectacularly. In these cases the color of the text cannot be easily discerned from the background color. Staying with the Browser-Safe Palette eliminates this problem.

As the quality of computers in homes and offices are upgraded and the speed of the Net increases, the importance of this issue will fade and disappear. In an increasing number of cases the problem has disappeared. If the image creator knows that the images are designated for use by a particular institution that uses more recent computers with a broadband network that runs at 10 MB ethernet or higher, the problem is gone. In the meantime, there are a variety of ways to express what colors can be safely used on the large number of computers that can only display 256 colors:

  • The Browser-Safe Color Palette (understandable by most computer users)
  • Colors and RGB Hex Numbers (understandable by graphic designers)
  • No Dither Netscape Color Palette (understandable by those working in HTML code)
  • FAQ about Colour and Gamma (understandable by electronic engineers)

    • Multimedia - Linking Text and Image

    We have seen many factors that must be considered during the output stage of image processing. Output, however, is far more than technique.  Ultimately it is about the image designer's intention. Why is a particular image chosen? Which images have what effects? Once these questions have been answered, an image is created, and a new problem emerges. The relationship between the media of text and the media of the still image must be considered. The joining of image and text is one form of multi-media. What strategies can we bring to determining the best balance or the relationship between image and text? How does the nature of the Internet change these strategies?

    A classic example of image-text balance is in articles by National Geographic. Their articles often begin with a four page foldout, then facing pages of  two page spreads. These images start with text of large fonts and few words that are placed over an image. Then later images use a few more words in a smaller font over the image. These images are followed by  images covering a full page, then half page and quarter page images which include several sentences of description under or next to each picture. As images cover less than a full page, standard size text fills the remaining space, until near the end of the article their full pages of text intermingle with pages with quarter and half page images. That is, they begin with an opening that is heavy with image, then ends heavy with text, with a gradient between these two points. This concept can be expressed by this image.
     


    Electronic slide show tools can easily use the same strategy, e.g., Powerpoint, Hypercard, Hyperstudio and Toolbook. Do you think this strategy is effective? Why or why not? Can you think of other strategies? Play with the two-triangle image in your mind and others approaches will occur to you.

    On the Internet, the larger the image, the slower it transmits. An ideal page takes under 3 seconds to load.  This has forced the adoption of an image-text balance that is somewhat the reverse of print technology.
     

    a rectangle with line dividing lengthwise, word text on one side and image on other
    An opening page to a site needs a small amount of text with a very small image or an image format that transmits very quickly. Once interest has been built, the next set of pages linking from that page have more text and slightly larger images; third tier pages have even more text and/or larger images.
     
    These strategic considerations are also used in the teaching of very complex topics that take years to master, for example, reading. Two and three year olds sit in our laps "reading" picture books with us. The earliest books for children to read, early readers, are primarily image with just a few words per page. (The electronic age will soon produce "books" which will still include just a few words at the bottom, but most of the display space will include all of the other elements of multimedia beyond the static image including 3-D and video with audio.) As readers and learners become more sophisticated, the ratio of image to text changes in favor of text. This suggests that educators should weigh this strategy in all of their educational decisions. What we know about text-image relationships implies that learners of any age need more image when they first encounter new ideas. The need for something other than text such as image is proportional to the complexity and difficulty of a topic. It also implies that this lessens over time.

    First hand or direct experience provides the ultimate input. Multimedia is the first level of abstraction after direct experience. Why does this work? If we hypothesize that the brain is less a word processor and more an image processor, the initial instruction is teaching the brain a set of images for basic manipulation. As the learner becomes more sophisticated and can attend to the nuances of finer detail, the brain can use the information compression efficiency of text to stimulate and transform those images for higher levels of thought. That is, even though the text is so dense as to obliterate the image from the display area, the mind does its real and perhaps unconscious thinking in media (e.g., images, sound), not the high abstraction of words and numbers. If the fundamental image (media) capacity is not in place, throwing more text at a problem of  mis-understanding does not help if there is no image capacity to stimulate. Different words may still help if they can stimulate a deeper level of experience, but without some experience, the words have no meaning. Adult readers may go right to the text and have something to hang the text on thereby concluding that imagery and the pictures adjacent to the text are not so valuable for them. It is true that the images next to the text may be ignored by many, but the text functions for them because the necessary images (or other media forms) are already within the brain and available for use.

    In later chapters we will evaluate the degree to which this concept transfers to other media beyond the still image. This hypothesis has other implications.This would also mean that the most powerful educators are those who can readily reach back to "older" forms of learning in our developmental biology. A teacher's skill includes providing such structures for text to activate. The skill is in teaching the learner to recognize the link between the media structures embedded in long term memory and the right text. However, it is the nature of professional training that this education ends in works dense with text, works with the compressed abstractions of word and number. The danger is that the text which professionals know so well is seen as the place to start instead of the place to finish. The answer to curriculum problems is often seen as a rewrite of complex text to simpler text. If it is true that text works by stimulating deeper and older structures, then text is of marginal initial value without these deepers levels of awareness and experience. Now that computers provide so many ways and so much power to create and manipulate the missing image (and other sensations), there is both great excitement and great potential for addressing curriculum problems in new ways.

    Copyright

    Output is also more than just what you can do. It also involves consideration of what is legal and ethical. Many composers and designers have spent long hours perfecting their creations and expect remuneration and attribution for their effort. Legal issues over the use of images involves U.S. copyright law, its Fair Use provisions and some general agreements between publishers and educational institutions. There are two critical conclusions to remember. First, whether you are invoking the Fair Use Provisions for Educators or not, the source of your text or any medium must be cited. Always give attribution. Second, the Fair Use provision does not apply to open distribution across the Internet. For example, Fair Use would apply to a properly cited image or multimedia resource in a Powerpoint slide, but it would not apply to that same image on a web page that can be seen by anyone with access to the Internet. If your use is educational, and if your web distribution is to an audience that has been limited, such as a class of students, then copyrighted images may appear on web pages. This limitation might take the form of an Intranet within the school that others outside the building could not see. Web designers can also use password protection, carefully distributing their password to only the students in their course or institution. The limits of class size for such distribution have not been tested in a court of law to my knowledge. In case of doubt, contact the creator of the image or whatever form the creation takes and ask for written permission for the use that you have in mind. If it is an email message, print the message. As with any such correspondence, keep it on file.

    The Image and the Internet

    At first it would seem that the computer and the Internet's capacity to link text and image on the same page adds little to the capacity that textbook and paper technology have had for centuries. In one sense this is true. This assumes though that every author, instructor and teacher has had equal capacity for the creation and the publication of image and text. In fact, the creation of color plates has been an extremely costly, sophisticated and time consuming process. Even with excellent low cost color printers, the cost of color image handouts is high and therefore seldom used in classrooms. The Web (with its supporting technology of computer and Internet) has effectively erased the cost problem of color display for the composer. (This of course assumes that the cost of the display station has already been addressed.) The Web has also effectively obliterated the time from the creation of the image to the sharing of the image and eliminated the cost of reproduction. Once an image is completed it takes but seconds to save a file and upload it to a web server with a distribution capacity greater than the broadcast footprint of any single orbital satellite. The only remaining limitations are the resolution of computer display screens and the time that it takes to put sufficient image creation ability in the hands of the author. As the experience of working with these chapters increases, you will have a deeper appreciation for just how long this takes.

    Educational Implications

    Computer composition software and the web have dramatically and irreversibly changed the nature of composed communication. This sea change calls for a re-examination of the language arts (reading and writing) curriculum for the purpose of integrating other common and future standards of communication. As a beginning point, giving much greater attention to image creation would provide the opportunity for numerous changes to school curriculum. These suggestions come with the understanding that a broad range of scope and sequence issues would need to be addressed to better incorporate image composition. Later chapters will consider the impact of increasing access to a wide range of linking (multimedia) tools.

    If pre-school and primary grades (BK-3) students were given as much access to computers with drawing and painting programs as to other forms of writing and drawing, many of the concepts of the writing process curriculum could become part of their thinking and habits before they learn to write. That is, instead of pre-writing, composing with text, editing/revision and publishing, the process would include pre-drawing, composing with images, editing/revision and publishing. Writing would be but another more abstract way to use an old and familiar process. Elements of such a strategy are already in place with an early childhood emphasis on art and with early readers using a heavy balance of image and little text, then an increase in text as readers gain more experience. Since the process has a long successful history with teaching reading, there is reason to believe that a similar process could be effective with writing.

    At the intermediate grades, better readers of text may not miss composing with images, but late developing writers will have a means and process of communication from which they can continue to draw parallels as they struggle to become comfortable with text composing. At this age, composition assignments should include many different variations of the NG Strategy as explained above in the section on Multimedia - Linking Text and Image. Applications with electronic slideshow composition tools that work across different computer platforms are excellent tools for such composition. For example, this would include current versions of Appleworks and Powerpoint.

    Based on the knowledge acquired in elementary grades, older students would be in a position to increasingly turn out publications that match the professional but every-day standards of current print standards and web publications with their balance of image and text.This would also set a foundational level of experience from which many other forms of communication would be incorporated in a given publication, including video, music, animation and more. This would increase the relevance and status of the nature of student learning, an important factor in motivation for teaching and learning.

    Summary

    This chapter has covered both practical and conceptual considerations with images. Imagery is a critical and basic part of communication systems at this point in the history of our culture. Especially for educators, this means that basic skills with image composition are just as important to current and future standards for public communication as skills with the reading and writing of text. The number of skills involved are many. The depth and complexity of these skills means that instruction and mastery over such skills will take some time to acquire. In turn, this would require integration into the scope and sequence of school curriculum over a number of years. Fortunately, computers have greatly expanded and accelerated our capacity to work with and communicate with images. Further, a claim has been raised that image is a primary and text a secondary consideration in the development and understanding of a new idea. The more that students can be involved in the creation of their own meaning through composing in media other than text, the more effective multimedia and learning efforts become.

    Bibliography

    Articles

    Elements and Principles of Design Posters. Teacher's Guide. (1996). Eric Microfiche Document: ED406289.
    Descriptors. Major: Art Education; Design; Graphic Arts; Visual Arts
    Minor: Art; Creative Thinking; Elementary Secondary Education; Problem Solving; Teaching Guides

     Abstract: This book accompanies a poster series and allows the teacher to pre-plan a lesson or activity for students with the objectives shown for each element or principle of design to be presented. Along with a black-and-white reproduction of each poster, major concepts are discussed. Suggested student activities relating to a particular element or principle are included. Elements addressed include: (1) line; (2) shape; (3) form; (4) color; (5) value; (6) texture; and (7) space. Principles of design include: (1) balance; (2) movement; (3) rhythm; (4) contrast; (5) emphasis; (6) pattern; and (7) unity. A 19-item bibliography concludes the booklet. (EH).
     

    Digital Ethics: Computers, Photographs, and the Manipulation of Pixels. by Mercedes, Dawn Art Education; v49 n3 p44-50 May 1996.

    Draze, Dianne; Palouda, Annelise (1992). Design Studio. Eric Microfiche Document: ED406286.

    Major: Art Education; Design; Graphic Arts; Visual Arts
    Minor: Art; Creative Thinking; Elementary Education; Problem Solving
    Abstract: This book presents information about 10 areas of design, with the main emphasis on graphic design. One section presents the creative problem solving process and provides practice in using this process to solve design problems. Students are given a glimpse of other areas of design, including fashion, industrial, architectural, decorative, environmental, urban, and interior. A project is provided for each area. The book is intended to provide beginning design students with information on the basic concepts and principles of design and allow practice in applying the concepts. Each chapter includes a reproducible information page and projects to allow students to apply what they have learned. Elements of design presented include: (1) unity; (2) repetition; (3) variety; (4) movement; (5) balance; (6) emphasis; (7) economy; (8) proportion; (9) color; and (10) space.

    Web Pages on Elements of Design

  • Absence of Ugliness by Rick Altman
  • Cookbook ideas from Ideabook.com
  • DocB's Web Design Clinic
  • Graphic Design Sites from About.com

    • College Videodisc Collection

    Each videodisc can hold up to 54,000 images on one side of a videodisc. Videodiscs come in two formats. The long play format allows 60 minutes of video per side. The short play format holds 30 minutes per side but provides an identification number for each track so that each image can be accessed immediately and directly by a videodisc player. Single images and videoclips then can be mixed on one videodisc. This makes the videodisc a very good and fast tool for storage of a large number of slides and videoclips.

    Software programs such as Hypercard, Toolbook and Hyperstudio can be used to control a videodisc player through the serial port on a computer. This control allows direct access to a single slide or to precisely start and stop a videodisc at any designated point. To my knowledge no one has created a way to control a videodisc player from a web page or to pull images from a videodisc over the Internet automatically.

    Instructional Technology Center videodisc holdings.

    Hunter Library Books and Videotapes

    The digital designer: the graphic artist's guide to the new media / Steven Heller and Daniel Drennan, 1997.

    The photographic vision. Lesson 13, Time and motion [videorecording] / presented by
                         KOCE ; produced by The Coast Community College District in cooperation with Holt,
                         Rinehart and Winston ; producer, Sandra Ostertag ; written by Chris Gallagher and
                         David Hamilton.

    Art and Photography (10 works)

    Graphic Arts (97 works)

    Painting (175 works)

    Computer Art (25 works)


     | Multimedia Home
    Original Pub.1.20.99: Update 2.12.2000.
    Pageauthor Houghton@wcu.edu - Web Office