Prototyping Week 7 // Tweenlite & API

TweenMax Snel mooie en effectieve animatie

TweenMax? Library om MovieClips en Buttons makkelijk te animeren. Vaak sneller en flexibeler dan Flash tweening. Veel voorbeelden en een code generator.

TweenMax - Easing Je kan gebruik maken van verschillende easing, veel gebruikte zijn: BackOutBounceOutElasticOut

Installeren Download de zip met de AS3 versie. “Unzippen” Kopieer de map “com” in de map van je.fla

Waar je op moet letten Zet de import code bovenaan in je script. Gebruik altijd TweenMax, deze versie kan veel meer dan TweenLite! De code generator verwijst altijd naar het object “mc”. Vervang “mc” door de “InstanceName” van de MovieClip of Button die je wilt animeren. Wijzig de x, y, etc eigenschappen naar wens!

API Wat is een API en wat kan je er mee?

Definitie van een API Application Programming Interface Wikipedia: Verzameling definities op basis waarvan een computerprogramma kan communiceren met een ander programma of onderdeel. Voor ons: Toegang tot de functionaliteit van een website van buitenaf.

Wat kan je met een API? Diverse websites bieden via een API toegang tot hun inhoud. Denk bijvoorbeeld aan flickr, YouTube, Google Maps, etc. Je kan met de flickr API bijvoorbeeld: Foto’s zoeken op tag / gebruiker / plaats / datum Comment’s ophalen Comment plaatsen Foto’s uploaden Etc.

Wat kan je met de API Vaak heb je een “developer key” nodig, maar niet altijd. Deze kan je na een registratie, gratis aanvragen. De API benader je vaak via XML requests. De API geeft je vaak ook data terug in XML/RSS formaat. Voor bekende websites bestaan vaak ActionScript code libraries welke je kan gebruiken om met de API te werken.

Lesopdracht (15 min) Ga op zoek naar de API van Flickr. Welke feeds kan je ophalen zonder Key? Welke parameters kan/moet je meegeven? Wat mag wel, wat niet (terms of use)? Welke request en welke response formats zijn er? Zoek de Flash Actionscript 3 documentatie.

Waarom moet ik dit weten? Als designer moet je op de hoogte blijven van de mogelijkheden en onmogelijkheden van het web. Zo krijg je ook weer nieuwe ideeën. Je hoeft het niet zelf 100% te kunnen implementeren, maar je moet een wel met de klant en programmeur kunnen overleggen.

Huiswerk

1.Animeer elementen in je prototype met behulp van TweenMax. 2.Onderzoek de API's van de sites waar je prototype straks de externe data vandaan haalt. Beschrijf in dit onderzoek o.a.: Heb je een “developer key” nodig? Is er goede documentatie voor AS3? Wat zijn de beperkingen? … Dit onderzoek wordt onderdeel van het document wat je uiteindelijk oplevert bij je prototype.