Explaining the principles of web animation

Explaining the principles of web animation

Explaining the principles of web animation Gladys Nzita-Mak Animated Interface Elements DHTML XHTML JAVA DHTML

DHTML is a programming language which can be used in animation win different ways such as: Animating texts and images Embedding Rollovers Dynamic menus DHTMLs allow web pages to have animations. Benefits of using DHTMLs are that web pages do not have to load up fully in order to function, doesnt require any plugins, a disadvantage would be that it may not be compatible with every web browser (which means the user will have to upgrade their browsers to recent versions to use sites with DHTMLs) and that it takes a while to code with DHTML as it is difficult for some. In the image on the right, Whilst on the UCAS

website, if a user is to rollover on the top section, a drop down list appears, this has been done with using DHTMLs. XHTML XHTML is a programming language in the XML family that can be used in a way that (for example) if a website were to have a video attached onto their website, by using XHTML is can grab the video and place it onto the website, and once clicked to be

viewed, instead of having the page be directed to the source of the video, it will remain on the page. For example in the image on the right (with the section highlighted), by using XHTMLs allows a website to have videos on them and to also be viewed on that website. Benefits of XHTML are that it supports a lot of applications and is compatible with a good amount of formats such as PDF and RSS. JAVA Developed by Sun Microsystems, JAVA is a programming language used to

create applications, and allows certain types of media to be played on compatible devices such as mobile phones and PCs. Benefits of Java is that once downloaded, applications, games and other java outlets can be ran anywhere which is very efficient. Also java provides good performance applications. The java language can be easy to learn and write, debug, compile and used for creating java applications, and is also secure. Drawbacks would be that it takes up some memory and can be slow at times. RuneScape is an online game developed and written in Java, now alongside with

HTML5 Digital animation Gif Bitmap

Vector animation Compression Scalability Gif Graphics interchange format are compressed (so that the quality of the gif looks well) and limited to using 256 colours. Gif images are able to use different frames of imaged in order to create the illusion of movement. In the image below shows the character Voldemort from Harry Potter being animated as he is casting a spell. As you can see there are more of the same colours used in the image, possibly not more than 200 colours, these type of gifs are very popular on web pages and doesnt contain large amounts of KBs.

Bitmap Bit Vector animation Vector graphics are made by using lines, shapes and curves along with mathematical calculations to create images. Advantages of vector animation are: High quality animations Vector images tend to be higher quality Take up less space although high quality, vector images dont take up high amount of space unlike bitmaps Adobe Flash supports vector animation as you are able to use it to draw and create your own animations, for example if a user were to draw a character using Flash they are able to animate it using shape and motion tweens along with other tools, being

able to produce high quality animations. Compression When it comes to animation, compression applies in many ways. For example with gif files, they are to be compressed in order for the quality of the animation to look good. Also whilst viewing video files in QuickTime, video files are to be compressed so that the video quality can look good during playback. If gif files are compressed lossless, then the gif will turn out with a looking like a high quality animation, whereas if compressed lossy, then it would have lost some data resulting in the animation being bad quality. The gif file on the right is animated (the girl in the animation puts on

sunglasses). This gif file has been compressed lossy, when played back it is quite blurry and slow. Scalability Web animation software Adobe Flash Adobe Flash is used to create animations using either multiple frames including having the animations animated by using tweening and motion, or can be animated by using the

ActionScript programming language. It is an authoring program used to create 2D animations that can be compatible on both web pages and even mobile phones. With Adobe Flash you are able to produce well made Vector animations, being able to animate them and even able to code it. Flash provides users with a good set of tools including layers, controls, tweening, buttons, scripts etc. With these tools animators can produce all types of animations, for example using bitmap images, I have managed to create an animation with the tools provided.

Using Adobe Flash Professional I have used layers and tweening to animate the character above in the image.

Recently Viewed Presentations

  • Personnel Administration Actions HR_PA_310 Use the Forward button

    Personnel Administration Actions HR_PA_310 Use the Forward button

    HR_PA_310 Personnel Administration Actions. Course Learning Objectives. Review terms and concepts associated with Personnel Administration (PA) Actions as it relates to the University of Kentucky. Gain an understanding of and be able to perform a few, key PA Actions. NOTE:...
  • Preseason Incident Blanket Purchase Agreements (I-BPA) and Virtual

    Preseason Incident Blanket Purchase Agreements (I-BPA) and Virtual

    The VIPR Tech Team questioned the reliability of Load Balance servers and requested additional RAM for server # 0628. ... Crew Carrier Bus. Communications Trailer. ... template can be used to acquire other resources as identified on the Equipment and...
  • Picture Books - Mississippi Library Commission

    Picture Books - Mississippi Library Commission

    Programming. Booktalks. Awake Beautiful Child by Amy Krouse Rosenthal, ill. By Gracia Lam. Mixed Me by Taye Diggs, ill. By Shane W. Evans. More caps for Sale by EsphyrSlobodkina with Ann Marie Mulhearn Sayer. Big Bear LITTLE CHAIR by Lizi...
  • What's New in OpenLab CDS - agilent.com

    What's New in OpenLab CDS - agilent.com

    We focus on smooth migration to take existing customers with us - old and new co-exists for a while so customer can move at their own pace. Phase 1 has been the migration of both EZChrom and ChemStation to RC.NET...
  • Analysis of Algorithms

    Analysis of Algorithms

    Queues. The Queue ADT. The Queue ADT stores arbitrary objects. Insertions and deletions follow the first-in first-out scheme (FIFO) Insertions are at the rear of the queue and removals are at the front of the queue
  • Antibody Detection - Islamic University of Gaza

    Antibody Detection - Islamic University of Gaza

    antibody levels decrease over time when the individual is no longer exposed to the corresponding antigen. If the level of an RBC antibody drops too low, results of antibody screening tests and crossmatches will appear negative and may lead to...
  • Intermolecular Forces

    Intermolecular Forces

    CA Standards. Students know energy is released when a material condenses or freezes and is absorbed when a material evaporates or melts.
  • 6th Grade World Histor Mrs. Lowery JOIN Lowery

    6th Grade World Histor Mrs. Lowery JOIN Lowery

    Vocabulary, notes, study guide, will remain in the binder for the duration of the nine weeks . Sixth Grade World History Curriculum. When a student is absent. check the "What Did I Miss?" folder. ... Encourage your child to keep...