Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Edge Tools and Services

486 views

Published on

  • Be the first to comment

  • Be the first to like this

Edge Tools and Services

  1. 1. CREATE THE WEB Educational Tour 2013 html.adobe.com #CreateTheWeb
  2. 2. Who I am Mihai Corlan / Adobe Educational Evangelist / @mcorlan© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  3. 3. Transylvania© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  4. 4. No Vampires!© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  5. 5. We <3 …© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  6. 6. #CreateTheWeb @mcorlan© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  7. 7. Who are you?© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  8. 8. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  9. 9. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  10. 10. There are still things that can’t be done easily today!© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  11. 11. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  12. 12. Areas of Focus Magazine-style Cinematic Advanced Advanced Effects Graphical Layout Effects CSS Regions CSS Custom Filters CSS Blending CSS Exclusions & Shapes CSS Compositing© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  13. 13. http://html.adobe.com/webstandards/© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  14. 14. Tools© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  15. 15. The Modern Web Needs Modern Tools© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  16. 16. Adobe Edge Tools & Services•  Optimized for creating mobile-ready web content and apps•  Focused on a specific task•  Improve productivity without hiding the underlying web technologies© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  17. 17. Adobe Edge Tools & Services Adobe Edge Web Fonts Get started with free web fonts© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  18. 18. Fonts on Web used to be: Arial Verdana Times New Roman Comic Sans :D …© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  19. 19. Adobe Edge Tools & Services TypeKit High quality fonts for the web© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  20. 20. Open Source Fonts from Adobe Source Sans Pro – great font for UI Source Code Pro – great font for code https://github.com/adobe/Source-Code-Pro© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  21. 21. Source Sans Pro A G M S Y a g m s y 1 4 7 B H N T Z b h n t z 2 5 8 C I O U c i o u 3 6 9 D J P V d j p v 0 E K Q W e k q w F L R X f l r x© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 21
  22. 22. Source Code Pro A G M SY a g m sy 147 B H N TZ b h n tz 258 C I O U c i o u 369 D J P V d j p v 0 E K Q W e k q w F L R X f l r x© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 22
  23. 23. Source Code Pro A G M SY a g m sy 147 B H N TZ b h n tz 258 C I O U c i o u 369 D J P V d j p v 0 E K Q W e k q w F L R X f l r x© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 23
  24. 24. Source Code Pro A G M SY a g m sy 147 B H N TZ b h n tz 258 C I O U c i o u 369 D J P V d j p v 0 E K Q W e k q w F L R X f l r x© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 24
  25. 25. Source Code Pro A G M SY a g m sy 147 B H N TZ b h n tz 258 C I O U c i o u 369 D J P V d j p v 0 E K Q W e k q w F L R X f l r x© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 25
  26. 26. Source Code Pro A G M SY a g m sy 1 4 7 B H N TZ b h n tz 2 5 8 C I O U c i o u 369 D J P V d j p v https://github.com/adobe/Source-Code-Pro 0 E K Q W e k q w F L R X f l r x© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 26
  27. 27. Adobe Edge Tools & Services Adobe Edge Reflow Design the responsive web© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  28. 28. Ethan Marcotte© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  29. 29. Coining the term “Responsive Web Design” May 2010 June 2011© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  30. 30. Responsive Web Design building blocks Fluid & Flexible Media Flexible Grid Images Queries© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  31. 31. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  32. 32. Adobe Edge Tools & Services Adobe Edge Animate Animate the Web© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  33. 33. Animations on web© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  34. 34. Adobe Edge Tools & Services Adobe Edge Inspect Preview the web© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  35. 35. Adobe Edge Tools & Services PhoneGap Build mobile apps with web technologies© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  36. 36. Why would you use PhoneGap? §  Write once, run everywhere §  Native Installers -> Application Stores §  Use standard web technologies© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. #CreateTheWeb
  37. 37. PhoneGap could be your best friend if §  You want to target multiple mobile platforms §  You know HTML/JavaScript/CSS §  Extend existing in-browser apps with native features §  Data-centric apps, social networking, simple games© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. #CreateTheWeb
  38. 38. PhoneGap supports 8 platforms© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. #CreateTheWeb
  39. 39. What can you use to build your app?© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. #CreateTheWeb
  40. 40. jQuery Mobile© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  41. 41. Adobe Edge Tools & Services PhoneGap Build Package Mobile Apps in the Cloud© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  42. 42. Using the PhoneGap Build §  http://build.phonegap.com §  Supports: iOS, Android, BlackBerry, WebOS, Windows Phone 7, and Symbian §  It is in beta and it is free; it will always be free for Open Source projects §  You upload your files (index.html, CSS, JS, images) §  Or you provide a Git / SVN link© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. #CreateTheWeb
  43. 43. Adobe Edge Tools & Services Brackets Adobe Edge Code The open source code editor for web Code the web© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  44. 44. Adobe Edge Tools & Services How much $$$? Animate Reflow Inspect PhoneGap Build Brackets/Code FREE FREE FREE FREE FREE© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  45. 45. How do you get them? You sign up for Adobe Creative Cloud© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  46. 46. 30-Day Trial Free Membership© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  47. 47. 19.99 Euro / month + VAT Membership© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  48. 48. Thank you! @mcorlan mcorlan@adobe.com corlan.org #CreateTheWeb Want to have me speaking at you university? Just send me an email and we’ll work on it J Attribution: thanks to dishab and Arcturus© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

×