Adobe Edge - animasjon med HTML5, CSS3 og JavaScript

Adobe Edge - animasjon med HTML5, CSS3 og JavaScript

Adobe Edge - animasjon med HTML5, CSS3 og JavaScriptAdobe Edge - animasjon med HTML5, CSS3 og JavaScript er et 2-dagers kurs i animasjon hvor vi ikke bruker programmeringsmulighetene i Edge, bortsett fra enkle kommandoer for å starte, stoppe og loope, og for å åpne andre websider.

Se også Kurs i programmering med Adobe Edge.

Om Adobe Edge

Adobe Edge er et program for å lage animasjoner på websider. For mange web-utviklere vil det være et alternativ til Flash, siden det kan brukes på iPhone og iPad, og i andre sammenhenger hvor brukeren ikke har Flash Player installert.

Edge er basert på HTML5, CSS3 og JavaScript, noe som betyr at animasjonene kan spilles av i alle moderne nettlesere som støtter HTML5 (Safari, Mobile Safari, Google Chrome, Firefox, Opera og Internet Explorer 9, for å nevne de viktigste). Det er innebygde funksjoner for å lage 'fallbacks' for eldre nettlesere (statiske bilder som vises istedenfor animasjonen).

Animasjonene i Edge lages på en tidslinje, på lignende måte som i Flash og After Effects. For Flash-brukere vil den største forskjellen være at det ikke brukes frames. Edge kan importere vanlige grafikkformater som JPEG, PNG, GIF og SVG (vektorbasert webgrafikk).

Eksempler på Edge-animasjonerEdge-prosjekter kan programmeres med JavaScript, jQuery og innebygde API-kommandoer.

Filstrukturen i Edge er laget slik at animasjonsdataene er fullstendig adskilt fra HTML-dataene. Dette gjør at det er enkelt å plassere en Edge-animasjon sammen med andre elementer på en side. Siden filene bare er vanlige tekstfiler (HTML, CSS og JavaScript) er det ikke noe eget filformat å ta hensyn til slik som med Flash.

I øyeblikket finnes Edge bare i en prøveversjon, men du kan bruke den til å produsere ferdige prosjekter allerede idag. Merk at programmet er under stadig utvikling, slik at den ferdige versjonen kan ha forskjellig utseende og virkemåte fra prøveversjonen.

Du kan kan laste ned prøveversjonen gratis fra labs.adobe.com/technologies/edge/ og prøve hvordan det virker.

Den første ferdige versjonen av Edge blir tilgjengelig i løpet av 2012.

Eksempler på animasjoner laget med Adobe Edge

Eksempler på animasjoner vi har laget kan du se her på vår eksempelside. Du vil lære en del av teknikkene som er brukt for å lage disse animasjonene på kurset.


Adobe Edge - animasjon med HTML5, CSS3 og JavaScriptKursinnhold

Kurset vil ta utgangspunkt i den versjonen av Edge som er kurant når kurset holdes. Siden programmet utvikler seg svært raskt, vet vi ikke eksakt hvilke funksjoner som vil være tilgjengelige på kurstidspunktet

Siden mange kursdeltakere vil være Flash-brukere, vil det bli lagt vekt på å klarlegge forskjellene mellom Edge og Flash.

  • Filstrukturen i et Edge-prosjekt
  • Samspillet mellom HTML5, CSS3, JavaScript, jQuery og JSON
  • Klargjøring av grafikk, med vekt på SVG og transparent PNG
  • Praktiske øvelser og animasjonseksempler
  • Plassering av Edge-animasjoner på websider
  • Animasjon av eksisterende websider
  • Bruk av JavaScript til å lage tilleggsfunksjonalitet
  • Preloading-problematikk i Edge
  • Wallaby - en mulighet for Flash-utviklere til å konvertere enkle Flash-animasjoner til HTML5

Hvem passer kurset for?

Kurset passer godt for designere som vil lage bannerannonser, animasjoner o.l. for web.
Hvis det du lager MÅ fungere på iPhone/iPad og du derfor ikke kan bruke Flash er Edge et nytt godt alternativ.
Kurset passer for alle som ønsker å benytte HTML/CSS/JavaScript for å lage animasjoner, bannerannonser etc uten å måtte skrive kode.

Forkunnskaper

Deltakerne trenger ingen forhåndserfaring med Edge. Kurset krever ingen forkunnskaper utover alminnelig kjennskap til arbeid med Macintosh eller Windows (mus, menyer og vinduer), samt en grunnleggende forståelse av hvordan internett fungerer. Erfaring med HTML/CSS/JavaScript er ingen krav.

Sertifisert instruktør

Kurset holdes med Adobe-sertifisert instruktør.

Instruktøren har over 25 års erfaring innen programmering. Han har jobbet med QuarkXPress og Adobe Illustrator siden 1988 og Adobe Photoshop siden 1990. Han startet å jobbe med Adobe Flash allerede i 1997. Høsten 2011 startet han å jobbe med Adobe Edge og har siden oppstarten vært en aktiv deltaker på brukerforum og i Adobes beta-program. Instruktøren har mer enn 20 års erfaring som kursholder i Photoshop, Flash og andre programmer.


Kursdetaljer / bestill kurs


Adobe Edge - animasjon med HTML5, CSS3 og JavaScript
Fremtidens animasjoner lager du med Edge og HTML5
Spørsmål om kurset? Eller finner du ikke dato som passer? Kontakt oss på kurs@qross.no eller 22 07 00 90.