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