B.Y.O.L.: Adobe Edge Animate—Flash-like Interactions for HTML5 Devices Jeff Batt eLearning Brothers Product Development Manager.

Slides:



Advertisements
Similar presentations
Gonghua Liu, Ph.D. Instructional Designer & Technologist Woodruff Health Sciences Center Library, Emory University.
Advertisements

Understand the Macromedia Flash environment Open a document and play a movie Create and save a movie Work with layers and the timeline Plan a Web site.
Kapi’olani Community College Adobe Flash 1 In-class Presentation Week 1.
Kapi’olani Community College Macromedia Flash 1 In-class Presentation Week 1.
Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.
Introduction to Macromedia Flash 8
Chapter 1 Getting Started With Dreamweaver. Explore the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
Agenda – Week 8, Day 1 Debrief from InDesign Transition to Flash/Animation Explore assignment Flash tutorials Lesson 1 - Workspace Lesson 2 - Drawing Lesson.
Flash Tutorials Learning Flash from Built-In Tutorials that Come as Part of Flash.
Multimedia Authoring Tools Lecture 13
Paul Trani Adobe Certified Instructor/Expert Resources:
Getting Started with Flash
Introduction to Flash Animation RMIK Jayasinghe (M. Sc. in Computer Science, B. Sc., SLTS)
Dreamweaver Domain 3 KellerAdobe CS5 ACA Certification Prep Flash Domain 4 KellerAdobe CS5 ACA Certification Prep Flash Domain 4: Building Rich Media Elements.
© 2011 Delmar, Cengage Learning Chapter 11 Adding Media and Interactivity with Flash and Spry.
Getting Started with Flash
Jeff Batt eLearning Brothers Product Development Manager B.Y.O.L.: Titanium - Create Mobile Training as a Native App Using Javascript Jeff Batt eLearning.
Chapter 4 Dreamweaver: Part II The Web Warrior Guide to Web Design Technologies.
Chapter 15 Video. Importing Video Into Flash Once you import video into Flash MX 2004, you can control it using behaviors and very basic ActionScript,
Proprietary & Confidential The Thread That Ties it All Together Voicethread and Discovery Education Jennifer Dorman denblogs.com/jendorman.
XP Tutorial 5 Buttons, Behaviors, and Sounds. XP New Perspectives on Macromedia Flash MX Buttons Interactive means that the user has some level.
© Cheltenham Computer Training 2001 Macromedia Dreamweaver 4 - Slide No 1 Macromedia Dreamweaver 4 Advanced Level Course.
BUILDING RICH MEDIA ELEMENTS. Design Decisions Based on Design Specification  Following the design specification will ensure that the application is.
Tutorial 1 Getting Started with Adobe Dreamweaver CS3
Tutorial 1: Getting Started with Adobe Dreamweaver CS4.
© 2011 Delmar, Cengage Learning Chapter 1 Getting Started with Flash.
Tutorial 5 Making a Document Interactive. XP Objectives Explore the different button states Add a button from the Button library Create a button Learn.
Tutorial 5 Making a Document Interactive. XP Objectives Explore the different button states Add a button from the Buttons library Edit a button instance.
Dm 11 – Intro. To Flash Macromedia Flash MX GETTING STARTED WITH.
Macromedia Flash By Alice Tian. Overview  What is Flash  Why Flash  Basic User Interfaces  Animation Basics  Advanced Basics  Publishing.
Adobe Flash CS5.5. What is Adobe Flash? formerly Macromedia Flash Is software is a powerful authoring environment for creating animation and multimedia.
Interface & navigation (How to build a simple presentation interface) Flash ActionScript Introduction to Thomas Lövgren
IAuthor Digital Story Creation Creation iBooks on iOS Devices.
® Copyright 2008 Adobe Systems Incorporated. All rights reserved. ® ® 1 INTRODUCTION TO ADOBE FLASH CS3.
® Copyright 2010 Adobe Systems Incorporated. All rights reserved. ® ® 1 INTRODUCTION TO ADOBE FLASH PROFESSIONAL CS5.
B.Y.O.L.: Building jQuery Mobile Apps in DreamWeaver Jeff Batt eLearning Brothers Product Development Manager.
Chapter 6 Publishing to the iPad. Installing Software for Working with the iPad When you create layout in InDesign, you can use the Adobe Content Viewer.
Adobe Flash CS3 Revealed Chapter 1 - GETTING STARTED WITH FLASH.
Jeff Batt eLearning Brothers Product Development Manager B.Y.O.L.: Titanium - Create Mobile Training as a Native App Using Javascript Jeff Batt eLearning.
XP Tutorial 4 Special Animations. XP New Perspectives on Macromedia Flash MX Special Layers for Animation Animation Using a Motion Guide Layer.
Tutorial 7 Planning and Creating a Flash Web Site.
Project 4: Yosemite CSS Layout
Chapter 16 Video. Importing Video Into Flash  Once you import video into Flash, you can control it using behaviors and very basic ActionScript, target.
2006 Adobe Systems Incorporated. All Rights Reserved. 1 INTRODUCTION TO ADOBE FLASH CS3.
Flash CS 5 Interface BY NSCHEWCZYK | ©2012. MENU BAR A bar at the top of the window. It lists menu options including: File, Edit, View, Insert, Modify,
Adobe Flash CS4 – Illustrated Unit A: Getting Started with Adobe Flash.
Animation Liveliness Simulation of motions A video made from a series of drawings/images simulating motions by means of slight progressive changes.
Chapter 1 Getting Started With Dreamweaver. Exploring the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
Reading Flash. Training target: Read the following reading materials and use the reading skills mentioned in the passages above. You may also choose some.
XP Tutorial 7 Creating a Flash Web Site. XP New Perspectives on Macromedia Flash 82 Objectives Plan and create a Flash Web site Create a Flash template.
Tutorial 3 Creating Animations. XP Objectives Learn the different elements of animation Create frames and layers Organize frames and layers using the.
Appendix A Becoming an Adobe Certified Associate.
What are keyframes? And how do I use them?. A short diversion into Premiere How to use keyframes to control motion, size, and the intensity of various.
Getting Started with Flash Chapter 1 Understand the Flash workspace Lesson 1.
Chapter1 The flash interface and action script 3.0.
B.Y.O.L.: Adobe Edge Animate—Flash-like Interactions for HTML5 Devices Jeff Batt eLearning Brothers Product Development Manager.
introductionwhyexamples What is a Web site? A web site is: a presentation tool; a way to communicate; a learning tool; a teaching tool; a marketing important.
Macromedia Flash Design Professional Macromedia Flash GETTING STARTED WITH.
Adobe Flash Professional CS5 – Illustrated Unit A: Getting Started with Adobe Flash Professional.
Animation Part I: Interactive Multimedia Authoring with Flash
Using Video, and Flash Components, and Printing Flash Content
Digital Media Production
Animate Workspace. Objective % Utilize appropriate tools and methods to produce digital animation.
Tool for Creating Rich Media
Exercise 48 - Skills Adobe Flash CS4 is a software program you use to create animation and applications that range form simple to very complex. Being able.
denblogs.com/jendorman
ANIMATE WORKSPACE Stage Timeline Properties Panel Library Panel
DREAMWEAVER FIREWORKS PHOTOSHOP FLASH.
Adobe Flash CS3 Revealed
Presentation transcript:

B.Y.O.L.: Adobe Edge Animate—Flash-like Interactions for HTML5 Devices Jeff Batt eLearning Brothers Product Development Manager

Wo Am I? Worked for Rapid Intake - 6 years Worked for eLearning DevCon - 6 Years (Part of it as the Director of the Conferences) Currently Product Development Manager at eLearning Brothers (Started in Jan) Graduated at Utah Valley University in Digital Media - Emphasis in Web Development Passion for learning new tools Love teaching people about new technology

twitter.com/kineticmedia01 My Approach How to guy - Focus on how you use the tools I teach about Everyone is on a different level - I’m starting at the beginning Tutorials about everything will be found on my blog (

Files to download: TBA Download Files

Getting started with Adobe Edge Exploring the Edge Animate UI Using external assets Flexible layouts Animating using keyframes Using the pin tool to animate Easing your animations Symbols and nested symbols Scripting in Edge Animate using the code panel Timeline labels Timeline triggers Playing audio in Javascript Downlevel stage Deployment Using iFrames Different HTML5 options Bringing in HTML5 in Lectora using eLB Interaction Builder Session Objectives

Tumult Hype Adobe Edge Animate Different HTML5 Builder Options

What is Edge Animate?

Advanced Interactions

Where to Get Adobe Edge?

Getting Started - In App Tutorials

Create New Creates project files Starting a New Project

Stage Area

Toolbar

Properties

Timeline

Elements and Library Panels

Menu Items: Modify and Timeline

Audio Stream audio via code Video iFrame Image Using External Assets

Manual and Auto Keyframing

Pin Animating

Easing Your Animations

Scripting in Edge Animate using the Code Panel

Timeline Labels

Timeline Triggers

Establish the path to audio Call play command Working with Audio

YouTube Video Other web content iFrame & Video

Web publish Animate package iBooks widget Deployment