Shape

For this week's "shape" assignment, I created a graphic that I plan to use as a section header in my website tutorial on prepositions. (Reminder: I'm introducing Spanish prepositions to high school students in their first year of Spanish studies.) For the last several years, I've noticed that my students have pretty good recall of something that I assume they are learning in elementary school: "A preposition is anywhere a mouse can go." When I teach prepositions in the classroom setting, this "definition" invariably comes up when I ask students to explain prepositions to me. I think it's a decent definition, but only if students understand that the mouse's location needs to be described in relation to something else.  (For example, a mouse can go to Alaska, but Alaska is not a preposition.)

With this in mind, I used Fireworks to create this visual, hoping to stimulate students' prior knowledge, and then use the image and concept as a point of discussion. After viewing this image in the "Introduction to Prepositions" part of my tutorial, students will be asked to narrate the path of the mouse. ("The mouse goes up the P, over the top of the P, across the r and e", etc.) In doing so, students will use a number of prepositions in context, reinforcing their function and their more "complete" definition.

Shape figured heavily in the creation of this image. Initially, I knew I wanted a wide and short display shape, so as to use the image to head a section on my website. In this way, the rectangle shape will contain information and focus attention towards the content of the text that will follow (Lohr, 2008, p. 252). I did struggle a little while trying to make this image the appropriate size and shape, while also maintaining legibility of all the text. I think with a million more hours of work, I could probably fine-tune the kerning of the word "Prepositions" a little more so as to save space, bumping up the text size for all the little words... but I'm pretty satisfied with how it turned out. I am still a novice when it comes to Fireworks, and this little picture turned out to be a big undertaking!

The mouse silhouette was an important shape to find and include, since it references the metaphor for my students, and also makes the image more engaging (Lohr, 2008, p. 250). I was lucky to finally find a suitable mouse image in the Creative Commons: http://commons.wikimedia.org/wiki/File:Silhouette_of_a_mouse.jpg

And, of course, line is an important shape element in this image. I created a path through the word "Prepositions" and then aligned the smaller text to this path, showing motion and direction (Lohr, 2008, p. 250).

When I asked my husband to give his feedback (as a "user test"), he made the following remarks: This image is good for demonstrating what a preposition is, and it also provides quite a few clear examples. It's easy to focus on one of the two "depths" in the image (either the black or the blue). He is also a Spanish teacher, and he said he'd like a version in Spanish for his classroom. He also thinks it would be good for primary teachers (in English, or whatever the language of instruction may be).

Based on the user test, I don't plan to make any changes at this point. As I said before, I'd like to have the image sized a little differently (not quite so wide and short), but I've done what I can with my time (and sanity!) at this point.

One thing I've struggled with in Fireworks is how to best export images and not lose resolution. It seems that no matter what I do (jpeg, png, 100%, etc.), nothing looks as good as it did in the original Fireworks file (when open in Fireworks). I included two different exports in this week's post hoping to see what they look like side-by-side. I think that in this case, the first image (the gif) looks a little better. Does anyone have advice?  Thank you in advance for your comments.

Lohr, L.L. (2008). Creating graphics for learning and performance: Lessons in visual literacy (2nd ed.). Upper Saddle River, NJ: Pearson.