index.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="robots" content="noindex,nofollow">
  6. <title>Gwd50 Google Apps &#153;</title>
  7. <meta name="description" content="HTML Presentation">
  8. <meta name="author" content="David A. Windham">
  9. <meta name="apple-mobile-web-app-capable" content="yes" />
  10. <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
  11. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  12. <link rel="shortcut icon" href="apps/favicon.ico" type="image/x-icon"/>
  13. <link rel="stylesheet" href="apps/css/reveal.min.css">
  14. <link rel="stylesheet" href="apps/css/daw.css" id="theme">
  15. <!--[if lt IE 9]>
  16. <script src="js/html5shiv.js"></script>
  17. <![endif]-->
  18. </head>
  19. <body>
  20. <div class="reveal">
  21. <div class="slides">
  22. <section>
  23. <section data-background="#000000">
  24. <h1 class="colors"><span class="g">G</span><span class="o">o</span><span class="o2">o</span><span class="g2">g</span><span class="l">l</span><span class="e">e</span> <small>Apps &#153;</small></h1>
  25. <h4 style="color:#777">Special Education Edition</h4>
  26. <h3 style="color:#777">Instructional Services Center</h3>
  27. <h4 style="color:#777">Greenwood School District 50</h4>
  28. <br />
  29. <p><small><a href="http://davidawindham.com">David A. Windham</a> / <a href="http://twitter.com/windhamd_gwd">@windhamdavid</a></small></p>
  30. <p><small>Data Manager ISC | gwd50.org | 864-941-5485</small></p>
  31. <p class="footnotes">keys ( arrows | n:next | p:previous | esc:all )</p>
  32. <p class="footnotes">Google and the Google logos are registered trademarks of Google Inc., used with permission.</p>
  33. </section>
  34. </section>
  35. <section>
  36. <section data-transition="slide" data-background="#008F0B" data-background-transition="slide">
  37. <h2 class="light">What are Google <small>Apps &#153;</small> ?</h2>
  38. <p class="light">
  39. They are a suite of <a href="https://en.wikipedia.org/wiki/Web_application" class="light" target="_blank">web applications</a> made available as <a href="https://en.wikipedia.org/wiki/Cloud_computing" class="light" target="_blank">cloud</a> hosted <a href="https://en.wikipedia.org/wiki/Software_as_a_service" class="light" target="_blank">software as a service</a> that can be administered for a group of users at a particular <a href="http://en.wikipedia.org/wiki/Domain_name" class="light" target="_blank">domain name</a>.
  40. </p>
  41. <aside class="notes">
  42. I have nine active google accounts. I’m support the products. Solid, secure, easy to use, well documented.
  43. </aside>
  44. </section>
  45. <section data-background="apps/img/apps-all.png">
  46. <div class="bg-block">
  47. <h4 style="bg-block">AdSense, Alerts, Analytics, Blogger, Books, Calendar, Chrome Sync, Contacts, Custom Search, Docs, FeedBurner, Finance, Friend Connect, Fusion Tables, Gmail, Google+, Groups, Location History, Maps, Merchant Center, Moderator, News, Orkut, Picasa, Play Music, Profile, Sites, Talk, Task, Voice, Wallet / Checkout, Web History, Webmaster Tools, &amp; YouTube</h4>
  48. <p class="footnotes">Google and the Google logo are registered trademarks of Google Inc., used with permission.</p>
  49. </div>
  50. </section>
  51. <section>
  52. <img src="apps/img/gapps.png" class="noborder"/>
  53. </section>
  54. <section>
  55. <p>And countless other third party applications via the <a href="https://www.google.com/enterprise/marketplace/">Apps Marketplace</a></p>
  56. </section>
  57. </section>
  58. <section>
  59. <section data-transition="fade" data-background-transition="fade" data-background="#0865A6">
  60. <img src="apps/img/apps.png" class="noborder"/>
  61. <h3 class="light">The Basics</h3>
  62. <p class="fade-in"><span class="highlight">&nbsp;</span></p>
  63. <aside class="notes">
  64. I'm only going to cover three
  65. </aside>
  66. </section>
  67. <section data-transition="fade" data-background-transition="fade" data-background="#ffffff">
  68. <img src="apps/img/apps2.png"class="noborder"/>
  69. <h3 class="fragment">Mail, Calendar, &amp; Drive</h3>
  70. <p class="fragment fade-in"><span class="highlight">Just some tips and tricks</span></p>
  71. </section>
  72. <section>
  73. <h4>Documentation</h4>
  74. <p><a href="http://learn.googleapps.com/">http://learn.googleapps.com/</a></p>
  75. </section>
  76. <section>
  77. <h4>Google Support</h4>
  78. <p><a href="https://support.google.com/">https://support.google.com/</a></p>
  79. </section>
  80. </section>
  81. <section>
  82. <section data-transition="linear" data-background="#70089C" data-background-transition="slide">
  83. <img src="apps/img/search.png" width="128" class="noborder"/>
  84. <h2 class="light">Search</h2>
  85. <aside class="notes">
  86. Google's most powerful tool is search
  87. </aside>
  88. </section>
  89. <section>
  90. <h2>Search is your Friend</h2>
  91. </section>
  92. <section>
  93. <img src="apps/img/search.gif" width="640" class="noborder animated-gif"/>
  94. </section>
  95. <section>
  96. <p><a href="http://www.google.com/intl/ALL/insidesearch/tipstricks/all.html">Search Tips from Google</a></p>
  97. <p><a href="http://www.google.com/advanced_search">Advanced Search</a></p>
  98. </section>
  99. </section>
  100. <section>
  101. <section data-transition="linear" data-background="#9C2500" data-background-transition="slide">
  102. <img src="apps/img/mail.png" class="noborder"/>
  103. <h2 class="light">Mail</h2>
  104. </section>
  105. <section>
  106. <img src="apps/img/search-mail.gif" width="640" class="noborder animated-gif"/>
  107. <p>Search Operators</p>
  108. <p><small>subject:IEP is:starred from:teacher@gwd50.com -work deadline OR “due date” is:unread</small></p>
  109. </section>
  110. <section>
  111. <p>Settings</p>
  112. <img src="apps/img/mail-settings.png" width="100%" class="noborder"/>
  113. </section>
  114. <section>
  115. <p>Categories, Stars, Labels &amp; Filters</p>
  116. <img src="apps/img/mail-labels.png" width="100%" class="noborder"/>
  117. </section>
  118. <section>
  119. <p>Receipt</p>
  120. <img src="apps/img/mail-read.png" width="100%" class="noborder"/>
  121. </section>
  122. <section>
  123. <p>Autoresponders</p>
  124. <img src="apps/img/mail-respond.png" width="100%" class="noborder"/>
  125. </section>
  126. <section>
  127. <p>Contacts &amp; Groups</p>
  128. <img src="apps/img/mail-contact.png" width="100%" class="noborder"/>
  129. </section>
  130. <section>
  131. <h4>Gmail Support</h4>
  132. <p><a href="https://support.google.com/mail/">https://support.google.com/mail/</a></p>
  133. </section>
  134. <section data-transition="zoom">
  135. <p>ProTip: Meaningful subject lines to make archiving and searching easy for others. </p>
  136. </section>
  137. </section>
  138. <section>
  139. <section data-transition="linear" data-background="#A68B08" data-background-transition="slide">
  140. <img src="apps/img/calendar.png" width="128" class="noborder"/>
  141. <h2 class="light">Calendar</h2>
  142. <aside class="notes">
  143. Who keeps a paper calendar? Who uses Google Calendar?
  144. </aside>
  145. </section>
  146. <section>
  147. <p>Settings</p>
  148. <img src="apps/img/cal-full.png" width="800" class="noborder"/>
  149. </section>
  150. <section>
  151. <p>Events</p>
  152. <img src="apps/img/cal-event.png" class="noborder"/>
  153. </section>
  154. <section>
  155. <p>Invites</p>
  156. <img src="apps/img/cal-invite.png" class="noborder"/>
  157. </section>
  158. <section>
  159. <p>Sharing</p>
  160. <img src="apps/img/cal-share.png" width="700" class="noborder"/>
  161. </section>
  162. <section>
  163. <img src="apps/img/cal-shared.png" class="noborder"/>
  164. </section>
  165. <section>
  166. <p>Sync</p>
  167. <img src="apps/img/cal-sync.png" width="300" class="noborder"/>
  168. </section>
  169. <section>
  170. <p>Reminders</p>
  171. <img src="apps/img/cal-remind.png" class="noborder"/>
  172. </section>
  173. <section data-transition="zoom">
  174. <p>ProTip: Don't Share your private events</p>
  175. <p>Case: <a href="http://www.ed.gov/policy/gen/guid/fpco/ferpa/index.html" target="_blank">FERPA</a> - No Student Names</p>
  176. </section>
  177. </section>
  178. <section>
  179. <section data-transition="linear" data-background="#008F0B" data-background-transition="slide">
  180. <img src="apps/img/drive.png" class="noborder"/>
  181. <h2 class="light">Drive</h2>
  182. </section>
  183. <section id="transitions" data-background="apps/img/drive-all.png">
  184. <br /><br />
  185. <p><small>
  186. <a class="fragment roll-in" href="https://support.google.com/drive/topic/2811739">Docs</a> &nbsp;
  187. <a class="fragment roll-in" href="">Slides</a> &nbsp;
  188. <a class="fragment roll-in" href="">Sheets</a> &nbsp;
  189. <a class="fragment roll-in" href="">Forms</a> &nbsp;
  190. <a class="fragment roll-in" href="">Drawings</a> &nbsp;
  191. <a class="fragment roll-in" href="">Scripts</a> &nbsp;
  192. <a class="fragment roll-in" href="">Tables</a> &nbsp;
  193. <a class="fragment roll-in" href="">Folders</a> &nbsp;
  194. </small></p>
  195. </section>
  196. <section>
  197. <p>Sharing</p>
  198. <img src="apps/img/drive-share.gif" class="noborder animated-gif"/>
  199. <aside class="notes">
  200. Take precaution when sharing folders
  201. </aside>
  202. </section>
  203. <section>
  204. <p>Creating &amp; Uploading</p>
  205. <img src="apps/img/drive-create.png" class="noborder"/>
  206. </section>
  207. <section>
  208. <p>Converting</p>
  209. <img src="apps/img/drive-convert.png" class="noborder"/>
  210. </section>
  211. <section>
  212. <p>Exporting</p>
  213. <img src="apps/img/drive-export.png" class="noborder"/>
  214. </section>
  215. <section>
  216. <p>Google Drive for Desktop &amp; Mobile</p>
  217. <img src="apps/img/drive-dsync.png" width="500" class="noborder"/>
  218. </section>
  219. <section>
  220. <img src="apps/img/drive-isync.png" width="500" class="noborder"/>
  221. <p><small>Available on Apple iOS &amp; Google Android</small></p>
  222. </section>
  223. <section>
  224. <img src="apps/img/drive-sync.png" class="noborder"/>
  225. <p><small>Drag and drop file sync</small></p>
  226. <aside class="notes">
  227. Take precaution when sharing folders and files
  228. </aside>
  229. </section>
  230. <section data-transition="zoom">
  231. <p>ProTip: Use meaningful titles and dates in file names.</p>
  232. <p>Case: Grocery list</p>
  233. </section>
  234. </section>
  235. <section>
  236. <section>
  237. <div id="heart">&nbsp;</div>
  238. <h2>Thank You</h2>
  239. <small>
  240. <p>the presentation is online @<br /><a href="http://davidawindham.com/gwd">http://davidawindham.com/gwd</a></p>
  241. <p>the source code is @<br /> <a href="https://github.com/windhamdavid/gwd-gapps">https://github.com/windhamdavid/gwd</a></p>
  242. <p>and the files are shared on<br /> <a href="https://drive.google.com/a/gwd50.org/folderview?id=0ByRlMcouKeUhRlY1SXczbHZaeE0">Google Drive</a></p><br />
  243. </small>
  244. <br />
  245. <p class="footnotes">David A. Windham | Data Manager ISC | gwd50.org | 864-941-5485</p>
  246. </section>
  247. <section data-background="apps/img/pattern_154.gif" data-background-repeat="repeat" data-background-size="56px">
  248. <div class="bg-block">
  249. <br />
  250. <h4 style="margin-bottom:0px"><span class="highlight">Bibliography</span></h4>
  251. <small>
  252. <p class="footnotes">"Google Help." Google Help. Google Inc. , n.d. Web. 9 Feb. 2014.<br /><a href="https://support.google.com/">https://support.google.com/</a>.</p>
  253. <p class="footnotes">"Google Apps Learning Center v4."Google Apps Learning Center v4. N.p., n.d. Web. 9 Feb. 2014. <br /><a href="http://learn.googleapps.com/">http://learn.googleapps.com/</a>.</p>
  254. <p class="footnotes">"Apps for Education." Products€“ Google. N.p., n.d. Web. 9 Feb. 2014. <br /><a href="http://www.google.com/enterprise/apps/education/products.html">http://www.google.com/enterprise/apps/education/products.html.</a></p>
  255. <br />
  256. <p class="footnotes">Made with: HTML, CSS, JavaScript, Ubuntu, Node.js, TextMate, LiceCap, Adobe Illustrator/Photoshop, <br />Apple OSX, Apache, &amp; Google { Docs, Forms, Sheets, Sites, Scripts, &amp; Chrome }.</p>
  257. <p class="footnotes">Thanks to Hakim El Hattab &amp; John Polocek who wrote 95% of the Javascript.<br />
  258. <p class="footnotes">Fonts: Open Sans &amp; Quicksand by Steve Matteson &amp; Andres Paglinawan.</p>
  259. <p class="footnotes">Hexadecimal color scheme:<br />
  260. Normal - 008F0B - Green | A68B08 - Yellow | 9C2500 - Red | 70089C - Purple | 0865A6 - Blue<br />
  261. Inverted - FF70F4 - Pink | 5974F7 - Blue | 63DAFF - Teal | 8FF763 - Green | F79A59 - Orange</p>
  262. </small>
  263. <p class="footnotes"><span class="fragment hightlight-blue"><a href="http://en.wikipedia.org/wiki/Don't_be_evil">http://en.wikipedia.org/wiki/Don't_be_evil</a></span></p>
  264. <p class="footnotes"><a rel="license" href="http://creativecommons.org/licenses/by/4.0/deed.en_US"><img alt="Creative Commons License" style="margin:0; border-width:0" src="http://i.creativecommons.org/l/by/4.0/80x15.png" /></a><br />This <span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/InteractiveResource" rel="dct:type">work</span> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/deed.en_US">Creative Commons Attribution 4.0 International License</a>.<br />
  265. by <a xmlns:cc="http://creativecommons.org/ns#" href="http://davidawindham.com/gwd" property="cc:attributionName" rel="cc:attributionURL">David A. Windham</a> / <a href="http://twitter.com/windhamd_gwd">@windhamdavid</a><br /><br /></p>
  266. </div>
  267. </section>
  268. <section data-background-transition="fade" data-background="#ffffff">
  269. <a href="#"><img src="apps/img/iphone.png" style="box-shadow:none;" class="noborder"/></a>
  270. </section>
  271. </section>
  272. </div>
  273. </div>
  274. <script src="apps/js/head.min.js"></script>
  275. <script src="apps/js/reveal.min.js"></script>
  276. <script>
  277. Reveal.initialize({
  278. controls: false,
  279. progress: true,
  280. history: true,
  281. center: true,
  282. rollingLinks: true,
  283. theme: Reveal.getQueryHash().theme,
  284. transition: Reveal.getQueryHash().transition || 'default', // cube/page/concave/zoom/linear/fade/none
  285. dependencies: [
  286. { src: 'apps/js/classList.js', condition: function() { return !document.body.classList; } },
  287. { src: 'apps/plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
  288. { src: 'apps/plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
  289. { src: 'apps/plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }
  290. ]
  291. });
  292. </script>
  293. <script src="/socket.io/socket.io.js"></script>
  294. <script src="/controldeck-slides.js"></script>
  295. </body>
  296. </html>