A curated list of Framer prototyping
tool articles, resources, tutorials and other related things.
Framer is a tool to create animated
and interactive prototypes. It uses modern web technologies such as
JavaScript, HTML and CSS to extend the capabilities for advanced users
and auto-correct, intuitive error messaging or in-app documentation to
lower the learning curve for beginners.
Why
Framer.js Matters - Pedro Carmo on why Framer is a tool designers
should start using.
Videos
Stripe Speaker
Series: Designing with Framer - Koen Bok and Jorn van Dijk give a
short talk and Q&A focused on Framer that also covers prototyping in
general and a discussion of the various design tools available in the
market.
FORM SF 2014:
Panel - Design Tooling - Discussion between creators of popular
design tools (including Koen Bok from Framer) on the value of
prototyping, lessons learned in crafting products for designers, and the
future of UX tools.
How
to Create High‑Quality GIFs - How to Create High‑Quality GIFs, our
guide to making amazing GIFs with some of our favorite tools: ScreenFlow
and Claquette.
Framer-Grid
- Flexible Framer Module that creates a grid overlay on top of your
prototype to precisely align content or experiment early on in the
design process.
shortcuts-for-framer
- Collection of useful functions to make mobile prototyping with Framer
easier.
framer.placehold
- This is a module for framer that provides a library of different image
placeholder services.
FramerNavigationComponent
- Reusable and customizable navigation component for Framer, based on
iOS.
Simple
Android Ripple - Framer module for adding touch ripple animations to
any layer.
Simple
Android Keyboards - Easily add a static Android Keyboard to your
Framer Studio project with just one line of code.
Simple
Android Toast - Use this module to easily add Android toasts to your
Framer Studio projects.
Simple
Android Snackbar - Framer module for adding Android Material Design
Snackbars to your project.
Framer
Path - Create custom SVG shapes and animate each point
individually.
Material Kit
for FramerJS - Make prototyping with Material Design fast and easy
without compromising the quality or customization.
iOS Kit for
FramerJS - Make prototyping for iOS fast and easy without
compromising the quality or customization.
framer-Firebase
- The Firebase module allows your Framer prototype to load, save and
sync data effortlessly between multiple sessions and devices.
spotifyApiFramer
- Framer module that allows to get JSON objects when querying with
Spotify API.
ViewController-for-Framer
- Module for Framer helps you create multi step user flows with pre-made
transitions like “fade in”, “zoom in” and “slide in”.
Framer
Device Rotator - A Framer module that adds a rotation button to a
phone/tablet when said is displayed in a desktop browser or in Framer
Studio (but not on device).
