otherwise noted in bold at the bottom of each notes page...

36
Rationale: Welcome to "Document Design and Presentation." This presentation is designed to build on previous presentations in the INDOT series that help ESL writers design effective technical documents. The slides presented will aid the facilitator in an interactive presentation of the elements of clear document design and presentation. These slides are ideal for engineers or those who must produce very technical documents. This presentation may be supplemented with the following OWL resources: - "Color Theory" presentation: http://owl.english.purdue.edu/owl/resource/715/01/ - "Designing an Effective PowerPoint Presentation": http://owl.english.purdue.edu/owl/resource/686/01/ - "HATS: A Design Procedure for Routine Business Documents": http://owl.english.purdue.edu/owl/resource/632/01/ - "Using Fonts with Purpose": http://owl.english.purdue.edu/owl/resource/705/01/ - "Visual Rhetoric": http://owl.english.purdue.edu/owl/resource/691/01/ - "Visual Rhetoric" slide presentation: http://owl.english.purdue.edu/owl/resource/729/01/ - "Visual Rhetoric: Analyzing Visual Documents": http://owl.english.purdue.edu/owl/resource/725/01/ Directions: Animation and slides are activated by a single mouse click, unless 1

Transcript of otherwise noted in bold at the bottom of each notes page...

Page 1: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Rationale: Welcome to "Document Design and Presentation." This presentation is designed to build on previous presentations in the INDOT series that help ESL writers design effective technical documents. The slides presented will aid the facilitator in an interactive presentation of the elements of clear document design and presentation. These slides are ideal for engineers or those who must produce very technical documents.This presentation may be supplemented with the following OWL resources:

- "Color Theory" presentation: http://owl.english.purdue.edu/owl/resource/715/01/- "Designing an Effective PowerPoint Presentation": http://owl.english.purdue.edu/owl/resource/686/01/- "HATS: A Design Procedure for Routine Business Documents": http://owl.english.purdue.edu/owl/resource/632/01/- "Using Fonts with Purpose": http://owl.english.purdue.edu/owl/resource/705/01/- "Visual Rhetoric": http://owl.english.purdue.edu/owl/resource/691/01/- "Visual Rhetoric" slide presentation: http://owl.english.purdue.edu/owl/resource/729/01/- "Visual Rhetoric: Analyzing Visual Documents": http://owl.english.purdue.edu/owl/resource/725/01/

Directions: Animation and slides are activated by a single mouse click, unless

1

Page 2: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

otherwise noted in bold at the bottom of each notes page

Writer and Designer: Allen BrizeeContributors: Dr. David BlakesleyRevising Author: Dr. David Blakesley; Arielle McKee, 2014Developed with resources courtesy of the Purdue University Writing Lab

© Copyright Purdue University, 2000, 2006, 2008

1

Page 3: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Effective technical communication integrates textual and visual elements:

Topics:•Document format and layout: Communicates document genre - a report, a letter, etc.•Document headings: Helps aid document navigation and introduce and describe ideas in document sections •Information graphics: Communicates technical information visually, ex. line graphs, bar graphs, pie charts, tables, flowcharts, diagrams, maps, etc.

Writers use visual content, such as photographs, illustrations, charts, graphs, and design elements, to inform and persuade readers, as well as to add visual interest to their documents. The emergence of new software and hardware technologies has enabled writers - not just graphic designers and programmers - to incorporate visual content into their work to help them achieve these important rhetorical goals. Writers are now called upon to communicate with wider audiences in contexts beyond the walls of the classroom - on the Web, in student-produced magazines and ezines, and in service learning projects, for example - and to develop critical literacy themselves as readers in a visual culture. The occasions for producing visually rich documents have multiplied.

The visual content you present in a document and the way you present it matter. Visual content plays two roles: (1) it presents information and arguments itself, and (2) it includes design elements that convey relationships between images and surrounding text. This presentation discusses five ways in which visuals inform and persuade (the first three are shown above): document format and layout, document headings, information graphics, typography, and presentation - poster presentations to be specific (both on the next slide).

Click mouse to advance slide.

2

Page 4: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Effective technical communication integrates textual and visual elements:

Topics, cont.:•Typography: Fonts, typefaces, and point size help enhance readability•Research posters: Good posters catch reader's attention and make key information understandable

Any arrangement of words, images, color, data, graphs, and charts presents information and makes appeals to readers. For example, consider a personal ad placed with an online matchmaking service. Personal ads typically contain verbal content about a person's personality, hobbies, interests, and so on, as well as a photograph. This is informative content. It is also persuasive content because it makes an appeal for action: "Contact me to see if we are compatible." In an academic or professional context, verbal and visual information work together to convey data - test results or action plans for purchasing a new Internet server - but the verbal and visual also work together to make appeals: "My research team and the work we have done is credible. You can trust our test findings and take action based on the results." Or in a professional context, your appeal might say this: "I've taken some time to look at the different servers we can choose from, and I understand our needs. Based on this work, you can trust my conclusions, and I think we should purchase X server."

Since we now have the capability to present information and persuade using text and visuals together in word processing programs, slide presentations, and dynamic posters, we must be able to wield textual and visual messages effectively.

Click mouse to advance slide.

3

Page 5: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Format and layout choices communicate information about the document's genre

•Different genres have different purposes and different reader expectations•Your format and layout choices begin communicating this message

Compare the following documents and think about how the format and layout affects the message being sent.

Visual content serves different functions. The format and layout of a document conveys a number of messages, such as genre (memo, report, academic essay, slide presentation, etc.) and professionalism (if the document looks sloppy, it may impact the credibility of the information contained within). Design and layout elements, therefore, are very important:

Functions - Direct the reader's eye to the most important information, express hierarchies of value and categories across information, convey tone and mood (professionalism, artistry, playfulness), express form as visual content (patterns, lines, etc.), add aesthetic appeal.

In order to master and produce these design and layout element functions, it will help to take the following steps:

Production Learn design conventions in the particular discipline, as described in style guides, study examples of effective design, use the layout and style features of a word-processing or desktop publishing program.

Click mouse to advance slide.

4

Page 6: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

*—mi: ■

Using Visuals to Inform & Persuade: Format & Layout

Sample 1

What kind of document is this?

Why do you think the author wrote this document?

What kind of information is communicated in a document like this?

How do you think format and layout affects a reader's Expectations and needs?

As stated above, basic format and layout elements send messages as clearly as the text contained within the document itself. This document, by its format and layout, tells readers that it is probably some kind of technical report rather than a memo or an informal email between friends.

Click mouse to advance slide.

5

Page 7: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Sample 2

What kind of document is this?

Why do you think the author wrote this document?

What kind of information is communicated in a document like this?

How do you think format and layout affects a reader's Expectations and needs?

This document, however, tells the audience - even before they begin reading the text - that this is some sort of letter produced by someone at Purdue University.The block format and the letterhead, even if we can't read the text, convey important messages about genre. These visual elements contribute to - or if they're done poorly, detract from - the message's credibility. Specifically, this document is a letter of recommendation. These letters can be very important because they can affect a person's chances of getting into a university program or even getting a job. Therefore, every aspect of this document must be professional and send the intended messages. The letter is informative, but it is also making an appeal. The letter conveys information about the person being recommended, but it is making some important arguments, not all of which are limited to the textual content: "You can trust me when I say this person will do well in your program because I'm from a reputable university."

If the letter of recommendation LOOKED like an informal email, the document's credibility would be in jeopardy even before the audience began reading the text.

Click mouse to advance slide.

6

Page 8: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Headings

Headings help document navigation and introduce and describe the ideas contained in eac section.

• Headings should work with the table of contents to help readers find information quickly and easily

• Headings should be descriptive

Headings are very important navigation features of long documents. They should work with the table of contents to help readers find information they need quickly and easily. Therefore, the way headings look is important.

Click mouse to advance slide.

7

Page 9: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Headings

Effective Descriptive A - and B-Level HeadingsDomestic and Foreign Economics of Open Source Software

Ineffective Generic HeadingsEconomics of Open Source Software

Open Source Software Is Economically Beneficial

Open Source Software Benefits Programmers in Several Ways

Open Source Software Benefits Big Business

Economics

Benefits

Effects

Open Source Software on the Domestic Front

Open Source Software Competes Effectively with Proprietary Software

Microsoft Responds to Open Source Software Usage

Government Uses Open Source Software to Save Money

Open Source Software on the Domestic Front

Competition

Microsoft

Government Use

From The Thomson Handbook by David Blakesley and Jeffrey Hoogeveen. Boston: Cengage/Wadsworth, 2008.

Headings should reflect the importance of the information contained within the section. For example, an A-level heading, the heading for a major section, might be all capped, LIKE THIS. The B-level heading, the heading for a sub-section within the major section, might only have the first letter of each word capitalized, Like This. Different citation styles, like MLA and especially APA, have different requirements, so it's important to follow these closely.

Click mouse to advance slide.

8

Page 10: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Information graphics work with text to communicate technical information

Visual content correlates to serves different functions

the text but

Visual content can be used as information in a variety of situations that you're likely to come across as you create documents for your courses and your professional tasks. These documents include websites, magazines, photographic essays, and multimedia presentations. In any of these situations, be sure that the visual content pulls its weight; it should add and clarify information and not be used purely for decorative purposes.

Click mouse to advance slide.

9

Page 11: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Information Graphics

V is u a l C o n te n t S e r v e s D if f e r e n t F u n c t io n sV is u a l F o r m F u n c t i o n s P r o d u c t i o n

P H O T O G R A P H S a C o n v e y In fo rm a tio n a n d c o n te n t a M ay (lik e illu s tr a tio n s ) b e t o u c h ­

s to n e s l o r a n a ly s is In t h e t e x t a H e lp y o u r r e a d e r s e e w h a t y o u

■ A llo w y c u t o f o c u s o n d is c u s s in g th e m e a n in g a n d s ig n ifican ce o f a p h o to * g r a p h 's c o n te n t s r a t h e r th a n m e re ly d o s c r ib ln g It

a T ak e p h o to g r a p h s y o u r s e l f th a t e x ­p r e s s t h e ^ fo r m a t io n o r a rg u m e n t

■ S u a r d i fo r p lx x o g r a p l i s In t i u g c a rc h iv e s

IL L U S T R A T IO N S ■ A c t a t v isua l i n te r p r e ta t io n s o f l e x tu a l c o n te n t

a F x p U n c o m p le x ta s k s , e rp ip m e n r . o ro b f c c ts

■ C la r ify c o n c e p ts o r p r o c e s s e sa P r o v e a p o in t b y sh o w in g a n e x a m ­

p le a s e v id e n c e■ A d d a e s th e t ic a p p ea l

■ D r a w o r p u n t o r d in a l ar t . digitally o r b y h a n d

a S e a rc h f o r iN u srra n o n s in im a g e a rc h iv e s

■ U s e a m a p t o s h o w a r o u tea C r e a t e a n m e lin e t h a t s h o w s key

e v e n ts g rap h ic a lly

C H A R T S A N D G R A P H S ■ R e p r e s e n t d a ta v ls u a lya S h o w t r e n d s a n d re la tio n s h ip s

a m o n g v a ria b le s■ D m * a t t e n t io n t o tlx* m o s t I m p o r ­

t a n t c o n c lu s io n s t o b e d ra w n f ro m nn a n a ly s is o f d a ta

■ C o l le c t d a ta th r o u g h o r ig in a l r e - s e a r c h o r n t H era r e p o s i to r i e s

e U s e a s p r e a d s h e e t p r o g ra m t o c r e ­a t e c h a r t s a n d g r a p h s

DC S IG N A N D L A Y O U T C L E M E N T S

From The Thomson Handbook

■ D i r e c t d i e r e a d e r s e y e t o t h e m o s t I m p o r ta n t I n fo rm a tio n

■ C x p re s s h ie ra r c h ie s o f v a lu e a n d c a t ­e g o r ie s a c r o s s in fo rm a tio n

■ C o n v e y to n e a n d m o o d ( p ro f e s s io n ­a lism . a r t i s t r y , p lay fu ln ess)

a F x p r e s s f o rm as v isua l c o n te n t ( p a t­t e r n s . lin e s , e tc .)

■ A d d a e s th e t ic a p p ea l

■ L e a rn d v s £ n c o n v e n t io n s In t l i « p a r ­t ic u la r d isc ip lin e , a s d e s c r ib e d In s ty le g u id e s

e S tu d y e x a m p le s o f e ffe c tiv e design■ U s e th e la y o u t a n d s ty lo f e a tu r e s o f

a w o r d - p r o c e s s in g o r d e s k to p p u b ­lish ing p ro g ra m

Note the different types of visuals you can use in today's multimedia environment. As stated above, individual authors can now use powerful applications, such as Photoshop, PageMaker, PowerPoint, and Dreamweaver, to create documents that integrate text and visuals together to convey information and make appeals.

Visual/Table honr.The Thomson Handbook by David Blakesley and Jeffrey Hoogeveen. Boston: Cengage/Wadsworth, 2008.

10

Page 12: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Information Graphics

V isu a l C on ten t: P u rp o ses, S itu a t io n s , an d Exam ples

P r o v id e r a i d t r s w ith c o n d i * v isu a l w i d a n c a o f s o m e th in g r s f c r r a d t o Mt t h e t a x t

l l u i t r u a c o m p l e x p r o c a i M i

S u m m a r i z e , e x p la in , o r

From The Thomson Handbook

Y ou e x p la in o r a n a ly z e a p a in t in g , p h o t o ­g r a p h . o r o t h e r w o r k o f v isu a l a r t In a n e s s a y a n d n e e d t o g iv e r e a d e r s a n I m a g e s o t h a t th e y c a n s e e w h a t y o u a r e r e f e r r i n g t o Y ou o b s e r v e o r p a r t l c lp e c e In a n e v e n t a n d n e e d t o s h o w y o u r r e a d e r s w h e t y o u w i t ­n e s s e d o r e x p e r i e n c e dY ou w r i t e a c r i t i q u e o f a s c e n e I n a f ilm o r T V s h o w a n d w a n t t o h e l p r e a d e r s w h o m a y n o t r e c a l l t h e s c e n e .

1 In y o u r a rc h iv a l r e s e a r c h o n a h is to r ic a l s u b f o c t . y o u d i s c o v e r Im a g e s t h a t m a y h e lp y o u r r e a d e r s u n d e r s t a n d t h e s u b j e c t m o r e

In a m a g a z in e a r t i c l e , y o u r e p o r t o n a t r e n d o r e v e n t m t h e n e w s .

■ In a p a p e r d e s c r ib in g a p r o c e s s o r s e r i e s o f s t e p s , y o u w a n t t o s h o w r e a d e r s c o n c is e ly w h a t t h e s t e p s l o o k l ik e w h e n p e r f o r m e d .

■ In a s c i e n c e r e p o r t , y o u n e e d t o i l l u s t r a t e t h e r e l a t i o n s h i p b e t w e e n o b je c t s o r t h e c o n s t i t u t i o n o f a n o b | e c t

■ In an e n g in e e r i n g r e p o r t , y o u w a n t t o p r o ­v id e a d ia g r a m o f a n I n s t r u m e n t a n d h o w It

Y ou h a v e c o l l e c t e d d a t a o n p e o p le 's a t t i ­t u d e s t o w a r d a s u b je c t in y o u r f ie ld o f r e ­s e a r c h a n d w a n t t o s h o w h o w t h e s e a t t i ­t u d e s a r e d i f f e r e n t n o w th a n t h e y w e r e p r e -

Y ou f in d d a t a o n d e m o g r a p h ic v a r ia b le s a t a d a t a r e p o s i t o r y I k e t h e U .S . C e n s u s a n d w a n t t o s h o w t h a t t h e y a r e r e l a t e d .Y ou c o l l e c t d a t a o v e r t i m e in d ic a t in g t h a t a s ig n i f ic a n t c h a n g e h a s o c c u r r e d , a n d y o u w a n t t o s h o w t h i s t r e n d in a g r a p h .

Make sure to match your visuals with the function and production applicable for your given context (academic, professional) and audience.

Click mouse to advance slide.

Visual/Table honr.The Thomson Handbook by David Blakesley and Jeffrey Hoogeveen. Boston: Cengage/Wadsworth, 2008.

Page 13: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Information Graphics

Line graphs show relationships between and among types of data

• Data in line graphs are divided into logical units plotted along the vertical and horizontal axes

100

8 0

6 0

4 0

20

0J u l . 0 7 D e c . 0 7 F e b . 0 8 A p r . 0 8

Example: The change in quantity (e.g. revenue) over time

Line graphs show relationships among types of data, such as the change in quantity (e.g., revenue) over time. Data are divided into logical unites on the vertical and horizontal axes. A line graph showing revenue growth over time might have time units (e.g., months) placed horizontally and revenue units (e.g., dollars) vertically.In the example above, a simple line graph illustrates the differences between asphalt and concrete from summer through winter months and into the spring.

Click mouse to advance slide.

12

Page 14: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Information Graphics

Bar graphs show comparative relationships across a data set, correlated with a common reference point

Apr. 08

Feb. 08

Dec. 07

Jul. 07

0 50 100

I Cone ret e

) Asphalt

Bar graphs show comparative relationships across a data set, correlated with a common reference point. For example, a bar graph could show how much time people in different fields spent writing at their jobs. In the example above, the bar graph shows the different amounts of time it took to repair asphalt roads versus concrete roads.

Click mouse to advance slide.

13

Page 15: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Pie charts show the relative quantities of the components of something

• Slices in any pie chart must add up to 100%

1 0 %

■ F e d e r a l

■ I n d i a n a

■ P u r d u e

Pie charts show the relative quantities of the components of something. You could use a pie chart to show the makeup of a group of people, with each slice of the pie having a size corresponding to the percentage of people in that group. In the example above, the pie chart illustrates the percentages of funding for INDOT (hypothetical) from three different sources.

Click mouse to advance slide.

14

Page 16: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Flowcharts include visual illustrations and arrows to show how a process unfolds over time or how one idea or action leads to another.

Flowcharts include visual illustrations and arrows to show how a process unfolds over time or how one idea or action leads to another. Flowcharts help writers show the steps in a process. In the example above, the flowchart illustrates the process for finding out the largest of three numbers.

Click mouse to advance slide.

15

Page 17: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Tables are visual displays of data and enable readers to compare information and quickly view findings.

T A B L E 1 C r it ica l S tr e sse s at th e B o tto m o f A sp h a lt L a y e r a n d C R C P

HMA thickness, inch 1.5 2 4 1.5 2 4 1.5 2 4HMA Modulus of Elastic­

ity, psi 250 250 250 450 450 450 450 450 450

CRCP thickness, inch 13 13 13 14 14 14 15 15 15CRCP Modulus of Elastic­

ity, psi 400 400 400 400 400 400 400 400 400

Modulus of Subgradc Reac­tion, pci 100 100 100 100 100 100 100 100 100

Horizontal Stress at bottom HMA, psi 1.2 1.6 3.2 1.8 2.4 4.7 1.5 2.0 4.0

Horizontal Stress at bottom PCC, psi 140.6 140.6 140.4 127.1 127.0 126.8 115.6 115.5 115.4

Horizontal Stress at bottom PCC, psi, 20JFdifferentials 204.2 201.3 197.4 178.7 176.6 168.3 157.4 156.5 145.1

Tables display data and enable readers to compare data quickly and easily (or at least they should!). Poorly designed tables can be a mess of numbers, columns, and rows that cause more confusion than clarity. Therefore, it's important to decide before you design what you want the table to SAY. While it's unethical to manipulate tables to convey data inaccurately, you can make design decisions that present data clearly to help readers understand what you're trying to say. Remember that text and visuals work together to help readers understand complex information so they can make decisions.

Click mouse to advance slide.

16

Page 18: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Diagrams are illustrations of something that consists of parts (such as an engine)

• These illustrations provide viewers with an idea of orientation and perspective.

I IMA layer Ei

PCC layer E2

T hiTT

T*. ^PCC layer E, h,

ir

FIGURE 2 Equivalent thicknesses

Diagrams are illustrations of something that consists of parts (such as an engine). They provide readers with orientation and perspective. In the example above, the diagram illustrates the equivalent thicknesses of two types of pavement overlay.

Click mouse to advance slide.

17

Page 19: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Information Graphics

Venn diagrams use circles or arcs to show how one thing intersects or overlaps with something else

/ D O G S H U M A N S \

/ have fur all 1 over 1

f mammals \ can run for \ l President \

animals K . have 2 legs 1

\ may eat bugs /

have 4 legs

' found in ) LEARN NC \

offices

reptiles have scales

L IZ A R D S

From Learn NC: http://www.learnnc.org/reference/Venn+diagram

Venn diagrams use circles or arcs to show how one thing intersects or overlaps with something else. They are also used to show relationships, commonalities and differences. In the example above, this three-part Venn diagram illustrates the commonalities and differences between dogs, humans, and lizards.

Click mouse to advance slide. Get more quantifiable Venn diagram before posting to OWL.

18

Page 20: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Information Graphics

Maps are visual illustrations of a physical space (such as a state, city, or mall) and/or are used to associate a region or idea with an event, action, or other phenomenon.

IN D IA N AR o ad N etw o rk (U S A )

NA

A g ta n g e

Lo ga n sport

rtlarid

• MurtCNtKofco&o

tofayoOs A n d*r*o n •LatMoon

r r a v : n r

Brazil MartoiviMa

SSte ’ .aaJr'r:__; • - M - W -

BdOftSto ScoO^txi rg Vinoengas # Paoli

W ashington * Alhnny

Princeton - '? l

Evansville L tO tM D

Maps are visual illustrations of physical space (such as a city or mall). Maps are also used to associate a region or idea with an event, action, or other phenomenon. So, for example, neuroscientists might develop a cognitive map that shows what parts of the brain perform which functions. The map above illustrates the road network of the state of Indiana in the United States.

Click mouse to advance slide.

19

Page 21: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

How you use visuals is just as important as the textual content of a document:

1. Every image should serve specific function• Either as an illustration or as content for analysis

2. Always introduce and explain visuals• Images and infographics should be placed after they

are first mentioned and as near as possible to thepoint of reference (exceptions for Transportation Research Board submission guides)

Using Visuals to Inform& Persuade: Tips

Visuals should be chosen with consideration of how they will help you accomplish your rhetorical goals in a given context, and they should serve a specific purpose. You will need to decide whether to include visuals at all and, if you do include them, which kind of visuals you need and how to present them. The tips included on the next four slides should help you integrate visuals into your document.

Click mouse to advance slide.

20

Page 22: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals, Tips (cont.):1. Caption every photograph and illustration (exceptions for specific style guides and citation methods, ex. APA, MLA, etc.)

• Captions for charts, graphs, and tables shouldsummarize the content of the visual (follow Transportation Research Board submission guides)

2. Copyright and Permission information should accompany all images and be properly cited in the caption3. Proofread all infographics to make sure the information they convey is correct and makes sense4. Leave enough padding (white space) around the image so that the text doesn't run up against it

Words have a dialectical relationship with nearby images. Words comment on images; images help illustrate or explain verbal content. The viewer's eye tends to be drawn to the visual, but words also shape the reader's perception. There's no guarantee that readers will see what you want them to see, so, as a writer, guide readers by using some basic principles for effectively integrating visual content into a text.

Click mouse to advance slide.

21

Page 23: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform& Persuade: Tips

Basic Principles of Graphic Design

Proximity - a way to convey meaningful relationships between elements.

• Try to put closely related images and text close to each other on the page

• Alignment - the spatial layout of elements on a page; a discernible, visual pattern.

• Try to align every object on a page with the edges of other elements to establish a pattern and relationship (unless your goal is to show discord).

A primary goal of graphic designers is to present content so that visual, design, and textual content work in harmony to convey information and create the desired effect. That goal is one to work for, whether your material is a brochure for a student club or program, a poster for a special event, a business card, or a research report that uses the visual representation of data to reinforce or extend an argument. The principles of proximity, alignment, repetition, and contrast can be followed to make sure that your visual and design content works in concert with your verbal content so that you communicate efficiently or argue effectively.

Click mouse to advance slide.

22

Page 24: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Basics of Graph ic Design (cont).:

Using Visuals to Inform& Persuade: Tips

• Repetition - a way to show meaningful connections among types of content, pages, or regions of a page.• Try to keep design elements (page numbers, colors)

consistent to help readers navigate documents

• Contrast - the sharp differences in color, typography, or other design elements used to highlight or prioritize information.• Try to use contrast (black font against white paper) to

help convey a clear message and/or to establish close relationships between important elements

Proximity, alignment, repetition, and contrast are basic principles of graphic design based on psychology's Gestalt Theory. Dr. Stephen Bernhardt, in his landmark essay, "Seeing the Text," (College Composition and Communication 37(Feb 1986): 66-78.) explains that Gestalt Theory "...teaches designers to organize ideas based on the following criteria:- Equilibrium: Items in a field usually strive for balance or equilibrium with other

items in the field- Good continuation: Visual perception works to pull figures out of the background,

to give them definition against the undistinguished field in which they are located- Closure: Readers will fill in the missing gaps, to provide the missing definition- Similarity: Units that resemble each other in shape, size, color, or direction will be

seentogether as a homogonous grouping (qtd. in Brizee, "Teaching Visual Literacy and Document Design in First-Year Composition," unpublished MA Thesis, 2003, 21).

Click mouse to advance slide.

23

Page 25: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Gty/L Using Visuals to Inform &Persuade: Typography

its, typefaces, and point size enhance readability

.d e fa c e : fonts are classified as serif and sans serif• Serif fonts have small strokes at the ends of some lines:

ex. Times New Roman • Works well as a body font

• Sans serif fonts do not have these additional strokes: ex. Arial• Works well as a heading font

• Normal typeface is best for body text while special typefaces (ex. bold, italics, etc.) should be reserved for headings, titles, and other special elements

Typography refers to the overall balance and interplay of the letters on the page or screen. You can use typography to enhance the readability of information and to direct the flow of an argument by following design principles to establish a unified theme and style.

Distinguish body text from headings by using contrasting fonts. Serif fonts are useful for body text on a printed page, and sans serif fonts are often used for headers. You also want to check to be sure the font is legible. In addition, make sure the tone and style of the type reinforces the message of your content. A script font like Lucida Handwriting would look odd in a formal research paper, but it might work well for a short header on a poster or a Web page.

Use bold and italic for special purposes, such as to emphasize heading or words used in special senses.

Click mouse to advance slide.

24

Page 26: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Typography

Point size:• For the body text in paper documents use 10-, 11 or

12-point fonts• For headings vary the point size modestly

• For posters and other display documents choose point sizes that will make information stand out

10

Always consider your audience when deciding on point size. In a newsletter for elders, for example, you might use 14-point instead of 10-point.

Click mouse to advance slide.

25

Page 27: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform & Persuade: Research Posters

Research posters should catch a reader's attention & make key information understandable.Good posters:

• Display important information at conferences

- Qi • Summarize key findings of a research or lab

m project (etc.)

• Tell the story of the project and provide a snapshot of its key points or features

Poster displays boards at exhibits or special events need to be easily readable from a distance. However, the information they provide is usually more detailed - for example, summarizing the key findings of a research or lab project. Project display boards "tell a story" of a project and provide the audience with a snapshot or synopsis of the project's key points or features. Your local bookstore or art supply store may sell specially designed and foldable project display boards on which you can mount printed images and text.

Click mouse to advance slide.

26

Page 28: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Introduction section includes

background inform ation. and details

the research question

T e x t it m i n t to read if it t

bbek on a white

background, but you can use a bright

color at a b a c k g r o u n d outside the

text area.

T w n t n l L /. fad #

From The Thomson Handbook

The Methodsection describes key points about

how you conducted your

research. For example. It might

Include Information about participants

and procedures.

The Results section summarizes

the data you collected In your

study For example, it rreght indude relevant tables

and figures.

The Conclusionssection evaluates

and interprets the data and their significance. This column may also

indude References and Acknowledgments.

although these are sometimes presented

in a handout that viewers can take

with them

Poster display boards are large, complex documents composed of images and text. In some respects, they function like a large page and thus need to guide the reader's eyes carefully to critical information. Plan your poster board in such a way that your reader will know how to read in sequence (if sequence matters). Don't be afraid to use numbers or other navigation cues to help people along. Some poster sessions or exhibits may have guidelines for the layout of posters, perhaps in the interest of keeping an audience moving in a crowded space or in a competition.

The example in this slide is designed according to APA style. APA posters should be 6' X 4'. Another popular size is 4' X 3'. They are designed as tri-fold display boards using three columns, with the center column measuring 2' and each side panel 1'. Presenters typically place the primary content in the center column and use the outer columns for related information or examples.

Chart/Visual from The Thomson Handbook by David Blakesley and Jeffrey Hoogeveen. Boston: Cengage/Wadsworth, 2008.

Click mouse to advance slide.

27

Page 29: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform& Persuade: Poster Tips

Poster Tips:1. Do your research - make sure all information is

accurate2. Storyboard - create a mock-up of your poster3. Grab attention - be assertive with design by using

striking (but relevant) visual elements4. Hold attention - provide useful, precise information

that is legible from a short distance5. Use graphical design principles:

• Contrast• Repetition• Alignment• Proximity• Establish a color scheme that complements content

This list outlines some tips for composing and constructing a trifold poster display.

Click mouse to advance slide.

28

Page 30: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Using Visuals to Inform& Persuade: Poster Tips

Poster Tips (cont.):6. Revise and edit - ask at least one other person to read your poster7. Using durable materials - materials should be able to survive ordinary "bumps and bruises"

a. You may want to consider printing at home and assembling on site

b. If you can, scout out print shops near the location of your presentation - just in case!

Always have someone else look at your poster before you display it.

Click mouse to advance slide.

Page 31: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Cut out and use these textual create your own mock up on

and graphical elements to the "trifold" slide

Using Visuals to Inform &Persuade: Poster Practice

Title: Lorem Ipsum Dolor Sit Amet Praesent Imperdiet Ege stas Purus

Introduction Lo rem ip su m dolor sit am et, co n se cte tu e r a d ip isc in g elit.

Method Lorem ipsum dolor sit amet. consectetuer adipiscing elit. Nam turpis nunc, rutrum eget, mattis ac.

Results aliquet vitae, est. Quisque et neque.

- Vestibulum tincidunt eros.

Conclusions - Donee ut orci.- Vivamus ut erat non tellus.

Lo rem ip su m dolor sit am et, co n se cte tu e r a d ip isc in g elit.

- Vestibulum tinddunt eras.• Donee ut orci.- Vivamus ut erat non tellus.

Lo rem ip su m dolor sit am et, co n se cte tu e r a d ip isc in g elit.

Lorem ipsum dolor sit amet consectetuer adipiscing elit. Nam turpis nunc, rutrum eget. mattis ac, aliquet vitae, est. Quisque et neque.

To practice designing and composing a poster display board, try completing a mockup. Print the slides and cut out the design elements. Then layout the elements on the trifold slide. When you're happy with the design, tape down the elements and take a step back. How does it look? Are your messages clear? Does the poster work from a distance? How does it look up close?

Click mouse to advance slide.

30

Page 32: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Lorem ip su m dolor s it am et. Lo rem ipsum dolor sit am et.co n se cte tu e r a d ip isc in g elit. co n se cte tu e r a d ip isc in g elit.

Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.consectetuer adipiscing elit. Nam consectetuer adipiscing elit. Namturpis nunc, rutrum eget, mattis ac. turpis nunc, rutrum eget, mattis ac.aliquet vitae, est. Quisque et aliquet vitae, est. Quisque etneque. neque.

- Vestibulum tincidunt eras. - Vestibiium tincidunt eros.- Donee ut orci. - Donee ut orci.- Vrvamus ut erat non tellus. - Vivamus ut erat non tellus.

Print and cut out these design elements for your poster mockup.

Click mouse to advance slide.

31

Page 33: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Print this slide and use it as your trifold board.

Click mouse to advance slide.

Page 34: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Remember, there are many different ways to design a trifold. This mockup follows the APA design; it's pretty conservative. Depending on your goals, context, and audience, you may want to break some rules to convey your message.

Click mouse to advance slide.

33

Page 35: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

Where to Go to Get More Help

Purdue University Writing Lab Heavilon 226

Web: http://owl.english.purdue.edu/Phone: (765) 494-3723Email: [email protected]

Rationale: Purdue students are invited to meet with a tutor to assist with writing challenges on an individual basis. Viewers outside of Purdue may receive assistance through the OWL (Online Writing Lab) and answers to quick questions through the OWL email service.

Click mouse to advance slide.

34

Page 36: otherwise noted in bold at the bottom of each notes page ...techwritingf16.robinwharton.net/wp-content/uploads/2016/10/Unit3_… · - "Using Fonts with Purpose": ... Writers use visual

DOCUMENT DESIGN AND PRESENTATION Adapted by Allen Brizee & Dr. David Blakesley from The Thomson Handbook by Dr. David Blakesley & Dr. Jeffrey L. HoogeveenBrought to you in cooperation with the Purdue Online Writing Lab

Thank you for using a Purdue OWL resource.