Posted in 1.1 Creating, 1.2 Using, 3.1 Creating, 3.2 Using, AECT Standard 1 (Content Knowledge), AECT Standard 3 (Learning Environments)

Selection Principle: Emphasizing Figure and Ground

The main idea behind this weeks EDTECH506 graphic is using emphasis to draw out meaning. The terms used in the chapter are figure for the thing that you want to emphasize and ground for what is in the background. The readings for the week showed different examples of calling attention to content using many basic design principles such as manipulating positive and negative space. As I browsed through the examples, I got a better understanding of applying these principles to creating instructional materials. For my project this week, I chose to create a poster for the classroom showing the Google Slides toolbar.

rainville_wk8-01.png

The instructional purpose is to provide students this toolbar cheat sheet for quick reference. I tried to make the toolbar and labels pop out of the page by subduing the background image. I feel like this worked ok but after showing it to my test team (my family) I felt that there wasn’t enough “pop.” I solved this problem by adding some drop shadows which I feel does a good job of separating the foreground and background.

rainville_wk8-2

Posted in 1.1 Creating, 1.2 Using, 2.1 Creating, 3.1 Creating, AECT Standard 1 (Content Knowledge), AECT Standard 2 (Content Pedagogy), AECT Standard 3 (Learning Environments)

Using Shapes in Instruction

This week we are tasked with creating instructional materials focusing on the use of shapes. Here is my project:

shapes

The students using this “at a glance” guide are high school technology students. They have already learned about Google Drive, Docs, and Sheets and are familiar with the Google layout. This handout is meant to provide a quick snapshot of the concept of Themes and Masters. Many students have used Google Slides often but do not know about Master pages and the ones who do know, don’t seem to take advantage of the tool. I feel this handout (poster?) provides a quick reminder.

The use of shapes in this handout is throughout the document. The header uses simple shapes to define a heading and title area. These shapes provide for a clean look (Lohr, 2008, p. 250) and tie together with the overall theme of the unit. The arrows bring attention to the main point of each image. I chose the overall display shape based on how many points I wanted to make. (Lohr, 2008, p. 255) In this case, I kept it simple with 4 squares as I didn’t want it to get too busy and move away from an “at a glance” tool.

The person I had test my design gave feedback on the graphic aspect vs the instructional one. Based on this person’s feedback, I can see areas where the spacing could be tightened up, for example between the header and first squares as well as the very bottom of the page. It was also suggested to add a footer similar to the header, I agree that would be a nice touch.

Reference
Lohr, L. (2008). Creating graphics for learning and performance: Lessons in visual literacy(2nd ed.). Upper Saddle River, N.J: Pearson/Merrill/Prentice Hall.

Posted in 1.1 Creating, 1.2 Using, 1.3 Assessing/Evaluating, 3.1 Creating, AECT Standard 1 (Content Knowledge), AECT Standard 3 (Learning Environments)

Typography

Oh how I do so love Typography. I would consider myself a bit of a type snob. I notice subtleties of type that most do not. Things like kerning, leading, and tracking are all big blaring overlooked settings IMO. In fact, if you’re into it like I am, check out this kerning game, I can spend hours kerning mindlessly.

For this assignment, we are tasked with creating typographic images to represent lessons/objectives of a unit of instruction. For my unit, I will be creating materials for lessons on Google Slides. I chose to go with a typogram theme and tried to create literal examples of the type.

rainville-week4-01

The first image is to represent “Presentation“. The main objective of this lesson is to review the big picture rules of creating a presentation. I chose to use the words to outline the shape and the Google Slides “GS” as the content. For the second image, the lesson is about adding and manipulating shapes to your presentation. Therefore the words “Using Shapes” are displayed using shapes. The third lesson focuses on formatting text and images. For this image, I’ve used words to express formatting text and I created a “picture” to indicated formatting an image. For the fourth lesson on collaboration, I have created the outline of a document using the word “collaborate” and added bits of input being added from various directions.

All of the images, since they will be used for the same unit, have commonalities to tie them together, most notably they use the same typeface (Lohr, 2008, p.215). The typeface itself,  Fingerling Tall would be considered a decorative typeface which makes it best for titles and headings. A paragraph with this typeface would be difficult to read (Lohr, 2008, p.224). I feel it works well here because it is boxy enough to create the shapes I needed as well as being readable enough to use for the art itself.

My very simple test consisted of showing the images to my two teenage daughters and my husband. Their opinions are likely biased but they all seemed to understand the overall message. Of course, the act of showing my stuff makes me see the flaws, there are some funky things happening in the last shape, the word collaboration is bent in weird spots.

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

Posted in 1.1 Creating, 1.3 Assessing/Evaluating, 3.1 Creating, Uncategorized

Creating a Quiz App in GameSalad

This project was about using GameSalad’s table functions to create a quiz app. There was A LOT of prep content to cover which made it a bit overwhelming. Thankfully things are at a simple logic level as my non-programmer brain tends to fry a bit after “does it match or not”. I was able to use a simple table loaded with quiz questions to populate actors in a scene dynamically. After that, the tutorials guided me through the process of creating a drag and drop question. At this point, I got stuck with what appears to be a bug (although human error isn’t out of the question) where I had 3 tests in a rule that all needed to be true in order for the continue button to show. I could NOT get it to work and spent WAY too much time trying since it should have been very simple. I combed the “code” for errors, repeatedly. I created display blocks to show my variable values (variables are “attributes” in GameSalad) and everything worked but the dang button! Grrrr. For the drag and drop question, you automatically get points, even if your wrong. Hmph.

screenshot-1

The graphics in this game are simple and a bit silly. While I would use something similar to this to test my HTML students, I’m not sure this would be my exact approach or tool.

Posted in 1.1 Creating, 3.1 Creating

Game Design Reflection

This week, we were tasked with exploring Actors, Scenes, and Collisions using GameSalad. We were provided with a step by step tutorial that was very helpful in guiding through the process. I found that my knowledge of other game-making software had me looking for functionality that may not exist. I ended up hitting the help files looking for ways to do tasks that should be very simple, like making an actor solid so that it bumps into things. Perhaps it’s simple, but so far finding the answer isn’t. All in all, I made it work. Check out the game here!

storyscreenshot

For my characters, I used the ToonDoo site which was AWE-SOME! It required some post-creating image processing but I’m a whiz in Photoshop so I didn’t mine 1 bit! It’s a very cool resource I will be definitly using again.

Posted in 1.1 Creating, 1.2 Using, 2.1 Creating, 3.1 Creating, 3.2 Using, 3.5 Ethics

WebQuest: Logos

This WebQuest follows the model developed by Bernie Dodge and Tom March. It is used to explore the design process in developing logos. The quest guides students through gathering information, brainstorming, refining, and delivery.

For the HTML portion of the program, I opted to use a home-grown template. I had issues with some of the other pages I made from pre-made templates. When working with a template, there is a lot of time spent getting familiar with the code and how it works. Sometimes it takes you a while to figure out the template isn’t going to work for what you wanted it for. So to spare myself all that time and energy, I wrote the code myself. I am happy with the results. The site is flexible, has responsive elements, and looks good.

Take a look…

Posted in 1.1 Creating, 1.2 Using, 2.1 Creating, 3.1 Creating, 3.2 Using, 3.5 Ethics

Tour the SHS Wood Shop

This EDTECH 502 assignment expanded on the HTML/CSS skills learned so far in the course. The main requirement is to be a multi-paged website that uses consistent navigation and styles. I chose to use Bootstrap again, like I did last week with the Wood Types M-Learning Activity. This week though I did run into coding issues with the templates. When working with templates, this is a common problem to come across. I opted early on to make a fresh start which corrected the problem but I still wasted a lot of time troubleshooting. I overcame the coding issues and was able to focus o the virtual field trip around the wood shop. Going in the order the students are introduced to the machinery, the virtual field trip visits most machines in the shop. There is plenty of room for growth down the road when I want to add machines.

Check it out…