Presentation is loading. Please wait.

Presentation is loading. Please wait.

Designing Documents, Data Displays, and Visuals

Similar presentations


Presentation on theme: "Designing Documents, Data Displays, and Visuals"— Presentation transcript:

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


Download ppt "Designing Documents, Data Displays, and Visuals"

Similar presentations


Ads by Google