CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with...
Transcript of CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with...
![Page 1: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/1.jpg)
Human Computer Interaction Laboratory
@jonfroehlich Assistant Professor Computer Science
CMSC434 Introduction to Human-Computer Interaction
Week 12 | Lecture 23 | Nov 19, 2013
Visual Design: Typography & Legibility
![Page 2: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/2.jpg)
Hall of Fame Hall of Shame
![Page 4: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/4.jpg)
![Page 5: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/5.jpg)
Today
1. Schedule
2. Typography
3. Midterm
![Page 6: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/6.jpg)
![Page 7: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/7.jpg)
![Page 8: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/8.jpg)
Small Activity
Take out notebook or other writing medium
Write feelings/adjectives/reactions to each slide
Focus on immediate, visceral reaction
![Page 9: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/9.jpg)
love
![Page 10: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/10.jpg)
love
![Page 11: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/11.jpg)
love
![Page 12: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/12.jpg)
love
![Page 13: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/13.jpg)
love
![Page 14: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/14.jpg)
love
![Page 15: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/15.jpg)
love
love
love
LOVE
Love
love
Segoe UI Light
Palace Script MT
Amatic SC
Arcade classic
October Crow
Double Feature
![Page 16: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/16.jpg)
love
love
love
LOVE
Love
love
Segoe UI Light
Palace Script MT
Amatic SC
Arcade classic
October Crow
Double Feature
![Page 17: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/17.jpg)
Gamifying green Jon Froehlich Assistant Professor CS 30th Annual HCIL Symposium May 22 2013
![Page 18: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/18.jpg)
![Page 19: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/19.jpg)
strong
![Page 20: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/20.jpg)
strong
![Page 21: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/21.jpg)
strong
![Page 22: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/22.jpg)
strong
![Page 23: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/23.jpg)
strong
![Page 24: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/24.jpg)
strong
strong
strong
strong
strong
Crafty Girls
Impact
Comic Sans MS
Helvetica NeueLT Com 23 UltLtEx
Edwardian Script
![Page 25: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/25.jpg)
strong
strong
strong
strong
strong
Crafty Girls
Impact
Comic Sans MS
Helvetica NeueLT Com 23 UltLtEx
Edwardian Script
![Page 26: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/26.jpg)
In IxD, we care about legibility but we also care
about mood, personality, vibrancy, and energy.
![Page 27: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/27.jpg)
One of the principles of durable typography
is always legibility; another is something
more than legibility:
Robert Bringhurst Poet, Typographer, Author
Quote from: Bringhurst, The Elements of Typographic Style, 2002
![Page 28: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/28.jpg)
One of the principles of durable typography
is always legibility; another is something
more than legibility: some earned or
unearned interest that gives its living energy
to the page. It takes various forms and goes
by various names, including serenity,
liveliness, laughter, grace, and joy.
Robert Bringhurst Poet, Typographer, Author
Quote from: Bringhurst, The Elements of Typographic Style, 2002
![Page 29: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/29.jpg)
![Page 30: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/30.jpg)
![Page 31: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/31.jpg)
![Page 32: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/32.jpg)
kerning
![Page 33: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/33.jpg)
kerning ke r n i n g
![Page 34: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/34.jpg)
kerning ke r n i n g kerning
![Page 35: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/35.jpg)
![Page 36: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/36.jpg)
Human Computer Interaction Laboratory
@jonfroehlich Assistant Professor Computer Science
CMSC434 Introduction to Human-Computer Interaction
Week 12 | Lecture 23 | Nov 19, 2013
Visual Design: Typography
![Page 37: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/37.jpg)
Human Computer Interaction Laboratory
@jonfroehlich Assistant Professor Computer Science
CMSC434 Introduction to Human-Computer Interaction
Week 12 | Lecture 23 | Nov 19, 2013
Visual Design: Typography
![Page 38: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/38.jpg)
CMSC434 Introduction to Human-Computer Interaction
![Page 39: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/39.jpg)
![Page 40: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/40.jpg)
CMSC434 Introduction to Human-Computer Interaction
![Page 41: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/41.jpg)
![Page 42: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/42.jpg)
type & scale
![Page 43: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/43.jpg)
Scale is the relationship among elements
within a composition or hierarchy.
Ellen Lupton Author, Designer, Educator
Quote from: Lupton, Thinking with Type, 2nd Edition, 2010
![Page 44: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/44.jpg)
![Page 45: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/45.jpg)
![Page 46: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/46.jpg)
Slide from Ellen Lupton, Thinking with Type
![Page 47: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/47.jpg)
revolver: zeitschrift für
film (magazine for film)
Slide from Ellen Lupton, Thinking with Type
![Page 48: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/48.jpg)
![Page 49: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/49.jpg)
Slide from Ellen Lupton, Thinking with Type
UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC)
Maps, 2009. Design: Harry Pearce and Jason Ching/ Pentagram.
This series of posters for the United Nations’ Office on Drugs and Crime uses typographic scale to compare drug treatment programs, HIV incidence, and other data worldwide. The designers built simple world maps from country abbreviation codes (GBR, USA, RUS, etc.). Note Russia’s high incidence of HIV and low availability of addiction rehabilitation programs.
![Page 50: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/50.jpg)
http://gizmodo.com/5590572/windows-phone-7-gallery/
![Page 51: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/51.jpg)
http://gizmodo.com/5590572/windows-phone-7-gallery/
![Page 52: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/52.jpg)
![Page 53: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/53.jpg)
![Page 54: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/54.jpg)
http://go.microsoft.com/fwlink/?LinkId=196225
![Page 55: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/55.jpg)
http://www.flickr.com/photos/47388015@N00/5186798761/sizes/o/in/photostream/
![Page 56: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/56.jpg)
typefaces serif vs. sans-serif
![Page 57: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/57.jpg)
http://en.wikipedia.org/wiki/Serif
![Page 58: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/58.jpg)
San-serif
Serif
http://en.wikipedia.org/wiki/Serif
![Page 59: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/59.jpg)
San-serif
Serif
Serif (red serifs)
http://en.wikipedia.org/wiki/Serif
![Page 60: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/60.jpg)
In typography, serif is a small line attached
to the end of a stroke or symbol… a typeface
with serifs is called a serif typeface. A
typeface without serifs is called sans-serif.
Wikipedia http://en.wikipedia.org/wiki/Serif
![Page 61: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/61.jpg)
In typography, serif is a small line attached
to the end of a stroke or symbol… a typeface
with serifs is called a serif typeface. A
typeface without serifs is called sans-serif.
Wikipedia http://en.wikipedia.org/wiki/Serif
![Page 62: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/62.jpg)
Other languages have different writing styles akin
to serif vs. sans-serif
http://en.wikipedia.org/wiki/Serif
![Page 63: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/63.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
![Page 64: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/64.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
![Page 65: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/65.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
![Page 66: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/66.jpg)
Which is more legible?
Serif or Sans-serif?
![Page 69: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/69.jpg)
read how we
![Page 70: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/70.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
When we read, our eyes travel along the lines in “saccadic leaps” (roughly approximated by red arrows), pausing briefly at regular intervals called “fixations” (shown as gold circles). Occasionally we regress to reread a chunk.
![Page 71: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/71.jpg)
Aoccdrnig to rscheearch at Cmabrigde uinervtisy, it
deosn't mttaer waht oredr the ltteers in a wrod are,
the olny iprmoetnt tihng is taht the frist and lsat
ltteres are at the rghit pclae. The rset can be a tatol
mses and you can sitll raed it wouthit a porbelm.
Tihs is bcuseae we do not raed ervey lteter by it slef
but the wrod as a wlohe.
![Page 72: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/72.jpg)
Aoccdrnig to rscheearch at Cmabrigde uinervtisy, it
deosn't mttaer waht oredr the ltteers in a wrod are,
the olny iprmoetnt tihng is taht the frist and lsat
ltteres are at the rghit pclae. The rset can be a tatol
mses and you can sitll raed it wouthit a porbelm.
Tihs is bcuseae we do not raed ervey lteter by it slef
but the wrod as a wlohe.
![Page 73: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/73.jpg)
Anidroccg to rcraeseh at Cgdirbmae utisreviny
![Page 74: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/74.jpg)
![Page 75: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/75.jpg)
![Page 76: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/76.jpg)
![Page 77: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/77.jpg)
Condition Example Sentence Reading
Speed
Normal The boy could not solve the problem so he asked for help. 255 wpm
Internal letters The boy cuold not slove the probelm so he aksed for help. 227 wpm
Final letters The boy coudl not solev the problme so he askde for help. 189 wpm
Beginning letters The boy oculd not oslve the rpoblem so he saked for help. 163 wpm
Rayner et al., Psychological Science, 2006
![Page 78: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/78.jpg)
Condition Example Sentence Reading
Speed
Normal The boy could not solve the problem so he asked for help. 255 wpm
Internal letters The boy cuold not slove the probelm so he aksed for help. 227 wpm
Final letters The boy coudl not solev the problme so he askde for help. 189 wpm
Beginning letters The boy oculd not oslve the rpoblem so he saked for help. 163 wpm
Rayner et al., Psychological Science, 2006
![Page 79: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/79.jpg)
Condition Example Sentence Reading
Speed
Normal The boy could not solve the problem so he asked for help. 255 wpm
Internal letters The boy cuold not slove the probelm so he aksed for help. 227 wpm
Final letters The boy coudl not solev the problme so he askde for help. 189 wpm
Beginning letters The boy oculd not oslve the rpoblem so he saked for help. 163 wpm
Rayner et al., Psychological Science, 2006
Still, study only looked at letter transpositions of a
single position. See:
![Page 80: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/80.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
![Page 81: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/81.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
![Page 82: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/82.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
“From your confessor, lawyer and physician,
hide not your case on no condition.”
- John Harington
![Page 83: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/83.jpg)
Kathleen Tinkel, Adobe Magazine, 1996
We recognize letters more by their top halves than bottom halves
Serifs appear to aid in the recognition process
“From your confessor, lawyer and physician,
hide not your case on no condition.”
- John Harington
![Page 84: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/84.jpg)
weight font
![Page 85: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/85.jpg)
![Page 86: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/86.jpg)
fonts investigating web
![Page 87: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/87.jpg)
![Page 89: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/89.jpg)
resources font
![Page 90: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/90.jpg)
![Page 91: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/91.jpg)
![Page 92: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/92.jpg)
![Page 93: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/93.jpg)
![Page 94: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/94.jpg)
![Page 95: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/95.jpg)
![Page 96: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/96.jpg)
![Page 97: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/97.jpg)
![Page 99: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/99.jpg)
midterm the
![Page 100: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/100.jpg)
1
11
6
11
9
1
0 0
2
4
6
8
10
12
0.4-0.5 0.5-0.6 0.6-0.7 0.7-0.8 0.8-0.9 0.9-1 1-1.1
Midterm Grades Without Bonus
Total 120
Average 82.4
Average % 68.70%
Median 85
Median % 70.83%
![Page 101: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/101.jpg)
0
7
8
9 9
5
1
0
1
2
3
4
5
6
7
8
9
10
0.4-0.5 0.5-0.6 0.6-0.7 0.7-0.8 0.8-0.9 0.9-1 1-1.1
Midterm Grades With Bonus
Total 120
Average 89.7
Average % 74.73%
Median 92
Median % 76.67%
![Page 102: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/102.jpg)
0
7 8
9 9
5
1
0
2
4
6
8
10
12Midterm Grades With Bonus
Total 120
Average 89.7
Average % 74.73%
Median 92
Median % 76.67%
1
11
6
11
9
1 0
0
2
4
6
8
10
12
Midterm Grades Without Bonus
Total 120
Average 82.4
Average % 68.70%
Median 85
Median % 70.83%
![Page 103: CMSC434 Week 12 | Lecture 23 | Nov 19, 2013 Visual Design ...Slide from Ellen Lupton, Thinking with Type UNITED NATIONS’ OFFICE ON DRUGS AND CRIME (UNODC) Maps, 2009. Design: Harry](https://reader030.fdocuments.in/reader030/viewer/2022040119/5e666779f1a24675b109f3ac/html5/thumbnails/103.jpg)