Share
Wat is beter dan statisch zijn? In beweging zijn, mijn goede vrienden. Er is steeds meer beweging voor internet, van eenvoudige interface-interacties tot complexere scenario's en prototypes. In dit artikel zullen we onszelf voorstellen aan Adobe Animate, wat het is, wat het niet is, en hoe het kan helpen met je werk als webdesigner.
Adobe Animate wordt beschreven als een evolutie van Flash Professional; een product waarvan de aard eigendom was gedoemd tot de geschiedenisboeken op het moment dat Steve Jobs de pen op papier zette.
"Om zijn positie als de belangrijkste animatietool voor het web en daarbuiten beter weer te geven, wordt Flash Professional hernoemd tot Adobe Animate CC" - Rich Lee, in 2015
Dus tijden veranderen, en Adobe heeft daardoor hun benadering van het web veranderd.
De functie-tijdlijn van Adobe AnimateOf u nu nieuw bent in beweging, of uzelf een veteraan vindt die op zoek is naar een alternatief voor prototyping, misschien is Adobe Animate CC iets voor u. Zoals met alle tools is het doel specifiek voor de persoon die het gebruikt. Dit is geen tool die iedereen moet gebruiken, maar het is in uw belang om u bewust te zijn van zijn aanwezigheid.
Met Adobe Animate kunnen creaties zoals cartoons, advertenties, games en andere interactieve inhoud worden gepubliceerd op bekende platforms zoals HTML5 Canvas, Flash Player & Air, WebGL en zelfs Snap SVG.
Om te helpen de mogelijkheden van Adobe Animate te begrijpen, dacht ik dat het het beste zou zijn om enkele belangrijke functies op te sommen die ik persoonlijk interessant vind. Het beste van Adobe Animate is zeker het omarmen van webstandaarden. Een goede tweede is het fantastische aanbod van export- / publicatie-opties, dan vectorborstels, HiDPI-ondersteuning, JavaScript-integratie door derden en nog veel meer.
Alle animaties vinden in volgorde plaats op wat algemeen bekend staat als een tijdlijn. Flash-ontwikkelaars begrijpen deze concepten heel goed. Met deze gebruikersinterface kan u, de ontwikkelaar, uw animaties beheren in een tijdlijn door een visueel perspectief te krijgen van hoe de gehele reeks in elkaar past. Hier is een korte introductie van Adobe over de basisprincipes van de tijdlijn.
Tijdlijnen kunnen fijnkorrelige animaties bevatten in een op frames gebaseerde context. Dit betekent dat artiesten geïsoleerde animaties kunnen maken en deze geïsoleerde bewegingen kunnen integreren in een grotere hoofdtijdlijn.
Nu open webstandaarden eindelijk worden omarmd door Animate CC, moeten ontwikkelaars zich nog steeds bewust zijn van de technische beperkingen van het formaat waarnaar ze exporteren. Ontwikkelaars hebben desgewenst de optie om naar de Flash-speler, SWF-bestanden te exporteren. Het is ook mogelijk om te exporteren met meerdere resoluties, waardoor het onbetaalbaar wordt voor bitmapwerk. U kunt zelfs een sprite-sheet genereren op basis van keyframes en deze via CSS animeren!
Het lijdt geen twijfel dat de export- en publicatieopties het veel efficiënter maken om uw projecten te moderniseren. Verzend verschillende versies van hetzelfde project zonder uw originele bronbestanden opnieuw te maken door de optie "scale content" in te schakelen. Genereer een HTML-document voor ActionsScript-projecten met de juiste voorwerp en embed tags via het dialoogvenster Instellingen publiceren.
De kers op de taart is dat je ook de mogelijkheid hebt om naar SVG te exporteren.
Animate CC introduceert nieuwe vectortekengereedschappen, waaronder vectorborstels die niet moeten worden geconverteerd naar vormen om te worden bewerkt. Alles wat u bekend bent in Illustrator voor penselen en tekenen is ook beschikbaar voor u in Animate CC. Hiermee kunt u een penseel op maat maken door parameters van het penseel in te stellen, zoals de vorm en zelfs de hoek. Super glad als je geeft om kwaliteit en scherpe illustraties.
Flash-ontwikkelaars zullen zich thuis voelen met het botgereedschap om objecten te animeren met behulp van "botten" die lineair of vertakt zijn geketend in ouder-kindrelaties; denk aan bewegingen zoals het buigen van een arm, een slingerende slang of een beenschop. Dit soort bewegingen kan een lange tijd vergen om in code te prototypen, maar met Animate CC kan dit zeer snel gebeuren, waardoor slechte ideeën minder kosten en goede ideeën sneller kunnen koesteren.
Bewegingssequenties op basis van anker kunnen ook worden opgenomen in symbolen, of wat bekend staat als "instanties", die tijdens uw project kunnen worden hergebruikt.
Het botgereedschap komt ook met andere trucs uit de mouw. Krijg realistische fysieke beweging door de dynamische fysica in de botten te integreren, zoals veerkracht, waardoor de beweging veel realistischer wordt voor de fysieke wereld.
Dus je hebt een geweldig kunstwerk gemaakt om te animeren, maar wil je bijvoorbeeld een externe helper zoals GreenSock gebruiken? Goed nieuws! Je kunt precies dat doen. Vanaf de Animate UI kunnen ontwikkelaars de gewenste flexibiliteit hebben zonder het gevoel te hebben dat ze zich in een ommuurde tuin bevinden zonder hulp van de buitenwereld. Gebruik de nieuwste JavaScript-bibliotheken tot uw beschikking en krijg de flexibiliteit die u nodig hebt voor de frames in uw animatie.
Animators hebben volledige controle over hoe het podium (d.w.z. canvas) wordt gepositioneerd. Er zijn opties beschikbaar voor het roteren van het podium, vanaf elk punt dat je kiest, zoals centraal naar het podium of zelfs vanuit de hoek. Je animatie kan ook meer dynamiek bevatten, zoals het toevoegen van camera-effecten zoals pannen, zoomen of draaien, waardoor je project nog realistischer wordt; kijk uit James Cameron.
De virtuele camera van AnimateTools zijn cool, maar ze regeren de wereld niet. Kies verstandig, maar kies wat voor u werkt. Tools zijn er om je te helpen je workflow niet te dicteren. Als u Animate in een project gebruikt, laat dan een opmerking achter en een link hieronder met voorbeelden als u er een aantal heeft. Vertel ons over uw ervaringen met deze toepassing. Blij geanimeerd!
Accentsconagua