Schnuppertag | Workshop ActionScript Eine interaktive Weihnachtskarte
Animationen mit Animate Workshop: Interaktive Programm Mi. 6. 12.2017 Animationen mit Animate Workshop: Interaktive Vorstellung infcom.ch (Prorektor D. Burger) zNüni Mittag mit infcom-lern Unterrichtsbesuch bei infcom.ch Snack Fragen zu infcom.ch?
Animationen mit Animate Workshop: Interaktive Programm Do. 7. 12.2017 Animationen mit Animate Workshop: Interaktive Vorstellung infcom.ch zNüni Infos zu infcom.ch (Prorektor D. Burger) Mittag mit infcom-lern Workshop Film (G3E) Snack Unterrichtsbesuch bei infcom.ch
Vorstellung Ich: Und Sie? Nicolas Ruh Lehrer für Deutsch & Informatik (& infcom.ch) Und Sie? Wie heissen Sie? Wie haben Sie von infcom.ch gehört? Wieso interessieren Sie sich für infcom?
Animation & Interaktion Akzentfach infcom.ch Software Informatik. Design. Kommunikation. BiG Animationen erstellen Programmieren (ActionScript) Spiel-Projekt Animation & Interaktion Filmsprache Videoschnitt Filmprojekt (www.oneminute.ch) Film Vektorgrafik Typographie & Fonts Corporate Design Grafikdesign Scriptsprachen (HTML, CSS) Datenbanken, PHP CMS & Web2.0-Projekt Web 2.0 S1 S2 S3 S4 iWeek Fotographie iWeek Layout Impulswoche frei wählbar iWeek Film
Was erwartet sie im infcom.ch? Die zeitgemässe Art, das Gymnasium zu absolvieren computerbasiert, projektorientiert, mit Teamgeist Akzentfach mit Schwerpunkt auf digitalem Design Animationen, Film, Vektorgrafik, Webdesign iWeeks: Projektwochen im Klassenverband Arbeiten am Laptop auch in den Grundlagenfächern Freie Wahl von Schwerpunktfach & Ergänzungsfach wie wäre es mit EF Informatik? Freie Wahl des PU- und Maturaarbeitsthemas wieso nicht etwas mit Digitaltechnik? Informatik. Design. Kommunikation.
Lehrgang infcom.ch Flash 1. Semester Film 2. Semester Grafikdesign 1. Schuljahr 2. Schuljahr 3. Schuljahr 4. Schuljahr PU Angebot MA Angebot Flash Animationen Programmieren (ActionScript) Spiel-Projekt Grafikdesign Vektorgrafik Typographie Fonts Corporate Design Abteilungswoche: Fotographie Impulswoche: frei wählbar Impulswoche: frei wählbar Schwerpunktfach-woche: mit SF 1. Semester iWeek: Infografik iWeek: BEZ-Workshop iWeek: Programmieren iWeek: Leistungsshow Film Filmsprache Videoschnitt Film-Projekt (oneminute.ch) Web 2.0 HTML, CSS, PHP CMS benutzen Datenbanken Web2.0-Projekt iWeek: Layout (Bild & Text) Abteilungswoche: Filmwoche Weltstadt Maturarbeitswoche Maturvorbereitung 2. Semester iWeek: Fachwoche Legende: Akzentfach infcom.ch infcom.ch iWeeks Schulweite Sonderwochen
Lehrgang infcom.ch Akzentfach infcom SJ 1 SJ 2 SJ 3 SJ 4 Informatik. Kommunikation. Design. andere Klassen SJ 1 SJ 2 SJ 3 SJ 4 Akzentfach infcom AF AF iWeeks Sonderwochen Sonderwochen iWeeks Sonderwochen Schwerpunktfach iWeeks Projektunterricht iWeeks Ergänzungsfach Sonderwochen iWeeks Maturaarbeit
Animation & Interaktion Akzentfach infcom.ch Software Informatik. Design. Kommunikation. BiG Animationen erstellen Programmieren (ActionScript) Spiel-Projekt Animation & Interaktion Filmsprache Videoschnitt Filmprojekt (www.oneminute.ch) Film Vektorgrafik Typographie & Fonts Corporate Design Grafikdesign Scriptsprachen (HTML, CSS) Datenbanken, PHP CMS & Web2.0-Projekt Web 2.0 S1 S2 S3 S4 iWeek Fotographie iWeek Layout Impulswoche frei wählbar iWeek Film
infcom.ch ist das Richtige für Sie, wenn ... ... Sie die digitale Welt kreativ mitgestalten wollen ... Sie interessiert sind an den technischen und gestalterischen Hintergründen der Neuen Medien ... Sie gerne am und mit dem Computer arbeiten ... Sie gerne eigenständig oder im Team an individuellen Projekten arbeiten ... Sie Teil einer besonderen Klassengemeinschaft sein wollen Informatik. Kommunikation. Design.
Workshop Animationen mit Animate Ziel heute: Animierte Weihnachtskarte erstellen Erster Schritt: Animationen (Tweens) in Flash/Animate
Erste Animation Neues Schlüsselbild in der Zeitleiste eines MovieClips Neuer MovieClip (=Symbol)
MovieClips Fast alles in Animate ist ein MovieClip – oder kann einer werden Das ist praktisch, weil jeder MovieClip seine eigene Zeitleiste hat, und somit animiert werden kann Bitmap z.B. ein geladenes JPG-Bild MovieClip zeigt Bitmap oder Forms kann Zeitleiste abspielen „lebt“ in der Bibliothek Viele Exemplare eines MCs können in die Bühne gezogen werden, zur Unterscheidung braucht man Instanznamen Form z.B. direkt in Flash gezeichnet
Bild-für-Bild Animation In der Zeitleiste eines MovieClips Vorschau mit RETURN, Abspielen mit CTRL-RETURN
In der Zeitleiste eines MovieClips Formtweens In der Zeitleiste eines MovieClips zwischen zwei Schlüsselbildern, die Formen enthalten
In der Zeitleiste eines MovieClips Bewegungstweens In der Zeitleiste eines MovieClips EIN MovieClip, genauer mit Bewegungseditor
Workshop Animationen mit Animate www.nicolasruh.wikispaces.com/Schnuppertag Weihnachtskarte_vorlage.fla Dank an: Dario Breitenstein Nico Hauser David Schmid
Mehr Tweens ... Denken Sie sich weitere Animationen aus, die Sie in die Weihnachtskarte einbauen können Erstellen Sie dafür ggf. neue MovieClips und Ebenen Wählen Sie die richtigen Teile: Bild-für-Bild – geht immer Bewegungstween – geht nur mit MovieClip Formtween – geht nur zwischen Forms
Interaktion per Mausklick function schalOnOff(e:MouseEvent):void { schal.visible = !schal.visible; } knopf4.addEventListener(MouseEvent.CLICK, schalOnOff); ein oder mehrere Befehle, nach dem Klick werden diese ausgeführt worauf geklickt werden muss (= Instanzname) Aufzurufende Funktion, Name muss übereinstimmen (s. oben)
Nützliche Befehle meinClip.play(); //Zeitleiste abspielen meinClip.stop(); //Zeitleiste anhalten meinClip.nextFrame(); //ein Frame weiter meinClip.x = meinClip.x + 10; //meinClip um 10 Pixel nach rechts schieben meinClip.visible = false; //unsichtbar machen
Sound abspielen //Vorbereitung: Das Sound-Symbol in der Bibliothek ist exportierbar und hat den Klassennamen BellSound (Klassennamen gross schreiben!) knopf_mc.addEventListener(MouseEvent.CLICK, playSound); function playSound(e:MouseEvent):void { //Instanz von BellSound aus der Bibliothek holen var bell_snd:BellSound = new BellSound(); //der Instanz sagen, sie soll abgespielt werden bell_snd.play(); }
Werbefilme Welche auffälligen Stilmittel werden eingesetzt? Wie passen Inhalt und Form zusammen? Schnitte, Kameraeinstellungen – und Fahrten, Farben, Ton, Szenen, Spannungsaufbau Subjektives Empfinden: wie wirkt dieser Spot auf Sie? Zu schnell, zu langsam? Welche Gefühle weckt er? Was hätten Sie anders gemacht? http://www.youtube.com/watch?v=S1ZZreXEqSY&NR=1 (Heinecken) http://www.youtube.com/watch?v=4rzQI1D1zPI (Audi) http://www.youtube.com/watch?v=Y0Caq4WYNZ8 (Migros Huhn) http://www.youtube.com/watch?v=kb_FAqY040U (Schwarzfahren) https://www.youtube.com/watch?v=TsQXQGaasUg (Ikea Lampe)
infcom.ch-Filme Paintless (Maturaarbeit Tim & Miro, 2014) http://www.youtube.com/watch?v=LuCbYi_H6kY (making of) http://youtu.be/kpKAaksajLw SoNaFe (Jubiläumsfilme, 2014) http://youtu.be/kycBkkbC8Os?list=PLWCZTLSO2MtML5ROdoJIXyY4i Mwhnv3K4 Long way gone (OneMinute-Filme, Kunsthaus, 2010) http://youtu.be/yvppG0zAxZw?list=PL0CFACE5AD28CC475 Kreisverkehr (Filmprojekt G2E, 2015) http://www.muwie.ch/index.php?loc=kreisverkehr
Bildsprache http://photography.worth1000.com/contests/30739/beginner- composition-golden-mean-2013 http://www.dpreview.com/challenges/?utm_campaign=internal- link&utm_source=mainmenu&utm_medium=text&ref=mainmenu http://www.spiegel.de/suche/index.html?suchbegriff=bildkritik http://photography.worth1000.com/contests http://www.boston.com/bigpicture/ http://photo.net/gallery/
http://www.spiegel.de/netzwelt/web/drei-profi-tipps-fuer-bessere-fotos-a-897250.html
http://www.spiegel.de/netzwelt/gadgets/bildkritik-von-fokussiert-com-drei-profi-tipps-fuer-bessere-fotos-a-919878.html
http://www.spiegel.de/netzwelt/gadgets/fokussiert-com-drei-profi-tipps-fuer-bessere-fotos-a-914475.html
Flash Beispiele http://flashlernen.wikispaces.com/AlexandraSiebert http://flashlernen.wikispaces.com/Alina+W%C3%BCthrich http://flashlernen.wikispaces.com/Samuel+Cook http://flashlernen.wikispaces.com/TimMatter http://flashlernen.wikispaces.com/DominicM%C3%BCller http://flashlernen.wikispaces.com/Tobias.Luescher http://flashlernen.wikispaces.com/Jan+Obermeier http://flashlernen.wikispaces.com/Claude+Stark http://flashlernen.wikispaces.com/ (alle Projekte)