GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → nataliemarleny → Casing

nataliemarleny / Casing

Licence: mit
The UI Framework for Framer Classic. Manages data, components and views

Programming Languages

coffeescript
4710 projects

Labels

frameworkuiui-componentsprototype

Projects that are alternatives of or similar to Casing

Involt
Inject hardware interactions directly into HTML layout.
Stars: ✭ 128 (+54.22%)
Mutual labels:  framework, prototype
Quiz App
A repository reflecting the progress made on the "How to Build iOS Apps with Swift, TDD & Clean Architecture" YouTube series, by Caio & Mike.
Stars: ✭ 230 (+177.11%)
Mutual labels:  framework, prototype
Components
MobileUI was created thinking of making your hybrid application faster and smaller since you only install what you are really going to use for UI.
Stars: ✭ 125 (+50.6%)
Mutual labels:  framework, ui-components
Css
The CSS design system that powers GitHub
Stars: ✭ 10,670 (+12755.42%)
Mutual labels:  framework, ui-components
Tonic
A Low Profile Component Framework. Stable, Minimal, Auditable, and Build-Tool-Free.
Stars: ✭ 265 (+219.28%)
Mutual labels:  framework, ui-components
Numl
A UI Design Language, WC UI Library, and Runtime CSS Framework for rapidly building interfaces that follow your Design System 🌈
Stars: ✭ 229 (+175.9%)
Mutual labels:  framework, ui-components
Wireframe
minimal wireframing css-framework 🎈
Stars: ✭ 146 (+75.9%)
Mutual labels:  framework, prototype
Zeva
a modern and minimalist ui framework for building responsive and modern frontends
Stars: ✭ 57 (-31.33%)
Mutual labels:  framework, ui-components
Ax Boot Framework
Full Stack Java Web Application Framework with Java & HTML5
Stars: ✭ 244 (+193.98%)
Mutual labels:  framework, ui-components
A17t
An atomic design toolkit for pragmatists
Stars: ✭ 236 (+184.34%)
Mutual labels:  framework, ui-components
Awesome Ui Component Library
Curated list of framework component libraries for UI styles/toolkit
Stars: ✭ 702 (+745.78%)
Mutual labels:  framework, ui-components
Novo Elements
UI Repository for Bullhorn's Novo Theme
Stars: ✭ 59 (-28.92%)
Mutual labels:  framework, ui-components
Go Web
A new Golang MVC Framework. Like Laravel... but faster!
Stars: ✭ 79 (-4.82%)
Mutual labels:  framework
Enduro2d
Yet another 2d game engine of dreams (work in progress)
Stars: ✭ 82 (-1.2%)
Mutual labels:  framework
Framework
Lift Framework
Stars: ✭ 1,224 (+1374.7%)
Mutual labels:  framework
Forge
Basic experiment framework for tensorflow.
Stars: ✭ 79 (-4.82%)
Mutual labels:  framework
Patternfly Design
Use this repo to file all new feature or design change requests for the PatternFly project
Stars: ✭ 82 (-1.2%)
Mutual labels:  ui-components
Infima
A UI framework that provides websites with the minimal CSS and JS needed to get started with building a modern responsive beautiful website
Stars: ✭ 82 (-1.2%)
Mutual labels:  framework
Rn Components Kit
A series of commonly used react-native components
Stars: ✭ 79 (-4.82%)
Mutual labels:  ui-components
Setl
A simple Spark-powered ETL framework that just works 🍺
Stars: ✭ 79 (-4.82%)
Mutual labels:  framework
View All Similar Projects ➔

Casing - A UI framework for Framer

✕ ⃝

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.

⃝ Installation

Copy over following files to your PROJECT_NAME.framer/modules/ directory:

  • 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

In large prototypes there is a one-to-one mapping with:

⃝ Frames in design mode

⃝ Code modules.

✕ ⃝ - Modules Description
Modules Example If you're new to modules in Framer:

  • Open the Framer directory using a text editor i.e. Visual Studio Code
  • The directory named 'modules' generated on Framer project creation will already contain an example myModule.coffee file.
  • The Casing.coffee file is required in this directory.

⃝ Getting Started

To be added soon...!

⃝ Examples

✕ ⃝ - Example Description
WebApp example example-webapp.framer

A non-linear multi-screen webapp built using Casing/Framer
TicTacToe example example-tictactoe.framer

A Casing/Framer version of the popular React Tutorial



⃝ Components

✕ ⃝ - Component Description
📅 Date Picker

Calendar
 FrmrDatePicker.coffee

A highly customisable 'real' calendar component for Framer

Tutorial will be made available soon
👇 Drop Down

Dropdown
 FrmrDropdown.coffee

A dropdown menu built with real data in mind.

Currently styled with inline CSS
💬 Text Inputs

Text Input
 FrmrTextInput.coffee

A customisable input box

Adapted from Ajimix's input module

⃝ FAQ

✕ 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

⃝ Thank You

A warm thank you to Twitter and Oliver Turner for help with the name.

Thank you with all of my heart to everyone at Framer for building such an awesome tool and a supportive community

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].