Storytelling with Visuals

Other Chapters

Using Multimedia

Any good online news story features some form of visual multimedia to make the article more memorable and to enhance the reader's understanding. Studies show that prospective students are more likely to remember your college if they're presented with photos and videos. Including multimedia in your feature story is vital in gaining the attention of prospective students, and they'll be more likely to apply if they can see for themselves what life is like on campus.

Thanks to smartphones, you have the power to easily create and curate multimedia. Whether you're on iPhone, Android, or any other type of phone, you can easily take photos, record videos, and capture audio to add to your feature story.

Strengths and Weaknesses

Keep in mind that just because you can add multimedia doesn't always mean that you should. Each type of multimedia has certain strengths and weaknesses when it comes to storytelling and how it helps prospective students understand your topic.

Text

It's not really a news story unless there's text, is it? Text should always be included in any feature story, but may not always be the main way to communicate. Text is useful for topics that require a lot of context and explanation. For example, if your college is constructing a new gymnasium on campus, context should be provided on when it will be built, how much it will cost, why a new one is being built, what students can expect, and more. Text is the best way to communicate the who, what, where, why, and how of a story.

As a media format, text is also helpful in describing statistics or numerically-based information, such as speaking of workforce percentages or predicted incomes of graduates from certain majors and minors. Of course, text is also the best way to include quotes from students, faculty, staff, and other college stakeholders.

What text is poor at communicating, however, is action and emotion. While it's possible to do both, actions are better captured with videos, and emotions are better conveyed with imagery.

Photos

Every good online feature story should include at least one photo, but they're

not always necessary. Prospective students will not only want to read about

your college, but they'll want to see what the campus green, classrooms,

sports facilities, student body, faculty, and more all look like. Would you apply

to a college if you couldn't even see it?

As previously mentioned, photos are also better at communicating emotions

better than text. Take the photo in Figure 1 for example. Not only will

prospective students get to see a picture of an adorable puppy, but they'll

see how happy current students are to attend Campus Puppy Day based on

their facial expressions. Readers will remember the event better and associate

positive emotions with your college.

Photos are good at communicating a large amount of information in a short

space. Instead of writing out a long description of your school's new

amphitheater, for example, a photo will display what readers want to know in much less time and space.

When covering an event featuring students, make sure you always ask for permission before taking photos and using them in your feature story!

Videos

Videos share many of the same strengths in

storytelling as photos, such as expressing emotion

and large amounts of information quickly. What

videos excel in, however, is showing actions.

Take Figure 2 for example. Say your school's

Basketball Club held a 1v1 tournament for charity,

and the last game had a dramatic finish. Would it

make more sense to write out how the player

checked the ball, dribbled for a bit, took a step-back

three-pointer, sunk the game-winner, and ran off in

victory? Or would it be better to have a video of the

dramatic finish so prospective students can see for themselves? Consider these questions when writing feature stories on programs and courses that involve a lot of action such as dance, theatre, sports medicine, and more.

Audio

As a work-study, it's not often that you'll be tasked with recording audio, but that doesn't mean you shouldn't know how to. Much like photos and videos, audio is an excellent way to communicate emotion. Instead of facial expressions, however, the listener engages in meaning-making through the tone of the speaker's voice. If you're trying to promote your school's new biology lab, for example, it might be a good idea for prospective students to hear how excited current students are about the improvements instead of just reading about it.

Audio is also helpful in establishing credibility. While quotes from faculty and experts are great sources of authority, sometimes it's better to hear their expertise straight from the mouth.

Graphics

Much like photos, graphics are a good way to display a lot of information in a small amount of space. Similar to text, graphics specialize in illustrating numerical data such as statistics. If you're working with a large dataset, however, consider including a pie chart, bar graph, or another simple figure to communicate measurable information.

Unfortunately, graphics take a good amount of time and skill to produce. If you're unable to create one but would like to include one in your story, consider reaching out to your supervisor, coworkers, art faculty, or even graphic design students for assistance.

Creating Multimedia

In digital today's age, you're able to record and edit all types of multimedia from the convenience of your smartphone. While the specifics differ from phone to phone and software to software, we'll take a brief look into the basics of recording and editing non-text multimedia.

Recording Techniques

Whether you're taking a photo or recording a video, a lot of the same principles apply when it comes to how you frame your shots.

Types of Shots

For basic photos and videos, there are four types of shots that you should know:

Establishing shot: Used to capture as much of a landscape or environment as possible to provide the viewer with setting and context.
Wide shot: Used to show the entirety of a subject from head to toe.
Medium shot: Used to display an equal amount of the environment and the subject.
Close-up: Used to fill up most of the frame with the subject.

Scroll through the slideshow below (Figure 3) for examples of each shot.

Figure 1

Students got to hang out with Oscar the Corgi at HEPR's annual Campus Puppy Day.

Establishing Shot

Used to capture as much of a landscape or environment as possible to provide the viewer with setting and context.

Wide Shot

Used to show the entirety of a subject from head to toe.

Closeup

Used to fill up most of the frame with the subject.

Establishing Shot

Used to capture as much of a landscape or environment as possible to provide the viewer with setting and context.

1/4

Figure 3

Use of Space

When taking photos or videos of people, it's important to capture them in a way that feels natural. Be sure to give the person a decent amount of headroom, which is empty space above their head in the frame. Headroom is a type of negative space, which is the area of a shot not being occupied by the main subject. For interviews, it's important to give the subject a good amount of negative space in front of them, but not behind them.

One of the most basic rules of photography and videography, the rule of thirds breaks up your shot using two horizontal lines and two vertical lines (seen in Figure 4). This divides the shot into three columns and three rows that each take up a third of the frame. Interesting and important pieces of your shot should line up at the intersection of these lines or on the lines themselves. For example, when interviewing a student or faculty member, their eyes should line up with the top horizontal line. This keeps the shot balanced and draws the viewer to the most important part of the image.

Figure 4

In the photo above, notice how the players are near or directly on the vertical line to the left. The rule of thirds also gives the players, the court, and the basket their own columns within the frame, highlighting their importance to the shot.

Capturing Audio

Recording voices on your phone is rather easy as most come with a recorder app, and recording video automatically records audio as well. For the best results when recording audio alone, place your phone (or if you have one, an external microphone) down so that it faces the speaker. Be sure not to move your recording device or to touch it while someone is speaking.

The biggest issue you'll face while capturing audio is the background noise. Sometimes, background noise such as crowd chatter can be helpful for establishing a setting. For example, if you're writing a feature story on your college's networking event, the many voices in the background will communicate the many opportunities that prospective students can look forward to. Other times, however, noise such as wind does nothing but make it difficult to hear the speaker. If conducting an audio interview, try to find an indoor location that's as quiet as possible.

Editing Techniques

While it certainly looks nice, your photos and videos don't need to be professional productions. To get the best of what you have, though, there are a few techniques you should know how to do:

Cropping: Cropping is the process of changing the dimensions of your shot, cutting off part of the frame to better fit into the space provided for your article or removing an unwanted part of the shot.
Color Correcting: Color correction involves adjusting the white balance, brightness, contrast, saturation, and more to draw attention to certain colors or to alter the image's mood.
Sequencing: In video and sound editing, sequencing is the process of placing your recorded clips in the order that you want. Videos are unique in that they feature moving clips, images, and audio that can all be placed on top of each other.
B-roll: An important part of creating a video, B-roll are clips that help tell the story through visuals. These clips can be placed above audio narration.
Captioning: To account for accessibility, photos and videos should be accompanied by text captions that describe what is happening in the shot. Photo captions should not be placed on the photo with graphics but below the photo in a textbox to allow screen readers to access them. Video captions should be placed at the bottom of the video and list out every spoken word in a clear, readable manner.

How you go about using these techniques to edit your multimedia depends on which software you have access to. Both iPhones and Androids allow for cropping and color correction within their preinstalled photo applications. Iphone users automatically have access to iMovie which provides users the ability to conduct all of the basic editing techniques. Androids don't come with a video editor that allows for sufficient sequencing, so we recommend VivaVideo.

While this guide emphasizes working mostly on smartphones, desktop software provides much more in-depth editing options. Sometimes, colleges and universities can provide you with access to these programs. Ask your supervisor if your institution can provide you access to advanced software. A list of recommended editing software and links to in-depth guides is provided below:

Photo Editing:

Audio Editing:

Audacity

Video Editing:

Adobe Premiere Pro
iMovie (iOS)
VivaVideo (Android)

Graphics Creation:

Canva

Rules of Thumb

For both photos and videos, you want to make sure that your picture is high resolution. Blurry photos and videos are not enjoyable to watch!
Videos should always be recorded horizontally.
Take as many photos and videos as you can! You never know what you might use.
Always ask for permission before photographing or recording someone.

Things to Avoid

Try not to use any transitions in your videos besides dissolves. Cross dissolves are good for beginning/ending a video or to show a change in time/location. Avoid "cheesy" transitions such as flips, 3D effects, or shapes at all costs.
Don't include a poor photo/video. No multimedia is better than bad multimedia.
A photograph should be the main visual at the top of the story. Graphics such as logos are okay to use, but they should be featured further along in the story.
Avoid using photos with graphics placed on top of them. They're not very accessible, and they can be difficult to describe to meet web standards.

Article Layout

Now that you know what visual elements should be included in your feature story, let's dive into placing these elements on a webpage. Believe it or not, where you place your text, photos, and videos has profound effects on how your readers understand your story.

Prospective students, like many online users, are known to be scanners. As an author of online feature stories, you should be able to write for scannability, which is the idea that users don't read entire webpages but rather quickly scan and skip around for the information they're looking for. The best ways to write for scannability are by using the inverted pyramid method, breaking up chunks of text, and having the mindful placement of your multimedia.

The Inverted Pyramid

A classic method of journalism, the inverted pyramid structure is the method of laying out the most important information at the very beginning of the story and providing supporting details such as quotes and context further along on the webpage. The lead, which is the opening paragraph of a story, should include the answers to the who, what, where, why, and how of your feature story. Important keywords, such as the program, notable people, location, and others should be mentioned here if not included in the headline. The body should contain all the supporting details of your story that provides context. This should be the largest part of the article. The tail comes at the very end and should give the reader information that's nice to know but isn't necessary. Calls to action, such as directly asking prospective students to view the tuition webpage, can go here as well.

Figure 5

Breaking Up Text

Long, seemingly endless paragraphs are a surefire way to lose the reader's attention. Could you imagine what this webpage would look like if it didn't have all these headers, subheaders, and bullet points? This webpage uses a technique called chunking, which is the breaking up of the text into small consumable sections, or "chunks." Chunks should be able to stand on their own and can range from one to several paragraphs. The following list appropriately lays out the best ways to use chunking in your story:

Only talk about one or two main ideas per paragraph.
Keep your paragraphs short, around four sentences at most.
Headings and subheadings can break up your story into sections and should include keywords that summarize the main ideas of the following paragraphs.
Make your headers, subheaders, and important information bold.
Bullet points make listed information easy to find.
Numbered lists quickly and clearly communicate instructions or rankings.
Indent quotes longer than three lines.
Spread out your multimedia and try to match photos/videos to headers.
Use hyperlinks to link to other webpages for more information.
Use anchor links to send the user to different chunks/sections.

Breaking up text is an important characteristic that differentiates online stories from print stories. Through hyperlinks and anchor links, users can enter, exit, and jump around any part of a story to find answers to their questions as quickly as possible.

Placement of Multimedia

So you've taken your photos, exported your videos, and built your graphics. Where do you put them? If you really want to tell a good story, you need to put your multimedia at appropriate parts of the narrative and provide them with context. Essentially, try to avoid randomly placing multimedia in spots that don't need it.

So when is multimedia needed? Consider the strengths and weaknesses of each medium. Take the 1v1 basketball tournament for example. If the main topic of the story is that the event was for charity, the lead should detail who ran the event, who won the event, and which charity they donated to. The lead should be accompanied by a photo that illustrates these things, such as a photo of the winner holding a basketball in one hand and the check for charity in the other. How they won the tournament is less important and can be featured further into the story. After stating that the tournament had a dramatic finish, the video can be included at the end to show the game-winner in action instead of describing it.

There's one problem with this rule. It's the best practice and industry standard to place a photo at the beginning of the story. Keeping the inverted pyramid in mind, you should make sure that you have a photo that displays the main idea of the story.

Formatting

Okay, so you've made your visual elements and you know where to put them. You're now ready to build your article right?

Nope!

While you won't need advanced coding techniques, you'll have to know how to get everything to show up on the webpage. This is done using your institution's content management system, HTML, and style guides.

Content Management Systems

A content management system (CMS) is a program that lets you create, edit, publish, store, and organize content on your website. Content can include news stories, webpages, multimedia, and any other files used on the website.

We'll cover the basics, but check out the following list for guides to CMS applications most commonly used by colleges and universities:

As a work-study, you'll be an editor within your CMS. This allows you to login, upload your multimedia, write your story, then publish the article.

WYSIWYG and HTML

When making your story, you'll place all your content within a WYSIWYG (what you see is what you get) element. The WYSIWYG will include buttons that let you format the article, as seen in Figure 6.

Each button formats your text without having to know Hypertext Markup Language (HTML). Although you don't have to know HTML, the basic tags are helpful to know.

Bold: Makes your text thicker.

HTML: <b></b> or <strong></strong>

Italicize: Makes your text slant right.

HTML: <i></i> or <em></em>

Underline: Adds a line below your text.

HTML: <u></u>

Hyperlink: Highlights text to link to another webpage.

HTML: <a href=" "></a>

Break link: Removes hyperlink from linked text.

Anchor link: Links to section on current webpage.

HTML: <a id="example"></a>

Formats dropdown menu: Choose style and size of your font.

Note: This is not recommended.

Paragraph dropdown menu: Choose between paragraph <p></p>, header 1 <h1><h1>, and header 2 <h2></h2> formatting.

Clear formatting: Removes any effects on text and clears HTML tags in the source code.

Photo: Add a photo to the text.

HTML: Depends on CMS.

Insert dropdown menu: Choose between other multimedia such as videos and audio.

Bulleted list: Creates unordered list.

HTML: <ul><li><li><li></ul>

Numbered list: Creates ordered list.

HTML: <ol><li><li><li></ol>

Table: Creates a chart with rectangle cells. HTML varies depending on number of columns and rows.

Figure 6

The Environmental and Sustainability Club, one of HEPR's many student organizations, recently organized a thorough cleaning of HEPR Park to improve the environmental health of the local community.

Before the Environmental Club cleaned up HEPR Park, litter and garbage were the only ones sitting in its benches.

Align left: Pushes text to the left side of webpage.

HTML: <p style="text-align: left;">

Align center: Text pushed to horizontal center of webpage.

HTML: <p style="text-align: center;">

Indent left: Nudges text partially left

HTML: <p style="padding-left: __px;"> where __ is a number

Indent right: Nudges text partially right.

HTML: <p style="padding-right: __px;"> where __ is a number

Align right: Pushes text to the left side of webpage.

HTML: <p style="text-align: right;">

Undo: Removes most recent change to text.

Redo: Returns most recent change to text.

Source code: Brings up a textbox that shows the HTML markup of current document.

Almost every CMS will include these buttons, letting you decide how you want the text of your article to look. Using these tags is also helpful in optimizing your article for search engines and meeting accessibility standards.

Style Guides

Your CMS does most of the heavy lifting in making your article match the design of your school's website. Some things are left to you, the editor, and require mindful attention when creating your article. To keep your feature story consistent with all other stories, be sure to follow your institution's style guide. A style guide is a document (online or printed) that dictates the standards for the writing and formatting of online articles and webpages.

A style guide covers editorial concerns such as grammar, punctuation, capitalization, and tone. It also determines design issues such as fonts, colors, use of visuals, and text formatting. While your CMS takes care of most of the design elements, you should follow your school's style guide as closely as possible.

If your school doesn't have a style guide, it's highly recommended that you follow the Associated Press Stylebook, as it is the standard of the public relations industry.

Summary

Visuals go beyond just pictures and videos. Everything visible in your article, from bolded headers to indented videos, have an impact on how prospective students will understand your story. With a smartphone in your pocket, you have the ability to create multimedia content quickly and on the go, but you should only do so if the content will help you tell your story better. Where you put each storytelling element and how you place it is just as important as the content itself. No matter how you tell your story, it should be told in a way that can be easily scanned by prospective students.

Now that you've learned tell stories with visuals, read on to learn more about how to report your topic, engage prospective students, and attribute borrowed content.

References and Further Reading

Bradley, P. (2021, January 12). Which content management systems do US universities use? Medium. https://uxdesign.cc/which-content-management-systems-do-us-universities-use-53430cf0f72b.

CPIR. (2014, September 26). Writing for the web: Chunking your content. Center for Parent Information & Resources. https://www.parentcenterhub.org/web-chunking/.

Kolodzy, J. (2012). Practicing convergence journalism: An introduction to cross-media storytelling. Taylor & Francis. https://doi.org/10.4324/9780203097434

Laferte, S. (2020, July 1). Brand style guide writing advice. Content Marketing Institute. https://contentmarketinginstitute.com/2020/07/how-to-brand-style-guide/.

Figure 2

WATCH: Senior Mechanical Engineering major, Nick N. Roll '21, wins the Basketball Club 1v1 Charity Tournament.