Download presentation
Presentation is loading. Please wait.
1
McGraw-Hill/Irwin Copyright © 2009 by The McGraw-Hill Companies, All Rights Reserved.
2
Designing Documents, Data Displays, and Visuals
Chapter 6 Designing Documents, Data Displays, and Visuals Design Importance Designs & Conventions Levels of Design Page Design Guidelines Using Visuals Visual Design Guidelines Integrating Visuals Designing Brochures Designing Web pages Usability Testing
3
Why Design Matters Saves time and money Reduces legal problems
Builds goodwill Attractive pages look friendly, easy to read Grouping ideas shows structure
4
Design: Part of Writing
Think about design at each step As you plan, think about audience Skilled or busy? Read straight through or skip around? As you write, use lists, headings. Use visuals to convey numerical data clearly Get feedback from your audience As you revise, check the design guidelines that follow
5
Design & Conventions Vary widely by audience, geographic area, industry, or department Change over time Violating is risky Presents incorrect interpretations Signals author is unreliable or unknowledgeable
6
Levels of Design Intra—individual letters and words
Inter—blocks of text Extra—graphics that go with the text Supra—entire document
7
Page Design Guidelines
Use white space Use headings Limit words in all capital letters Use no more than two fonts per document
8
Page Design Guidelines, continued…
Justify margins selectively Put key items at top left or bottom right Use a grid for visual unity Use highlighting, decorative devices, and color in moderation
9
Use White Space White Space—empty space on the page
Makes message easier to read To create white space, use Headings Mix of paragraph lengths Lists of parallel items (same form) Bullets or numbers when order is exact XXXXX XXXXXXXXXXXXXXXX
10
Use Headings Headings—words, phrases, or short sentences
Group points; divide document Show organization Help reader; save reader’s time Make page look interesting To create headings Make each specific Keep headings parallel Make sure they cover material until next heading
11
Limit Words in All Capital Letters
Words in all capitals Lose their unique shapes Have same rectangular shape Lack ascenders and descenders Causes reader to slow down Causes more reading errors people PEOPLE
12
Use No More Than Two Fonts
Fonts—unified styles of type Serif font – letters have feet Easy to read; used for paragraphs Ex: New Courier, Times Roman Sans serif font – letters lack feet Harder to read; used for headings, tables Ex: Arial, Tahoma, Univers
13
Use No More Than Two Fonts, continued…
Most documents use just one font Create emphasis by using Bold Italics Varied sizes Font size 12-point ideal for most business documents Headings may be larger
14
Justify Margins Selectively
XXXXX XXXXXXXXXXXX Full justification— text even at left and right margin Want formal look Want to use fewest pages Ragged right margin— text even on left, uneven on right Want informal look Use very short lines Want to revise selected pages XXXXX XXXXXXXXXXXX XXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXX
15
Put Key Items at Top Left or Bottom Right
Reader’s eye moves in Z pattern Starts at upper left corner of page Reads to the right and down Quadrants in order of importance Top left Bottom right Bottom left Top right 1 2
16
Use a Grid for Visual Unity
Grid—2 or 3 imaginary columns on page; may be subdivided All elements lined up in columns Creates pleasing symmetry Unifies long documents
17
Use Decorative Devices in Moderation
Use decorative devices sparingly Add interest/emphasis with dingbats, clip art Use color for main headings, not details In North America, red usually means danger
18
Every visual should tell a story
Use Visuals To present ideas completely To find / show relationships To make points vivid To emphasize material To present material concisely, with less repetition Every visual should tell a story
19
Visual Design Guidelines
Check quality of data Determine story you want to tell Choose visual that fits the story Follow conventions for designing visuals Use color and decoration with restraint Be sure that visual is accurate, ethical
20
1. Check Quality of Data Check data comes from reliable source
Check you have data for all factors you should consider Use data based on assumptions and definitions in careful titles Do not use visuals of unreliable data
21
2. Determine Story You Want to Tell
Good stories may Support a hunch you have Surprise or challenge knowledge Show unexpected trends or changes Have commercial or social significance Provide information needed for action Be relevant to audience
22
2. Determine Story You Want to Tell
To find stories Focus on a topic Simplify the data on that topic and convert number to simple units Look for relationships and changes Process the data to find more stories
23
3. Choose the Right Visual for the Story
Use table when reader needs exact values Use pie chart to show parts of a whole
24
3. Choose the Right Visual for the Story
Use bar chart to compare items, show relationships Use paired charts to tell complex stories
25
3. Choose the Right Visual for the Story
Uses line charts to Compare items over time Show frequency or distribution Show correlations
26
3. Choose the Right Visual for the Story
Use photographs to Create a sense of authenticity Show item in use Use drawings to Show dimensions Emphasize detail
27
3. Choose the Right Visual for the Story
Use maps to emphasize location
28
3. Choose the Right Visual for the Story
Use Gantt charts to show timelines Determine what levels of training, education and communication will be necessary for implementing the option Select most feasible option based on criteria 2 3 Develop plan for assessing option implementation 4 Determine criteria for exploring each option 1 Final Presentation Week 9/10 9/24 9/30 10/7 10/14 9/17 Interim Meeting bi-weekly status calls Develop an implementation plan Determine resources and responsibilities are necessary to complete tasks 5 Determine critical path to estimate time required to complete all tasks 7 6 Kick-off Meeting
29
! ! 3. Choose the Right Visual for the Story
Perspective makes graphs hard to read ! !
30
4. Follow Conventions for Designing Visuals
Six Parts of Every Visual Title that tells story visual shows Clear indication of what data are Clearly labeled units Labels or legends identifying axes, colors, symbols, etc. Source of data used to create visual Source of visual if not your work
31
5. Use Color & Decoration w/Restraint
Audiences interpret color based on contexts Color connotations vary among cultures and professions Red = go in China; stop in U.S. Blue = masculinity in U.S.; criminality in France; strength/fertility in Egypt Use minimum shading and lines For black-and-white graphs, use shades of gray
32
6. Be Sure Visual is Accurate, Ethical
Make sure audience does not have to study visual to learn main point Distinguish between actual and estimated or projected values Include the context of data Avoid perspective and 3-D graphs Avoid combining with multiple scales Use images that are bias-free
33
Integrating Visuals into Your Text
Refer to every visual in your text Refer to the table or figure number, not the title Ex: Table 10 shows a detailed comparison. . . Ex: Data in Figure 6 reveals a marked trend of. . . Put visual as soon after reference as space and page design permit Ex: As Figure 3 shows (page 10), . . . Ex: (See Table 2 on page 14.)
34
Integrating Visuals into Your Text, continued...
Summarize main point of visual before the visual itself Amount of discussion depends on audience, complexity of visual, and importance of point After visual, evaluate the data, discuss its implications Weak: Listed below are the results. Better: As Figure 4 shows, sales doubled in the last decade.
35
Designing Brochures Determine your objectives
Use this process to create effective brochures Determine your objectives Identify your target audiences Identify central selling point Choose image you want to project Identify objections; brainstorm ways to deal with them
36
Designing Brochures, continued…
Draft text to see how much space it takes Select visuals to accompany text Experiment with different papers and layouts Make every choice a conscious one Color – Font – Layout – Paper Polish prose and graphics
37
Brochure Design Principles
Put central selling point on cover Use a visual that tells a story Use grid to align elements Repeat graphics; use contrasting sizes, shapes Use color effectively
38
Brochure Design Principles, continued…
Make text look appealing Use no more than two fonts Avoid italic type and underlining Use small tab indents Insert plenty of white space Use ragged right margin Don’t put vital points on back of reply coupon
39
Designing Web Pages: Text
Help surfing reader learn about Web page sponsor Offer contents list, link to each part Put most interesting, useful points at top of first screen Make clear what readers will get if they click a link
40
Designing Web Pages: Visuals
Use white or light background Keep graphics small Provide visual variety Unify pages; show sponsor on each Include on every page-- Link to home page Name and address of webmaster Date page was last revised
41
Designing Web Pages: Visuals, continued…
Use little animation; let readers control its use If page includes sound, put off button where users can see it at once Visit Xenogene, a Web design company. Thumbnails show sample Web page designs
42
Designing Web Pages Common Web page design mistakes
Text audiences cannot read Content that doesn’t answers questions Difficult navigation and search tools Complex and lengthy forms Bugs, typos, or corrupted data Outdated content
43
Usability Tests Watch someone use document to do a task
Ask reader to think aloud during task Interrupt at key points to find out what reader thinks Ask reader to describe thought process afterwards Ask reader to put + and - signs in margins to show likes and dislikes
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.