Pixel Perfect Precision™

More documents

Recommendations

Info

Acknowledgements ustwo studios 2013 / PPP There’s a few people out there who I’d like to thank: first of all Shiro, for showing me the true meaning of pixel precision all those years ago; all the designers out there who share their knowledge, such as Teehan +Lax, Marc Edwards, Daniel Cooper, and Tobias Ahlin to name but a few; and most of all I’d like to thank ustwo for letting me indulge my passions and create this handbook! 2
The Essentials ustwo studios 2013 / PPP This first section covers a lot of core principles and topics that apply to all digital design and its relevant tools. For seasoned designers it can act as a refresher for things to look out for and consider, and for those starting out it offers a quick start guide to some of the processes and thinking that we apply to projects. 3
Page 1 and 2: Pixel Perfect Precision Version 2 P
Page 3: Introduction ustwo studios 2013 / P
Page 7 and 8: Sharp Edges ustwo studios 2013 / PP
Page 9 and 10: Consistency ustwo studios 2013 / PP
Page 11 and 12: Accessibility ustwo studios 2013 /
Page 13 and 14: Colour & Shape ustwo studios 2013 /
Page 15 and 16: Typography ustwo studios 2013 / PPP
Page 17 and 18: Organisation ustwo studios 2013 / P
Page 19 and 20: Pixel Perfect Details
Page 21 and 22: Colour Management ustwo studios 201
Page 23 and 24: Text Length ustwo studios 2013 / PP
Page 25 and 26: Aligning Text with Objects ustwo st
Page 27 and 28: Borders   & Corner Radii   Fill
Page 29 and 30: Version Control ustwo studios 2013
Page 31 and 32: Naming   Systems Example ustwo st
Page 33 and 34: Accessibility ustwo studios 2013 /
Page 35 and 36: Clarity A Title That Is Far Too Lon
Page 37 and 38: Clarity   Text to Diagrams ustwo
Page 39 and 40: Title Subtitle OS Lorem ipsum dolor
Page 41 and 42: Navigation   Content Structure us
Page 43 and 44: Navigation   Titles ustwo studios
Page 45 and 46: Navigation   Limit Scrolling to O
Page 47 and 48: Navigation   Labelling ustwo stud
Page 49 and 50: Interaction   Free Text ustwo stu
Page 51 and 52: Interaction ustwo studios 2012 / PP
Page 53 and 54:   Feedback Multi-sensory ustwo st
Page 55 and 56:
Feedback   Error Proximity ustwo
Page 57 and 58:
Lorem ipsum dolor sit amet, consect
Page 59 and 60:
Typography   Formatting ustwo stu
Page 61 and 62:
Typography   Merging Text with Gr
Page 63 and 64:
Colour   Don’t Rely on Colour A
Page 65 and 66:
Colour   Colour Contrast ustwo st
Page 67 and 68:
Colour   ColorAdd ustwo studios 2
Page 69 and 70:
Testing ustwo studios 2013 / PPP Te
Page 71 and 72:
Testing   Sim Daltonism ustwo stu
Page 73 and 74:
Photoshop: Colour Profiles
Page 75 and 76:
Photoshop Colour Settings ustwo stu
Page 77 and 78:
Color Faker ustwo studios 2013 / PP
Page 79 and 80:
Shape Layers ustwo studios 2013 / P
Page 81 and 82:
Shape   Layers Performance ustwo
Page 83 and 84:
Info Panel ustwo studios 2013 / PPP
Page 85 and 86:
Snap to Pixel Grid Actions ustwo st
Page 87 and 88:
Nudging ustwo studios 2013 / PPP If
Page 89 and 90:
Alignment & Spacing ustwo studios 2
Page 91 and 92:
GuideGuide ustwo studios 2013 / PPP
Page 93 and 94:
Live Previewing ustwo studios 2013
Page 95 and 96:
Some Text Object Colours ustwo stud
Page 97 and 98:
Object   Gradients Dither ustwo s
Page 99 and 100:
Scale Layer Effects ustwo studios 2
Page 101 and 102:
Layer Style vs. Vector Strokes ustw
Page 103 and 104:
Complex Vectors ustwo studios 2013
Page 105 and 106:
Blending Modes ustwo studios 2013 /
Page 107 and 108:
Text Alignment ustwo studios 2013 /
Page 109 and 110:
Convert to Paragraph Text ustwo stu
Page 111 and 112:
Leading ustwo studios 2013 / PPP Na
Page 113 and 114:
Lists ustwo studios 2013 / PPP Some
Page 115 and 116:
Photoshop: Organisation
Page 117 and 118:
Some Text Naming Layers ustwo studi
Page 119 and 120:
Search Some Text ustwo studios 2013
Page 121 and 122:
Expanded Layer Effects ustwo studio
Page 123 and 124:
Locked Layers ustwo studios 2013 /
Page 125 and 126:
Photoshop: Export
Page 127 and 128:
Export Scripts ustwo studios 2013 /
Page 129 and 130:
Reducing File Size ustwo studios 20
Page 131 and 132:
Reducing Photoshop File Sizes ustwo
Page 133 and 134:
565   Batch ustwo studios 2013 /
Page 135 and 136:
Strokes No Glow Glow ustwo studios
Page 137 and 138:
Quick Shine ustwo studios 2013 / PP
Page 139 and 140:
Extracting Logos ustwo studios 2013
Page 141 and 142:
Patterns ustwo studios 2013 / PPP A
Page 143 and 144:
Shortcuts   Paths ustwo studios 2
Page 145 and 146:
Shortcuts   Selections & Brushes
Page 147 and 148:
Shortcuts   Layers ustwo studios
Page 149 and 150:
Shortcuts   Keyboard ustwo studio
Page 151 and 152:
Illustrator
Page 153 and 154:
Illustrator Colour Settings ustwo s
Page 155 and 156:
Grids ustwo studios 2013 / PPP Like
Page 157 and 158:
Smart Guides ustwo studios 2013 / P
Page 159 and 160:
Align to Pixel Grid ustwo studios 2
Page 161 and 162:
Preview Blurring ustwo studios 2013
Page 163 and 164:
Appendix
Page 165:
ustwo studios 2013 / PPP Thanks! @p
show all

Pixel Perfect Precision™

Create successful ePaper yourself

Delete template?

Save as template?