4.1 Favorite Quote Communication Challenge

Step 1: Read 
Read both of these two passages from the week’s readings.

Communication reading 1: “Priming”

PDF version  
WebCampus version (below)
Communication reading 2: “Understanding Color”

PDF version  
WebCampus version (below)
Summary of both readings: Using aesthetically pleasing attributes such as analogous colors in visual communication improves its effectiveness.

Step 2: Think and Create 
Think about what kind of priming effect you would like your animated gif to encourage.

For example, perhaps you want the audience to feel happier, inspired, peaceful, or amped up. The response you intend to get from your audience will determine the content of your animated quote.

Choose visual elements—these will form the basis of your animated gif.

Two colors: one for the background image, one for the quote

One font. If you’re unsure which font to choose, look at the Typeface Dating Game. You don’t have to play the game, but if you look at this site, it tells you about the characteristics of different fonts, and how they are likely to make a viewer feel.

Quote: Find a quote that makes you feel the way you want your audience to feel. This quote must be of high quality.

Rules for finding a quality quote:

The quote must be from a person who has achieved greatness.
If the quote is from a random Tumblr, who will take it seriously?

The quote must relate to the area in which the person achieved greatness.
No point quoting Katy Perry on quantum physics, or Einstein on feminism.

Avoid using quotes from yourself, your family, or friends.
Even if you find yourself very profound, others probably won’t. If you really want to use a sentiment a friend says, find a quote from a famous person that captures the same meaning.

Verify the quote.
Check (via a google search) whether the quoter is real, is really famous for the thing they seem to be, and really said the quote.

Don’t fake quotes.
You can so easily be found out, and it reflects badly on you.

If you can’t find a quote you like that fits the above specifications, use one of the following:

“The future belongs to those who believe in the beauty of their dreams.” —Eleanor Roosevelt

“I am still learning.” —Michaelangelo

“If you’re always trying to be normal, you’ll never know how amazing you can be.” —Maya Angelou

“There is only one way to avoid criticism: do nothing, say nothing, be nothing.” —Aristotle

“It always seems impossible until it is done.” —Nelson Mandela

“The work you do while you procrastinate is probably the work you should be doing for the rest of your life.” —Jessica Hirsche

“Remember that sometimes not getting what you want is a wonderful stroke of luck.” —Dalai Lama

“Of course it’s a failure. But how good a failure is it?” —Cornel West

“Life is really simple, but we insist on making it complicated.” —Confucius

Photograph: Find a photograph that makes you feel the way you want your audience to feel. This will make the background of your animated gif.

Search on the internet (Google Images, Pinterest, Tumblr, Flickr, 500px or Behance) using the name of the emotion you want your audience to feel.

Save photograph at full size on your hard drive.

Edit photograph to your satisfaction.

Make sure the image will make a good background for text (including making image monochrome, blurring details slightly, reducing contrast, and reducing saturation).

Save edited image at full size on your hard drive.
Storyboarding: Using the provided template  

, sketch your storyboard.
Make sure it has the following elements:

Scene 1: Original state.
This scene contains the way you would design your composition if it was for a still image without animation.

Scenes 2–5: Transition from original photo to height of motion.
These scenes will guide your animation of the transition between scene 1 and scene 6.

Scene 6: Height of motion.
This contains a similar composition to scene 1, with one or two details slightly different.

Scenes 7–10: Transition from height of motion to original state.
These scenes will guide your animation of the transition between scene 6 and scene 1.

Document storyboarding.

Take a photograph of your storyboard sketching.
Make sure that when you take the photograph, it is in good light (a bright room, out of direct sunlight is ideal), and the sketch is the only thing in the image.

Save the photograph at full size on your computer/hard drive.

Edit the photograph of your storyboard sketching.

Open your photograph in Pixlr Editor, and if necessary, adjust its rotation so that it displays the right way up. Crop your photograph, so only the storyboard image is showing. Increase the contrast in the storyboard photo by adjusting the curves slightly.

Save the edited, improved image of your storyboard on your computer/hard drive.
Generate content.

In Pixlr Editor, make a new document 300 pixels high and 300 pixels wide.

Arrange your edited background image and type in the composition you drew on your storyboard for scene 1.

Save this file on your hard drive/computer as a PNG called ‘scene1.png.’

Edit the font in your image to produce the effect you drew in scene 2 of your storyboard.

Save this file on your hard drive/computer as a PNG called ‘scene2.png.’

Repeat this process until you have made all ten scenes from your storyboard.

Assemble animated gif.


Add each of the ten images you just created to the GIFPAL image library.

Add each image to your gif by selecting it from the GIFPAL image library and then clicking on the camera icon.

Set your preferred transition speed from the right hand window.

Click ‘make gif.’

Download gif and save to your computer/hard drive.

Step 3: Write 
Write in a text editor of your choice (for example Microsoft Word, OpenOffice, or Google Documents), one to two sentences (30–100 words) about each photo.

Answer these questions about your storyboard:

What feeling did you hope this image would instill in your audience?
Answer this question about your quote:

What does this quote mean to you?
What font did you use to write out your quote?
What was your reasoning for adding your particular type animation to this image?
Assess your work, and answer these questions about your animated gif:

How effective was your animated gif at demonstrating color and priming?
What are you happy with about your animated gif?
What would you have done differently if you had more time/skills?
Save this text document on your computer/hard drive.

Step 4: Prepare 
Prepare your storyboard image for uploading to WebCampus.

Optimize your storyboard image for correct display on your journal (max width/height: 800 pixels; filetype:png).

Save the optimized image on your computer/hard drive.

There is no need to prepare your animated gif for WebCampus, as the animated gif format is already web-friendly.

Step 5: Submit 
Create a new post in your blog. Name it ‘Favorite Quote Communication Challenge.’

Add your optimized storyboard image to your post.

Add your animated gif to your post.

Copy and paste your writing from the text editor to your blog.

Save your blog post.