Casing will help you to manage:
- Components (modular pieces of UI)
- Screens (sets of components)
- Data (mutable and immutable information shown in the prototype)
It is system which supports building truly big and complex Framer prototypes using real data.
Copy over following files to your
Casing.coffee- REQUIRED. Contains the entirety of Casing's code
FrmrDatePicker.coffee- if you want to use a date-picker in your prototype
FrmrDropdown.coffee- if you want to use a drop-down in your prototype
FrmrTextInput.coffee- if you want to use a text-input in your prototype
⃝ Frames in design mode
⃝ Code modules.
|✕ ⃝ - Modules||Description|
|If you're new to modules in Framer:
⃝ Getting Started
To be added soon...!
|✕ ⃝ - Example||Description|
A non-linear multi-screen webapp built using Casing/Framer
A Casing/Framer version of the popular React Tutorial
|✕ ⃝ - Component||Description|
A highly customisable 'real' calendar component for Framer
Tutorial will be made available soon
A dropdown menu built with real data in mind.
Currently styled with inline CSS
A customisable input box
Adapted from Ajimix's input module
✕ How will Framer X impact Casing?
When Framer X is released, Casing ✕ will become open source soon after.
This will likely require:
- Compiling coffeescript code into ES6
- Updates to optimise the design tab workflow for Framer X
- Releasing the components to the component store
The Casing Framework and its components will still be applicable for building big & complex prototypes in Framer X