You must be a Pro member to watch this episode.

Get Access Now

Sign in now if you're already Pro.

1

Design-Based Symbols in Framer

10:29FreeDone
2

Using Templates and States on Symbols

6:45ProsDone
3

Replacing Sample UI Elements

7:16ProsDone

Load and Use JSON Data with Symbols

4:01ProsDone

Load and Use JSON Data with Symbols

Published by Chris Slowik

Episode Notes

Extra tips from the author

Sample JSON File

Here's a sample JSON file so you don't have to type out your own drinks if you don't want to. Just copy/paste into your favorite text/code editor. Make a new folder in your Framer prototype called "data" and save this file in that folder as "drinks.json".

{
  "drinks": [
    {
      "name": "Americano",
      "size": 12,
      "caffeine": 120
    },
    {
      "name": "Coffee",
      "size": 16,
      "caffeine": 80
    },
    {
      "name": "Latte",
      "size": 16,
      "caffeine": 120
    },
    {
      "name": "Espresso",
      "size": 2,
      "caffeine": 80
    }
  ]
}
Episode Topics: