Adobe Edge Animate CC: 6 Funktionen, die interagieren und sich anpassen

Adobe Edge Animate CC: 6 Funktionen, die interagieren und sich anpassen

Bei Adobe Edge Animate CC geht es um viel mehr als das Verschieben von Elementen auf dem Bildschirm. Sie können viele seiner Funktionen verwenden, um Interaktivität für Ihr Publikum zu schaffen – und viele weitere Feinabstimmungen vornehmen, um die Software nach Ihren Wünschen zu konfigurieren:

  • Interaktivität: Sie können vollständig interaktive Animationen mit Steuerelementen und Aktionen wie Schaltflächen, Links und Schleifen erstellen.

  • Symbole: Sie können von Ihnen erstellte Elemente (z. B. Schaltflächen) speichern und in einer anderen Animation wieder verwenden.

  • Responsives Webdesign: Edge Animate ermöglicht es Ihnen, eine Komposition zu erstellen, die auf Browser- und Gerätefenstergrößen reagiert.

  • Mehrere Veröffentlichungsoptionen: Edge Animate bietet zahlreiche Möglichkeiten zum Veröffentlichen Ihrer Animation zur Verwendung in verschiedenen Anwendungen – wie beispielsweise verschiedenen Webbrowsern und iBooks – oder Sie können Ihre Adobe Edge-Animation in verschiedene Adobe-Produkte wie InDesign oder Muse importieren.

  • Schriftartenauswahl: Edge Animate bietet eine Vielzahl von Schriftartenauswahlen. Wenn Sie bei bestimmten Schriftarten wählerisch sind, ist die gute Nachricht: Wenn Sie eine Schriftart im Web finden, können Sie sie höchstwahrscheinlich in Ihrer Animation verwenden.

  • Wählen Sie Ihre Sprache: Wenn Englisch nicht Ihre Muttersprache ist und Sie es vorziehen, auf (beispielsweise) Deutsch, Spanisch, Französisch oder Japanisch zu arbeiten, dann ist Edge Animate genau das Richtige für Sie.

Interaktivität intelligent umsetzen

Mit Adobe Edge Animate CC können Sie viel mehr als nur Elemente zeichnen und animieren. Sie können diese Elemente auch interaktiv gestalten, sodass Ihr Publikum auf Elemente klicken kann, um verschiedene Aktionen auszuführen.

Sie können beispielsweise die Schaltflächen Stop, Play und Pause für eine interaktive Diashow erstellen. Sie können auch ein Menü erstellen, indem Sie Links hinzufügen, die es Ihrem Publikum ermöglichen, zu verschiedenen Teilen Ihrer Animationen zu navigieren – oder zu ganz anderen Webseiten.

Wenn Ihr Publikum den Cursor in Ihrer Animation bewegt, können Sie verschiedene Aktionen ausführen, wenn sich der Cursor über bestimmte Bereiche bewegt. Diese Art der Cursorbewegung wird als Mouseover bezeichnet. Wenn Ihr Publikum Tablets oder Smartphones verwendet, um Ihre Animation anzuzeigen, können Sie es ihnen erlauben, einfach auf ein Element zu tippen, um eine Aktion auszulösen.

Verwenden von Symbolen, um wiederverwendbare Objekte zu erstellen

Anfangs mag sich die Verwendung von Symbolen als etwas entmutigend erweisen, aber nachdem Sie Erfahrung im Umgang mit ihnen gesammelt haben, werden sie unverzichtbar.

Also, was genau ist ein Symbol? Es handelt sich im Wesentlichen um eine verschachtelte Animation, die Sie erstellen und die über eine eigene unabhängige Zeitleiste und interaktive Funktionen verfügt. Angenommen, Sie erstellen immer wieder dasselbe Element mit denselben Aktionen für viele verschiedene Projekte. Durch Speichern dieses wiederkehrenden Elements als Symbol können Sie es und die zugehörigen Aktionen für jedes Projekt wiederverwenden.

Ein Paradebeispiel für ein Symbol ist eine Schaltfläche. Wenn Sie feststellen, dass Sie dieselbe Schaltfläche neu erstellen – beispielsweise eine Wiedergabetaste für eine Diashow – möchten Sie diese Wiedergabetaste möglicherweise zur späteren Wiederverwendung als Symbol speichern.

Sie finden Ihre Symbole wie abgebildet im Bibliotheksbedienfeld.

Adobe Edge Animate CC: 6 Funktionen, die interagieren und sich anpassen

Einbindung von Responsive Webdesign

Responsive Webdesign ist neben HTML5 die neueste Schlagwort-Terminologie in der Webentwicklung. Ein responsives Webdesign ermöglicht es, die Größe Ihrer Animation je nach Größe des Browserfensters entsprechend anzupassen.

Dies kann vieles bedeuten. Angenommen, jemand sieht sich Ihre Animation auf einem Desktop-Computer an. Wenn der Benutzer die Größe des Browserfensters ändert, um es zu vergrößern oder zu verkleinern, werden die Elemente in Ihrer Animation entsprechend angepasst, wobei die neuen Größen auf Prozentsätzen basieren.

Wenn das Browserfenster beispielsweise auf 100 % maximiert ist, werden die Bilder usw. in Ihrer Animation mit 100 % angezeigt. Wenn das Browserfenster auf 50 % seiner Größe verkleinert wird, verkleinern sich auch Ihre Bilder auf 50 % ihrer normalen Größe.

Dies ist eine sehr leistungsstarke Funktion, da es heutzutage so viele verschiedene Bildschirmgrößen gibt. Sie wissen nie, ob Ihr Publikum Ihre Animation auf einem 60-Zoll-Display, einem 4-Zoll-iPhone oder etwas dazwischen sieht. Tablets tragen zur Vielfalt der Bildschirmgrößen bei.

Zählen Sie Ihre verschiedenen Veröffentlichungsoptionen

Heutzutage haben Sie mehr als eine Möglichkeit, Animationen zu veröffentlichen – und Adobe Edge Animate CC bietet Ihnen eine Vielzahl von Optionen (wie in dieser Abbildung gezeigt). Sie können Ihre Animation als eigenständige Webseite veröffentlichen oder in eine vorhandene Webseite einbetten.

Außerdem finden Sie Optionen, mit denen Sie Ihre Animation zur Verwendung in einem iBook exportieren können. Sie können Ihre Animation sogar als statische HTML-Seite veröffentlichen, um sie in älteren Webbrowsern zu verwenden, die HTML5 oder Animationen nicht unterstützen.

Adobe Edge Animate CC: 6 Funktionen, die interagieren und sich anpassen

Schriftarten in Adobe Edge Animate

Sie können eine Vielzahl von Schriftarten im Web verwenden, und Adobe Edge Animate CC hat Sie abgedeckt. Neben einer standardmäßigen Standardliste von Schriftarten, die Ihnen zur Verfügung stehen (siehe Abbildung), können Sie mit Edge Animate auch Schriftarten aus dem Internet importieren.

Adobe Edge Animate CC: 6 Funktionen, die interagieren und sich anpassen

Wenn keine dieser Schriftarten Ihren Anforderungen entspricht, können Sie Schriftarten aus vielen verschiedenen Quellen importieren – einschließlich Google Webfonts. Sie können auch Adobe Edge Web Fonts verwenden, die in Animate integriert sind. Und wenn Sie mit Typekit (einem weiteren kostenlosen Font-Tool) vertraut sind, können Sie sich darüber freuen, dass dieses Tool auch mit Edge Animate funktioniert.

Arbeiten in der Sprache Ihrer Wahl

Adobe Edge Animate CC ist in vielerlei Hinsicht global – einschließlich der Sprache, die Sie in Menüs und Bedienfeldern sehen. Wenn Sie sich wohler fühlen, in einer anderen Sprache als Englisch zu arbeiten, macht es Ihnen Edge Animate leicht, die in der Software verwendete Sprache in eine von vielen gängigen Sprachen zu ändern.

Im Hilfemenü, wie in dieser Abbildung gezeigt, können Sie aus mehreren verschiedenen Sprachen wählen. Wenn Sie im Hilfemenü eine Sprache auswählen, wird diese Sprache in der Software angezeigt. Zur Auswahl stehen ua Deutsch, Englisch, Spanisch, Französisch und Japanisch.

Adobe Edge Animate CC: 6 Funktionen, die interagieren und sich anpassen

Wenn Sie eine andere Sprache auswählen, müssen Sie Edge Animate schließen und neu starten, damit die Änderung wirksam wird. Nachdem Sie die gewünschte Sprache ausgewählt haben, wird die Benutzeroberfläche nicht automatisch aktualisiert. Schließen Sie einfach das Programm und öffnen Sie es erneut, um Ihre neu ausgewählte Sprache anzuzeigen.


Bildschirmaufnahme eines Abschnitts einer PDF-Datei

Bildschirmaufnahme eines Abschnitts einer PDF-Datei

Sie können das Snapshot-Tool in Adobe Acrobat CS5 verwenden, um sowohl Text als auch Bilder auszuwählen und ein Bild eines bestimmten Bereichs innerhalb einer PDF-Datei zu erstellen. Das Ergebnis wird allgemein als Screenshot eines Abschnitts in einer PDF-Datei bezeichnet. Das Ergebnis ist ein Bild, und Ihr Text ist kein […]

Messen, Zählen und Analysieren von Pixeln in Photoshop CC

Messen, Zählen und Analysieren von Pixeln in Photoshop CC

Die Messfunktionen von Photoshop CC wurden für Forscher und Wissenschaftler entwickelt und sind ziemlich leistungsstark. Sie können so ziemlich alles messen und die Anzahl der Dinge in einem technischen Bild zählen, vielleicht von einem Mikroskop oder Teleskop. Wenn Sie die genaue Größe eines Elements in einem Bild kennen, können Sie so ziemlich alles entdecken, […]

Die Verflüssigungswerkzeuge in Adobe CS5 Illustrator

Die Verflüssigungswerkzeuge in Adobe CS5 Illustrator

Wenn Sie die Verflüssigungswerkzeuge in Adobe Creative Suite 5 (Adobe CS5) Illustrator verwenden, können Sie Objekte biegen – also wellig, klebrig oder spitz machen – indem Sie einfache bis komplexe Verzerrungen erzeugen. Die Verflüssigungswerkzeuge können alle möglichen kreativen oder verrückten (je nachdem, wie Sie es betrachten) Verzerrungen an Ihren Objekten bewirken. Du […]

So passen Sie die Texteigenschaften in Adobe XD an

So passen Sie die Texteigenschaften in Adobe XD an

Wenn Ihr Adobe XD-Projekt Text enthält, können Sie die Texteigenschaften ändern. Zu diesen Eigenschaften gehören Schriftfamilie, Schriftgröße, Schriftstärke, Ausrichtung, Zeichenabstand (Kerning und Nachführung), Zeilenabstand (voreilend), Füllung, Rahmen (Strich), Schatten (Schatten) und Hintergrundunschärfe. Sehen wir uns also an, wie diese Eigenschaften angewendet werden. Über Lesbarkeit und Schriftart […]

So erstellen Sie QR-Codes in InDesign CC

So erstellen Sie QR-Codes in InDesign CC

Sie können InDesign verwenden, um QR-Code-Grafiken zu erstellen und zu ändern. QR-Codes sind eine Form von Barcodes, die Informationen wie Wörter, Zahlen, URLs oder andere Datenformen speichern können. Die Benutzerin scannt den QR-Code mit ihrer Kamera und Software auf einem Gerät wie einem Smartphone, und die Software verwendet […]

Arbeiten mit Zeichenflächen in Photoshop CC

Arbeiten mit Zeichenflächen in Photoshop CC

Genau wie in Adobe Illustrator bieten Photoshop-Zeichenflächen die Möglichkeit, separate Seiten oder Bildschirme innerhalb eines Dokuments zu erstellen. Dies kann besonders hilfreich sein, wenn Sie Bildschirme für eine mobile Anwendung oder eine kleine Broschüre erstellen. Sie können sich eine Zeichenfläche als eine spezielle Art von Ebenengruppe vorstellen, die mit dem Ebenenbedienfeld erstellt wurde. Es ist […]

Text umbrechen in Adobe Illustrator CC

Text umbrechen in Adobe Illustrator CC

Das Einwickeln von Text in Adobe Illustrator CC ist nicht dasselbe wie das Einwickeln eines Geschenks – es ist einfacher! Ein Textumbruch erzwingt einen Textumbruch um eine Grafik, wie in dieser Abbildung gezeigt. Diese Funktion kann jedem Stück ein wenig Kreativität verleihen. Die Grafik zwingt den Text, um ihn zu umbrechen. Erstellen Sie zunächst […]

So ändern Sie die Größe von Formen in Illustrator

So ändern Sie die Größe von Formen in Illustrator

Beim Entwerfen in Adobe Illustrator CC müssen Sie häufig eine Form mit einer genauen Größe haben (z. B. 2 x 3 Zoll). Nachdem Sie eine Form erstellt haben, können Sie die Größe am besten auf genaue Maße ändern, indem Sie das in dieser Abbildung gezeigte Bedienfeld „Transformieren“ verwenden. Lassen Sie das Objekt ausgewählt und wählen Sie dann Window→Transform to […]

So wenden Sie Transparenz auf SVGs an

So wenden Sie Transparenz auf SVGs an

Erfahren Sie, wie Sie in Illustrator Transparenz auf SVG-Grafiken anwenden. Erfahren Sie, wie Sie SVGs mit transparentem Hintergrund ausgeben und Transparenzeffekte anwenden.

Arbeiten mit Bildern in Adobe XD

Arbeiten mit Bildern in Adobe XD

Nachdem Sie Ihre Bilder in Adobe XD importiert haben, haben Sie nicht viel Kontrolle über die Bearbeitung, aber Sie können Bilder wie jede andere Form in der Größe ändern und drehen. Sie können die Ecken eines importierten Bilds auch ganz einfach mit den Ecken-Widgets abrunden. Maskieren Ihrer Bilder Durch das Definieren einer geschlossenen Form […]