Using ActionScript to animate elements displayed on the stage

Creating Buttons



After Creating the Buttons we change the "UpState" and "OverState" (The Button's response to the mouse being over it)

CSS (Cascading Style Sheets)

Cascading Style Sheets (CSS) is a style sheet language used to describe the presentation semantics (the look and formatting) of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can also be applied to any kind of XML document, including SVG and XUL.

CSS is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation, including elements such as the layout, colors, and fonts.

This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple pages to share formatting, and reduce complexity and repetition in the structural content (such as by allowing for tableless web design).

CSS can also allow the same markup page to be presented in different styles for different rendering methods, such as on-screen, in print, by voice (when read out by a speech-based browser or screen reader) and on Braille-based, tactile devices. While the author of a document typically links that document to a CSS style sheet, readers can use a different style sheet, perhaps one on their own computer, to override the one the author has specified.

CSS specifies a priority scheme to determine which style rules apply if more than one rule matches against a particular element. In this so-called cascade, priorities or weights are calculated and assigned to rules, so that the results are predictable.

The CSS specifications are maintained by the World Wide Web Consortium

Experimenting with Flash Templates

Preview of a Flash Web Template



ActionScript 3 Templates are widely available on the web, many of them free-of-charge. I downloaded one just to see how they work.

Adobe Dreamweaver and Adobe Photoshop Interaction

We all know that Adobe are very successful when it comes to making sure their different applications interact smoothly with each-other. But how about the Interaction between Dreamweaver and Photoshop?

Let's take a look!



There are a number of different ways to create Websites. While some designers may choose to hand draw a concept and then start coding HTML, others may want to take a more graphical approach to the design and layout.

Interface Design

This is the most critical part of the whole design process. The design of your interface is very important for usability. You've probably heard it a thousand times, but the old saying is true: if your visitors can't find all your content, or they're confused by your layout, they really are only one click away from leaving your site.

Planning Ahead

With any new design, you must plan ahead. This will enable you to adapt to any changes that arise quickly and easily. For example, imagine you wanted to add another section to your Website. Does the navigation of your site allow for this, or will it entail a complete redesign? If you're in the latter category, expect to waste time and money -- resources that can easily be saved if you design your site layout well the first time.

It's important to imagine where you'd like to be in the future. Websites are like any other business: you must change with the times.

An obvious web design principle is to communicate a clear message with professional, integrative design using the world’s most popular Web design combination--Adobe Photoshop and Dreamweaver.

The idea is to build web sites that are both well-designed and highly functional.

Take standard web page elements--such as navigation bars and content areas--and create a unique look based on the needs of your client/target audience and the capacity of your own imagination.

With a balance of sound technical knowledge and web design theory, effective communication between software (should you choose to design this way of course!) will result in the creation of visually appealing and technically effective professional Web sites.

Slicing

Although you can use any graphics software to create your image, I recommend Photoshop. Packaged with this program is ImageReady, which you can use to save images for the Web, create gif animations, and slice up Photoshop images.

Now, "slicing" means that we'll take your original page layout image, and make smaller individual images out of it, which you can then insert into an HTML table.

What is Interactive Design?

Interaction design (abbreviated as IxD) defines the structure and behavior of interactive systems. Interaction Designers strive to create meaningful relationships between people and the products and services that they use, from computers to mobile devices to appliances and beyond.

The practice typically centers on "embedding information technology into the ambient social complexities of the physical world."

Interactivity, however, is not limited to technological systems. It can also apply to other types of non-electronic products and services, and even organizations. Also, people have been interacting with each other as long as humans have been a species. Therefore, interaction design can be applied to the development of all solutions (or offerings), such as services and events.

Throughout the process of interaction design, designers must be aware of key aspects in their designs that influence emotional responses in target users. The need for products to convey positive emotions and avoid negative ones is critical to product success.

These aspects include positive, negative, motivational, learning, creative, social and persuasive influences to name a few. One method that can help convey such aspects is the use of expressive interfaces.

In software, for example, the use of dynamic icons, animations and sound can help communicate a state of operation, creating a sense of interactivity and feedback. Interface aspects such as fonts, color pallet, and graphical layouts can also influence an interface's perceived effectiveness. Studies have shown that affective aspects can affect a user's perception of usability.

Emotional and pleasure theories exist to explain peoples responses to the use of interactive products. These include Don Norman's emotional design model, Patrick Jordan's pleasure model, and McCarthy and Wright's Technology as Experience framework.

This guy, Ben Stevens, a free-lancer, has some interesting work within this field.

www.benstevens.co.uk

Adobe Contribute

Although we are not currently using this software for this brief, I have it on my MacBook as part of CS5.

I just thought it would be useful to become more familiar with Contribute, and how it interacts with Dreamweaver and other Adobe Products.

Adobe Contribute is a WYSIWYG web authoring and content management application that is designed to facilitate collaborative editing of web sites, including workflow management.

Adobe claims that the software allows users to edit web pages without knowing HTML and to embed multimedia components.

Contribute consists of two components, a client for editing, and a "publishing server" that Adobe describes as "complementary".

Contribute also includes an in-browser editing component that works as a plug-in for recent versions of Microsoft Internet Explorer and Mozilla Firefox.

Contribute is designed to integrate with Adobe Dreamweaver and other Adobe products.

It is included in the Web Premium and the Master Collection editions of Adobe Creative Suite.

Experimenting with Flash CS5

Just started experimenting with Flash CS5, best to start with something basic, like making this Vector of a cog move across the stage quickly, something like this is surprisingly easy to do and a good way of getting to grips with the Flash interface.

Adobe Dreamweaver CS5

Starting to Use Adobe Dreamweaver CS5 template before event-related content is added.

ActionScript 3 Tutorial

Very Basic Tutorial to begin with research on ActionScript 3

http://www.youtube.com/watch?v=pKj1IgWJd-A

ActionScript

ActionScript is a scripting language developed by Adobe. It is a dialect of ECMAScript (meaning it has the same syntax and semantics of the more widely known JavaScript), and is used primarily for the development of websites and software targeting the Adobe Flash Player platform, used on Web pages in the form of embedded SWF files. Originally developed by Macromedia, the trademark in the language is now owned by Adobe (which acquired Macromedia in 2005), though the language itself is "open source" in the sense that its specification is offered free of charge and both an open source compiler (as part of Adobe Flex) and open source virtual machine (Mozilla Tamarin) are available.
ActionScript was initially designed for controlling simple 2D vector animations made in Adobe Flash (formerly Macromedia Flash). Initially focused on animation, early versions of Flash content offered few interactivity features and thus had very limited scripting capability. Later versions added functionality allowing for the creation of Web-based games and rich Internet applications with streaming media (such as video and audio).

Today, ActionScript is suitable for use in some database applications, and in basic robotics, as with the Make Controller Kit.

Flash MX 2004 introduced ActionScript 2.0, a scripting programming language more suited to the development of Flash applications. It is often possible to save time by scripting something rather than animating it, which usually also enables a higher level of flexibility when editing.

Since the arrival of the Flash Player 9 alpha (in 2006) a newer version of ActionScript has been released, ActionScript 3.0. ActionScript 3.0 is an object oriented programming language allowing far more control and code reusability when building complex Flash applications. This version of the language is intended to be compiled and run on a version of the ActionScript Virtual Machine that has been itself completely re-written from the ground up (dubbed AVM2).[2] Because of this, code written in ActionScript 3.0 is generally targeted for Flash Player 9 and higher and will not work in previous versions. At the same time, ActionScript 3.0 executes up to 10 times faster than legacy ActionScript code.[3]

Flash libraries can be used with the XML capabilities of the browser to render rich content in the browser. This technology is known as Asynchronous Flash and XML, much like AJAX. Adobe offers its Flex product line to meet the demand for Rich Internet Applications built on the Flash runtime, with behaviors and programming done in ActionScript. ActionScript 3.0 forms the foundation of the Flex 2 API.

Adobe Flash

Adobe Flash (formerly Macromedia Flash) is a multimedia platform used to add animation, video, and interactivity to Web pages. Flash is frequently used for advertisements and games. More recently, it has been positioned as a tool for "Rich Internet Applications" ("RIAs").
Flash manipulates vector and raster graphics to provide animation of text, drawings, and still images. It supports bidirectional streaming of audio and video, and it can capture user input via mouse, keyboard, microphone, and camera. Flash contains an Object-oriented language called ActionScript.
Flash content may be displayed on various computer systems and devices, using Adobe Flash Player, which is available free of charge for common Web browsers, some mobile phones and a few other electronic devices (using Flash Lite).

Adobe Dreamweaver

Adobe Dreamweaver (formerly Macromedia Dreamweaver) is a web development application originally created by Macromedia, and is now developed by Adobe Systems, which acquired Macromedia in 2005.
Dreamweaver is available for both Mac and Windows operating systems. Recent versions have incorporated support for web technologies such as CSS, JavaScript, and various server-side scripting languages and frameworks including ASP, ColdFusion, and PHP.

The Brief

This workshop concentrates essentially on promoting a short event through various social networks and web applications, using a wide range of techniques including flash animation, e-flyer, iphone screen, banner, post on blog and website.
Exemples of short events: flashmob, apero geant, pop-up restaurant, secret gigs, art auction.

Your sketchbook will be a blog that you will personalise with weekly exercises, research and developement of the project.

This project involves a good understanding of web applications, image interpretation and navigation strategies for moving through information. The project should demonstrate a critical awareness of the Internet development and encourage you to approach creatively information technology with critical awareness of its potential. You should also facilitate ongoing research and participation in this exciting area of cultural practice by using concrete or abstract methods.