'

Designing for a Small Screen: Mobile

Понравилась презентация – покажи это...





Слайд 0

DESIGNING FOR MOBILE Designing for a small screen Design Consultant and Researcher Sara Quinn e-mail: saraquinnmedia@gmail.com Twitter: @saraquinn 727.366.0128


Слайд 1

Nothing makes people reach for the “close tab” button faster than a cluttered screen.


Слайд 2


Слайд 3

Keep it simple.


Слайд 4


Слайд 5


Слайд 6

Keep it simple


Слайд 7

Keep it simple


Слайд 8

Keep it simple Too many choices


Слайд 9

Keep it simple Proportion and scale would be out of whack


Слайд 10

Keep it simple Type and images would be too small


Слайд 11

Keep it simple Refine, focus, distill


Слайд 12

Keep it simple Refine, focus, distill


Слайд 13

Keep it simple


Слайд 14

Keep it simple Design for the given space


Слайд 15

Use white space


Слайд 16

Use white space It draws the eye.


Слайд 17

Use white space Use it to guide the user.


Слайд 18

Use white space Use it to guide the user.


Слайд 19


Слайд 20


Слайд 21


Слайд 22


Слайд 23


Слайд 24


Слайд 25


Слайд 26

Too much!


Слайд 27

Find focus.


Слайд 28

Design for fingers


Слайд 29

Design for fingers Click targets should be a minimum of 30-40 pixels.


Слайд 30


Слайд 31


Слайд 32

At least 30-40 pixels.


Слайд 33

Use white space


Слайд 34

Use white space


Слайд 35

Use white space Lessen the frustration of clicking on the wrong thing by accident.


Слайд 36

Design for fingers Can you navigate with one thumb?


Слайд 37

Design for fingers Best mobile design works fine with one hand.


Слайд 38

Design for fingers Avoid pinching to zoom.


Слайд 39


Слайд 40


Слайд 41

Focus content


Слайд 42


Слайд 43


Слайд 44

Find focus.


Слайд 45

Keeping it simple Using white space Designing for fingers Focusing content


Слайд 46

Keeping it simple Using white space Designing for fingers Focusing content


Слайд 47

Keeping it simple Using white space Designing for fingers Focusing content


Слайд 48

Keeping it simple Using white space Designing for fingers Focusing content


Слайд 49

NEXT VIDEO: TYPOGRAPHY AND GRID Size + space = readability Keep font choices simple Single column, scrolling Immersive, longform reading Responsive design


Слайд 50

NEXT VIDEO: TYPOGRAPHY AND GRID Size + space = readability Keep font choices simple Single column, scrolling Immersive, longform reading Responsive design


Слайд 51

NEXT VIDEO: TYPOGRAPHY AND GRID Size + space = readability Keep font choices simple Single column, scrolling Immersive, longform reading Responsive design


Слайд 52

NEXT VIDEO: TYPOGRAPHY AND GRID Size + space = readability Keep font choices simple Single column, scrolling Immersive, longform reading Responsive design


Слайд 53

NEXT VIDEO: TYPOGRAPHY AND GRID Size + space = readability Keep font choices simple Single column, scrolling Immersive, longform reading Responsive design


Слайд 54

Design Consultant and Researcher Sara Quinn e-mail: saraquinnmedia@gmail.com Twitter: @saraquinn 727.366.0128


Слайд 55


×

HTML:





Ссылка: