think and write like a designer to be a better analyzer and creator of design for infographics &...
TRANSCRIPT
![Page 1: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/1.jpg)
Think and Write Like a Designer to be a Better Analyzer and Creator of Design
For Infographics & Graphs
![Page 2: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/2.jpg)
Question #1: Does It Need to be an Infographic?
Here? Yes. That’s damn creative.
![Page 3: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/3.jpg)
Here? No, no, it doesn’t. There’s nothing interesting or creative going on here at all.
This could be a bullet list and get the job done quicker.
![Page 4: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/4.jpg)
![Page 5: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/5.jpg)
![Page 6: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/6.jpg)
![Page 7: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/7.jpg)
![Page 8: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/8.jpg)
Colors next to each other on the wheel are called “analogous” and will look good together.
![Page 9: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/9.jpg)
Colors opposite to each other on the wheel are called “complementary” and will provide maximum contrast.
![Page 10: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/10.jpg)
Poor ContrastThis would be very hard to look at for a long period of time.
Good Contrast,This would technicallywork, but (on a personal note) still doesn’t look great.
Kind of Christmas-like, but technically the contrast is there.
Poor contrast. Consult your color wheel if your own eye can’t see how poor this looks!
![Page 11: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/11.jpg)
Colors Have Reason and Good Contrast
![Page 12: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/12.jpg)
No Reason for Different Colors(can be distracting)
![Page 13: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/13.jpg)
Lack of Contrast and Confusing Patterns
![Page 14: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/14.jpg)
Blue Background Does Not Contrast Enough For 4 Pieces to Stand Out
![Page 15: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/15.jpg)
Are You Kidding Me?
![Page 16: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/16.jpg)
Stop It.(bonus points for stereotypes)
![Page 17: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/17.jpg)
MUCH BETTER
• Orange and Blue provide maximum contrast
• Pop or red provides contrast but are also analogous with the orange
• Different sizes of texts and images tell the eye exactly where to look
![Page 18: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/18.jpg)
In Short
• Good contrast is aesthetically pleasing, tells the viewer what’s most important on the screen, and makes elements stand out
• Poor contrast leads to ugliness, confusion of focal points, and can make things hard to read or look at
![Page 19: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/19.jpg)
![Page 20: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/20.jpg)
• 7-8 different colors for no reason
• Some title/headings all caps– some not
• Underline can’t decide how far it wants to extend past words
Poor Repetition
![Page 21: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/21.jpg)
Repetition: See, Not That Hard!
![Page 22: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/22.jpg)
In Short
• Good repetition makes a site feel unified, coherent, and consistent
• A lack of repetition is confusing and hurts the coherence and identity of a site
![Page 23: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/23.jpg)
![Page 24: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/24.jpg)
I Don’t Have Time for This
![Page 25: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/25.jpg)
The Designer Hates You
![Page 26: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/26.jpg)
I Hate the Designer
![Page 27: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/27.jpg)
Proximity Changes the World!
![Page 28: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/28.jpg)
In Short
• Good use of proximity leads to strong organization and letting someone know how to navigate a site
• Poor proximity makes navigation difficult and leads to frustration
![Page 29: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/29.jpg)
![Page 30: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/30.jpg)
Basic Grid: But Gets the Job Done
![Page 31: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/31.jpg)
I Love This So Much
![Page 32: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/32.jpg)
This familiar problem of misleading height of bars is technically an alignment problem.
![Page 33: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/33.jpg)
If you can find any rhyme or reason to this alignment, beyond that’s just where stuff kinda fit, please let me know.
![Page 34: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/34.jpg)
Good to Have a Legend, But It’s Just Kinda Mashed In There
![Page 35: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/35.jpg)
In Short
• Good alignment is aesthetically pleasing and organizes sections of the site into logical and usable sections that are easy to find and work with
• Poor alignment is ugly, confusing to the eye, looks amateurish, and causes frustration
![Page 36: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/36.jpg)
![Page 37: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/37.jpg)
Nicely Symmetrical Balance with Plenty of Good White Space Left Over
![Page 38: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/38.jpg)
Still As Good as it was Slides Ago
![Page 39: Think and Write Like a Designer to be a Better Analyzer and Creator of Design For Infographics & Graphs](https://reader030.vdocuments.us/reader030/viewer/2022032708/56649e705503460f94b6e528/html5/thumbnails/39.jpg)
But . . . But . . . Why?