Log In
Or create an account ->
Imperial Library
Home
About
News
Upload
Forum
Help
Login/SignUp
Index
Adobe Edge Quickstart Guide
Adobe Edge Quickstart Guide
Credits
About the Author
About the Reviewer
www.PacktPub.com
Support files, eBooks, discount offers and more
Why Subscribe?
Free Access for Packt account holders
Preface
What this book covers
What you need for this book
Who this book is for
Conventions
Reader feedback
Customer support
Downloading the example code
Errata
Piracy
Questions
1. Introduction to Adobe Edge
Why we need Adobe Edge
Flash Player restrictions
The relationship between Adobe Edge and Adobe Flash Professional
Comparisons with Adobe Flash Professional
Stage
Timeline
Keyframes
Symbols
Library
Actions
HTML technology maturity
Mobile deployment
What Adobe Edge can be used for
Web animation
Interactive content
The history of Adobe Edge
The inner workings of Edge
HTML, CSS, and JavaScript
HTML
CSS
JavaScript
How jQuery is used in Edge
JSON
The Adobe Edge Runtime
Getting started
Installing Adobe Edge
The Adobe Edge welcome screen
Creating a new Edge Project
Save
Save As…
Edge project file structure
Summary
2. The Edge Application Interface
Application interface overview
The application window
Customizing the Edge panel layout
Managing workspaces
The Edge menu system
File
Edit
View
Modify
Timeline
Window
Help
The Edge Toolbar
Selection tool
Transform tool
Rectangle tool
Rounded Rectangle tool
Text tool
Background Color and Border Color
The Stage
The Edge Timeline
Panels in Edge
Elements panel
Library panel
Properties panel
Actions panel
Summary
3. Working with Edge Tools and Managing Assets
Using the drawing tools
The Rectangle tool
Using the Rectangle tool
The Rounded Rectangle tool
Using the Rounded Rectangle tool
The Text tool
Using the Text tool
Using web fonts
The Selection and Transform tools
Using the Selection tool
Properties shared by all element types
ID
Tag
Element Display
Location
Size
Opacity
Transform Origin
Rotate
Skew
Scale
Clip
Properties unique to rectangle elements
Overflow
Background Color
Border Color
Border Thickness
Border Style
Border Radius
Properties unique to text elements
Font Name
Font Size
Font Size Units
Text Color
Bold
Italic
Underline
Align Left
Align Center
Align Right
Properties unique to image elements
Source
Position
Properties unique to symbol elements
Playback Actions
Scrub
Properties available with the Stage
Composition ID
Document Title
Overflow
Autoplay
Background Color
Width
Height
Color tools
Importing external assets
What is SVG?
Importing SVG images
What is a bitmap?
Importing bitmap Images
Working with imported assets
Converting assets into symbols
Create a Symbol
Summary
4. Creating Motion with Edge
Animation within Edge
The Edge Timeline
Playback controls
Time
Search
Timeline options
Timeline controls
The Playhead
The Mark
Zoom controls
Keyframes
Creating motion
Animating with the Playhead
Animating with the Mark
Editing Transition
Duration
Delay
End
Easing
Example: Animating a website header
Project setup, asset import, and general layout
Animating elements
Animating the background
Animating the cover art (do this for each cover art image)
Animating the title text
Summary
5. Adding Interactivity to an Edge Composition
Working with Actions
The Timeline Actions layer
Working with Triggers
Working with Labels
Applying Actions to the Stage
Applying Actions to individual elements
Overview: The Adobe Edge Runtime APIs
Document Object Model events
Mouse events
Touch events
Virtual mouse events
Timeline events
Example: Adding interactivity to a website header
Creating the Text element
Adding interactivity to the Title
Adding interactivity to the album art
Completing the final website header composition
Summary
6. Additional Resources
Using an Edge composition within an existing website
Online resources
About the forthcoming book: Learning Adobe Edge
Learning Adobe Edge
Robust motion and interactivity through web standards
What you will learn
← Prev
Back
Next →
← Prev
Back
Next →