PAGE online
Produkt: eDossier: »Microinteractions: Animationen und Transitions«
eDossier: »Microinteractions: Animationen und Transitions«
Best Practices für Web und Mobile. Coding-Tipps für CSS3. Tools, Bibliotheken und Generatoren fürs Prototyping & Wireframing

Komplett visuelles Design-to-Code-Tool

In Framer X kann man einzelne Views mit diversen Transitions verbinden.

Framer X ist ein neuer, von der Framer-Open-Source-Community entwickel­ter WYSIWYG-Editor, der derzeit Web­designer weltweit begeistert.

Mit dem Design-to-Code-Tool lässt sich der ge­sam­te Interactive-Design-Prozess abdecken – von der Ideengene­rierung über die Erstellung interaktiver Pro­totypen mit echten Flows und Tran­si­tions bis zur Umsetzung. Alle Krea­tio­nen sind responsiv.

Zudem verwendet Framer X Algorithmen, um das Layout automatisch auszubalancieren, wenn man die Größe des Screens verändert.

Einzelne Code-Komponenten von Live-Karten bis zu Media-Playern wer­den als wiederverwendbare Patterns in einer Library gesammelt, sodass Entwickler sie prob­lemlos als React-Code weiterverarbeiten können.

Im dazuge­hörigen Framer X Store finden De­si­g­ner Icons und User-Interface-Elemen­te und können dort auch eigene Komponenten veröffentlichen.

Die erste Be­taversion von Framer X steht seit August zur Verfügung, der Launch ist für Herbst geplant. Hier geht’s zur Website.

 

Produkt: PAGE Digital 7.2018
PAGE Digital 7.2018
Designer & Coder ++ Designkritik ++ Editorial Design: »Focus«-Relaunch ++ How-to: Design Sprints ++ Texten für UX ++ Typedesign via Crowdfunding

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Das könnte Sie auch interessieren