1page.title=Downloads 2page.tags="icons","stencils","colors,"swatches" 3meta.tags="downloads, design, tools" 4section.landing=true 5footer.hide=true 6nonavpage=true 7forcelocalnav=true 8@jd:body 9<p>For icons, sticker sheets, and other downloadable resources, visit the 10<a href="http://www.google.com/design">Design site</a> or use the links below. </p> 11 12 <div class="resource-widget resource-flow-layout col-16" 13 data-query="collection:design/landing/resources" 14 data-cardSizes="6x2" 15 data-maxResults="6"></div> 16</div> 17 18 19<h2 id="Wear">Android Wear Materials</h2> 20 21<div class="cols"> 22 <div class="col-5"> 23 <h4>UI toolkit</h4> 24<p>The toolkit contains detailed specs and measurements of all of the primary Android Wear UI components. Available in PDF and Illustrator formats.</p> 25 26 </div> 27 <div class="col-4"> 28 29 <img src="{@docRoot}design/media/downloads_wear_toolkit.png" width="220"> 30 31 </div> 32 <div class="col-4"> 33 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear Toolkit AI');" 34 href="{@docRoot}downloads/design/Android_Wear_Toolkit_371.ai">Adobe® Illustrator® Toolkit</a> 35 36 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear Toolkit PDF');" 37 href="{@docRoot}downloads/design/Android_Wear_Toolkit_371.pdf">PDF Toolkit</a> 38 </div> 39</div> 40 41 42<div class="cols"> 43 <div class="col-5"> 44 <h4>Sample user flow patterns</h4> 45<p>Examples of how to chain together simple Android Wear UI components into common user flow patterns, from simple notifications to complex interactions involving full screen activities. 46</p> 47 </div> 48 <div class="col-4"> 49 50 <img src="{@docRoot}design/media/downloads_wear_flows.png" width="220"> 51 52 </div> 53 <div class="col-4"> 54 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear App Patterns AI');" 55 href="{@docRoot}downloads/design/Android_Wear_Patterns_20140722.ai">Adobe® Illustrator® App Patterns</a> 56 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear App Patterns PDF');" 57 href="{@docRoot}downloads/design/Android_Wear_Patterns_20140722.pdf">PDF App Patterns</a> 58 </div> 59</div> 60 61 62<div class="cols"> 63 <div class="col-5"> 64 <h4>Sample app design mocks</h4> 65<p>Stream cards and UI elements for some example apps in fully editable PSD format. 66</p> 67 68 </div> 69 <div class="col-4"> 70 71 <img src="{@docRoot}design/media/downloads_wear_psds.png" width="220"> 72 73 </div> 74 <div class="col-4"> 75 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear Sample PSD Mocks');" 76 href="{@docRoot}downloads/design/Android_Wear_Sample_Assets.zip">Adobe® Photoshop® mocks</a> 77 </div> 78</div> 79 80 81<div class="cols"> 82 <div class="col-5"> 83 <h4>Watch faces UI toolkit</h4> 84<p>Detailed specifications and measurements for the the background canvas, notification cards, and 85system indicators. 86</p> 87 88 </div> 89 <div class="col-4"> 90 91 <img src="{@docRoot}design/media/downloads_wear_DesignSpec_Icon.png" width="220"> 92 93 </div> 94 <div class="col-4"> 95 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear Watch Face Specifications');" 96 href="{@docRoot}downloads/design/AndroidWear_DesignSpec_11.13.pdf">PDF Toolkit</a> 97 </div> 98</div> 99 100 101<div class="cols"> 102 <div class="col-5"> 103 <h4>Slide watch face</h4> 104<p>Example of a watch face design in AI format. 105</p> 106 107 </div> 108 <div class="col-4"> 109 110 <img src="{@docRoot}design/media/downloads_wear_Slide_Ai_Icon.png" width="150" 111 style="width:150px;margin:0 auto 15px;display:block"> 112 113 </div> 114 <div class="col-4"> 115 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear Watch Face Example');" 116 href="{@docRoot}downloads/design/Slide.ai">Adobe® Illustrator® Design</a> 117 </div> 118</div> 119 120 121<div class="cols"> 122 <div class="col-5"> 123 <h4>Slide watch face specifications</h4> 124<p>Design specifications for the Slide watch face in PSD format. 125</p> 126 127 </div> 128 <div class="col-4"> 129 130 <img src="{@docRoot}design/media/downloads_wear_Slide_Psd_Icon.png" width="150" 131 style="width:150px;margin:0 auto 15px;display:block"> 132 133 </div> 134 <div class="col-4"> 135 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear Watch Face Example Specifications');" 136 href="{@docRoot}downloads/design/Slide.psd">Adobe® Photoshop® Specifications</a> 137 </div> 138</div> 139 140 141<div class="cols"> 142 <div class="col-5"> 143 <h4>Watch face icon example</h4> 144<p>Template for creating watch face icons for the carousel on Android Wear devices. 145</p> 146 147 </div> 148 <div class="col-4"> 149 150 <img src="{@docRoot}design/media/downloads_wear_Slide_IconExample.png" width="150" 151 style="width:150px;margin:0 auto 20px;display:block"> 152 153 </div> 154 <div class="col-4"> 155 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Wear Watch Face Example Specifications');" 156 href="{@docRoot}downloads/design/Slide_IconExample.psd">Adobe® Photoshop® Icon</a> 157 </div> 158</div> 159 160<div class="cols"> 161 <div class="col-5"> 162 <h4>Hardware technical drawings</h4> 163<p>Technical drawings and specifications for the latest Android Wear devices. 164</p> 165 166 </div> 167 <div class="col-4"> 168 169 <img src="{@docRoot}design/media/nemo_preview.png" width="150" 170 style="width:150px;margin:0 auto;display:block"> 171 172 </div> 173 <div class="col-4"> 174 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Hardware Technical Drawings');" 175 href="{@docRoot}downloads/design/AndroidWear_AllGear_TechDrawings&Spec_20151101_square.png"> 176PNG Toolkit (Square)</a> 177 178 <a class="download-button" onClick="ga('send', 'event', 'Design', 'Download', 'Hardware Technical Drawings');" 179 href="{@docRoot}downloads/design/AndroidWear_AllGear_TechDrawings&Spec_20151101_round.png"> 180PNG Toolkit (Round)</a> 181 </div> 182</div>