Embed Size (px)
Citation preview
Kickstarter
a lot has changed
Pebble Visual Language
64 colors
Contrast Especially when involving text
Peb Peb
Contrast Especially when text is involved
vPeb
Contrast Avoid thin lines & light text
v12:3 v12:3
Anti aliasing reduce curves & shallow angles
45° 30° 15°
Anti aliasing reduce curves & shallow angles
2° 2°
Anti aliasing reduce curves & shallow angles
Anti aliasing Use pixelated or angular fonts
animation
Stretch Icon spatial movement
1 2 3
Dot to System level transitions
5:30AM
Timeline Future
Timeline Past
Launcher
Dot to Incoming events
5:30AMNew SMS
Morph Used to reduce movement when changing between similar elements
69°69° 47°
Round
Start & end points
Start & end points Top to bottom, left to right
Start & end points Top to bottom, left to right
Lorem ipsum dolor
sit amet, consectetur
adipisicing elit, sed
do eiusmod tempor
incididunt ut labore
et dolore magna
Start & end points Perfect fit
Lorem ipsum dolor
sit amet, consectetur
adipisicing elit, sed
do eiusmod tempor
incididunt ut labore
et dolore magna
Start & end points
Start & end points Center to perimeter
Lorem ipsum dolor sit
amet, consecte
adipisicing elit, sed do
eiusmod temporalistas
incididunt ut labore et
dolore magna aliqua. Ut
enim ad minim veniam,
Making it work Text and form factor parsing don’t fit
Watch face App Launcher
vvv
Lorem
Ipsum
Dolor
Sit
Watch Smart
vvv
Lorem
Ipsum
Dolor
Sit
Watch Smart
v
v
Lorem ipsum dolor sit
amet, consecte
adipisicing elit, sed do
eiusmod temporalistas
incididunt ut labore et
dolore magna aliqua. Ut
enim ad minim veniam,
Making it work Text and form factor parsing don’t fit
Lorem ipsum dolor sit
amet, consecte
adipisicing elit, sed do
eiusmod temporalistas
incididunt ut labore et
dolore magna aliqua. Ut
enim ad minim veniam,
Making it work center align
Making it work Text flow
amet, consecte
adipisicing elit, sed do
eiusmod temporalistas
incididunt ut labore et
dolore magna
amet, consecte
adipisicing elit, sed do
eiusmod temporalistas
incididunt ut labore et
dolore magna
Making it work Don’t scroll. Paginate
Making it work Centered fixed focus
Making it work Extra info on focus
amet, consecte
eiusmod tempo subheader
dolore magna
Making it work When possible replace unfocused items with icons
eiusmod tempo subheader
Thanks!
