Everand Logo

Welcome to Everand!

  • Discover millions of ebooks, audiobooks, and so much more with a free trial

    Only $11.99/month after trial. Cancel anytime.

    Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours
    Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours
    Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours
    Ebook170 pages51 minutes

    Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours

    By Samir Dash

    2/5

    ()

    Read preview

    About this ebook

    A quick 4 hours guide for developers, web designer and those having basic knowledge in HTML, CSS, Java Script and jQuery to learn using Adobe Edge Preview 3 to develop web interactive and web applications.
    The book covers the following topics:
    Before We Start!
    What is Adobe Edge?
    What to Expect from this Book
    Hour 1: Overview of Edge Runtime
    Edge Composition
    Edge Symbol
    Edge Action
    Events
    HTML page DOM specific Events
    Edge Elements DOM specific Events
    Element level Touch Interaction specific
    Triggers
    Hour 2: Adding Basic Actions to Your Animation - Playing with Triggers
    Where to Add Triggers in the Edge IDE ?
    Different Type of Triggers
    “Earth” – An Example for Basic Playback Control
    “Day and Night” – An Example for Changing the content of an Element in Runtime
    Where all Triggers are Saved When We Type into the Edge Code Editor?
    Reference to different Elements and their properties while writing Triggers
    Using Lookup Elements (Lookup Selectors) and jQuery API
    Using Some Other Useful Edge Runtime APIs
    “Progress Bar” Example – Using what we have learned about referencing Elements
    Hour 3: Edge Touch API and Gestures for iPhones, iPads and Android devices - Thinking Beyond Desktop & Mouse
    Touch Events supported on iPhones, iPads and Android devices
    Difference Between Touch and Mouse Events
    The WebKit Event Object for touch events
    Note: Setup Environment to Test HTML Pages on Your Devices
    Gestures
    Adobe Edge and jQuery Mobile Events
    Using Touch Events in Edge Compositions
    Adding Touch Events to Edge Element’s Action
    Adding Touch Events to the DOM Elements Associated with Edge Element
    Adding Gesture Events to Compositions in Edge IDE
    Making Edge Compositions Compatible for Both Mouse and Touch Events
    Example: Cross-platform Slider
    Prevent scrolling
    Prevent Default HTML Resize
    Hour 4: Complex Interactions between Multiple Compositions and Development and Usage of Reusable Compositions
    Wheel: Example of a nested Element Animation
    Adding Interaction to Control the Animation of the Nested Element
    Benefits of Nested Animation
    Reusability Approach of Development in Edge
    Example: Building a Reusable Slider Component
    Example: Product Selector – How to Use of the Reusable Edge Composition Multiple Times in another Edge Composition with Different Configurations
    Going Forward
    Next Steps
    Source Files for this Book

    LanguageEnglish
    PublisherpatternGraphic DigiBooks
    Release dateDec 16, 2011
    ISBN9781466079724
    Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours
    Author

    Samir Dash

    Samir Dash is a techie and an entrepreneur from Rourkela, Orissa. Samir authored a number of books on critical theory and usability, namely "Beginners Guide To Modern Critical Theory" and "UX Simplified".

    Read more from Samir Dash

    Related to Quick and Dirty Guide for Developers

    Related ebooks

    Applications & Software For You

    View More
    View More

    Related podcast episodes

    Related articles

    • Article

      The Cost Of Creativity Crisis

      Oct 6, 2022

      With inflation at a forty-year high, we’re surrounded by rising prices. And when it comes to the business of writing, the cost of creativity is increasing, too. There’s also a growing trend in the software industry to move away from one-time purchase

      6 min read

    • Article

      Ditch the MONTHLY PAYMENTS

      Dec 9, 2021

      Ditch the MONTHLY PAYMENTS
      7 min read

    • Article

      Computer-aided Design

      Jul 25, 2023

      Computer-aided Design
      13 min read

    • Article

      It’s Collabora time!

      May 2, 2023

      It’s Collabora time!
      8 min read

    • Article

      Overview

      Aug 27, 2019

      Overview
      3 min read

    • Article

      The Verdict

      Aug 27, 2019

      The Verdict
      2 min read

    • Article

      Discover Easy-to -build Desktop Apps

      Oct 22, 2019

      Electron is actually a browser packaged with node.js and a few APIs. Because it’s built on top of the Chromium browser, you have everything available from there to add to your application. GitHub developed it as part of the Atom editor; it was open-s

      7 min read

    • Article

      Visual Studio Code 1.74

      Mar 7, 2023

      Visual Studio Code 1.74
      2 min read

    • Article

      HotPicks

      Jul 28, 2020

      HotPicks
      13 min read

    • Article

      Assessing Ease Of Use

      Jul 28, 2020

      Assessing Ease Of Use
      3 min read

    • Article

      Top Tools For Remote Working

      Apr 28, 2020

      Top Tools For Remote Working
      1 min read

    • Article

      Edge on Linux

      Dec 14, 2021

      Edge on Linux
      2 min read

    • Article

      HotPicks

      Jun 30, 2020

      HotPicks
      13 min read

    • Article

      HotPicks

      Dec 17, 2019

      HotPicks
      12 min read

    • Article

      Hot Picks

      Aug 22, 2023

      Hot Picks
      12 min read

    • Article

      Affinity Publisher

      May 21, 2020

      Affinity Publisher
      1 min read

    • Article

      HotPicks

      Sep 24, 2019

      HotPicks
      12 min read

    Related categories

    Reviews for Quick and Dirty Guide for Developers

    2/5

    1 rating0 reviews

    What did you think?

    Tap to rate

    Review must be at least 10 words

      Book preview

      Quick and Dirty Guide for Developers - Samir Dash

      Quick and Dirty Guide for Developers:

      Adobe Edge Preview 3 in 4 Hours

      Samir Dash

      www.patterngraphic.com

      Smashwords Edition

      Quick and Dirty Guide for Developers: Adobe Edge Preview 3 in 4 Hours

      By Samir Dash

      Visit author’s homepage at samirshomepage.wordpress.com

      Copyright © Samir Dash, 2011

      All rights reserved.

      Digital Editions rights owned by patternGraphic, India.

      http://patterngraphic.com

      First Edition : 2011

      Current Samshwords Edition: 2011

      Smashwords Edition, License Notes

      This ebook is licensed for your personal enjoyment only. This ebook may not be re-sold or given away to other people. If you would like to share this book with another person, please purchase an additional copy for each recipient. If you’re reading this book and did not purchase it, or it was not purchased for your use only, then please return to Smashwords.com or the publisher of this book at patternGraphic.com and purchase your own copy. Thank you for respecting the hard work of this author.

      PG2011B4

      ISBN: 978-1-4660-7972-4

      Table of Contents

      Before We Start!

      What is Adobe Edge?

      What to Expect from this Book

      Hour 1: Overview of Edge Runtime

      Edge Composition

      Edge Symbol

      Edge Action

      Events

      HTML page DOM specific Events

      Edge Elements DOM specific Events

      Element level Touch Interaction specific

      Triggers

      Hour 2: Adding Basic Actions to Your Animation - Playing with Triggers

      Where to Add Triggers in the Edge IDE ?

      Different Type of Triggers

      Earth – An Example for Basic Playback Control

      Day and Night – An Example for Changing the content of an Element in Runtime

      Where all Triggers are Saved When We Type into the Edge Code Editor?

      Reference to different Elements and their properties while writing Triggers

      Using Lookup Elements (Lookup Selectors) and jQuery API

      Using Some Other Useful Edge Runtime APIs

      Progress Bar Example – Using what we have learned about referencing Elements

      Hour 3: Edge Touch API and Gestures for iPhones, iPads and Android devices - Thinking Beyond Desktop & Mouse

      Touch Events supported on iPhones, iPads and Android devices

      Difference Between Touch and Mouse Events

      The WebKit Event Object for Touch Events

      Note: Setup Environment to Test HTML Pages on Your Devices

      Gestures

      Adobe Edge and jQuery Mobile Events

      Using Touch Events in Edge Compositions

      Adding Touch Events to Edge Element’s Action

      Adding Touch Events to the DOM Elements Associated with Edge Element

      Adding Gesture Events to Compositions in Edge IDE

      Making Edge Compositions Compatible for Both Mouse and Touch Events

      Example: Cross-platform Slider

      Prevent Scrolling

      Prevent Default HTML Resize

      Hour 4: Complex Interactions between Multiple Compositions and Development and Usage of Reusable Compositions

      Wheel: Example of a nested Element Animation

      Adding Interaction to Control the Animation of the Nested Element

      Benefits of Nested Animation

      Reusability Approach of Development in Edge

      Example: Building a Reusable Slider Component

      Example: Product Selector – How to Use of the Reusable Edge Composition Multiple Times in another Edge Composition with Different Configurations

      Going Forward

      Next Steps

      Source Files for this Book

      Before We Start!

      What is Adobe Edge?

      Everyone is almost sure today that HTML5 along with CSS3 and JavaScript is the future of web animation and interactivity. Almost the generic view has been established that this is the ultimate Flash killer technology which will replace all Flash animation and interactive on the web in coming time. Howebver, for many designers and early developers the main road block to use HTML5 with JavaScript and CSS3 lies in the fact that as of today there is no IDE(Integrated Development Environment) or Design and animation tool as good as Adobe Flash Professional that is designer friendly enough to allow designers to create animations in a high level environment with timelines, drawing tools and relatively easy control of animation effects. Most of the HTML5 developers today are working directly with Java Script, SVG, CSS and other technologies and for such reason it is not easy for any designer to immediately start with HTML5 based web animation as it requires for them a long learning curve for different technology which is not typically expected in a designer's domain. To bridge this gap between the developer-designer centric approach to web animation using HTML5 , CSS3 and JavaScript, Adobe is currently working on a new revolutionary tool called Adobe Edge that provides an IDE/tool and a runtime API to add Java Script(jQuery) specific codes to create rich interactive.

      The user interface of Adobe Edge is familiar to anyone who's used Flash or After Effects. It has a timeline allowing scrubbing and jumping to any point in an animation, properties panels to adjust different properties of elements, and a panel to

      Enjoying the preview?
      Page 1 of 1