Search This Blog

Wednesday, August 10, 2011

Adobe Edge Preview – Introduction


If you like this article, please click on +1 button and share with your friends.

Click here for the Video Tutorial of this article.
visit www.iGnani.com


Introduction

Adobe® Edge is a new web motion and interaction design tool that allows designers to bring animated content to websites, using web standards like HTML5, JavaScript, and CSS3.

This is an early look at Edge with more capabilities to come in the future releases. Edge will be updated regularly to add new functionality, stay ahead of evolving web standards, and incorporate user feedback to provide the best functionality and experience possible.

Edge Preview Highlights

This version of Edge focuses primarily on adding rich motion design to new or existing HTML projects, that runs beautifully on devices and desktops.

  • Create new compositions with Edge’s drawing and text tools.
  • Import popular web graphics such as SVG, PNG, JPG or GIF files.
  • Easily choreograph animation with the timeline editor. Animate position, size, color, shape, rotation and more at the property level.
  • Energize existing HTML files with motion, while preserving the integrity of CSS-based HTML layouts.
  • Copy and paste transitions, invert them, and choose from over 25 built-in easing effects for added creativity.

Instead of reading about the features here, it would be better to actually experience them.

Now that we know in brief what is Adobe Edge Preview is about, let us go ahead and download it.

  1. Open up your browser. Go-to the site at http://labs.adobe.com/technologies/edge
  2. Look for the “Download Now” button and Click it. This will take you onto a new page, asking you to register if you are a new user or simply log-in if you already have an existing account.
  3. Once you log in successfully, you will be shown the download page where you can download the installer.
  4. Two versions are available, the first one is a Mac version while the second one is for Windows machines. If you are a Windows user like me, then go ahead and download the Windows version. else you can go with the Mac version. For the rest, you might have to wait for adobe to release something for you. Download an appropriate version and save it into your machine.
  5. After the file is downloaded into your machine, extract the contents.
  6. Execute the “Set-up.exe” file.
  7. The first page that you will come across is that of “Software License Agreement”. You will have to accept the agreement in order to continue forward. Click “Accept” to accept the agreement.
  8. Next you will be taken to the “Install Options Page”. Make sure the check box next to the Adobe Edge is selected in the components list. Change the Installation path if necessary. Click “Install” to continue.
  9. All that you need to do is wait while it installs and once its complete, you will be taken to the "Thank You" page. It should say that your installation is complete.
  10. Click “Done” and you are now ready to go.

Using Adobe Edge Preview

  1. To start the Adobe Edge Preview, Go-to the Windows Start menu –> "All Programs" –> "Adobe Edge Preview" or simply search for "Adobe Edge Preview" from the Windows Start menu and click the link that you see in the search list.
  2. Now you can see the "Adobe Edge Preview" application loading for the first time. In some cases, the Windows Security alert will ask for your permission to allow the application to communicate on the networks. Allow the access as appropriate in your case. Finish this process by clicking "Allow Access" button.
  3. Next, it will display a message, which will appear only once - and will not be displayed till the application expires which says that "The pre-release period for Edge - will expire in 150 days". Click OK.
  4. You are now all set to write your first web page using Adobe Edge Preview.

visit www.iGnani.com

MicroMind Information Systems
#4013, K.R. Road, Banashankari II Stage,
BANGALORE - 560070
KARNATAKA, INDIA
Phone: +91 80 26762747


No comments:

Post a Comment