Skip to content

joshpuckett/FramerWebView

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

FramerWebView

A simple web viewer for Framer.JS prototypes. Replace the iframe src in index.html with the URL of your prototype, then open it up in your browser and you're good to go! FramerWebView assumes iPhone prototypes sized 640px x 1136px, and Android prototypes sized 720px x 1280px.

Example: https://s3-us-west-2.amazonaws.com/tweakapp.co/Framewebview/index.html

FramerWebView Example

Features

  • Resize your browser, prototype automatically scales down
  • Use the controls in the top left to switch between iPhone and Android viewers
  • Swap prototypes using the input in the top left
  • Hit P to toggle between a black and white iPhone
  • Hit H to toggle the hand off and on
  • Hit B to cycle through various backgrounds (customize these in the backgrounds array in main.js)
  • Hit Z to zoom in to 100%
  • Mouse cursor is replaced by an easier to track bobble - add this to your prototype's CSS:
* {
cursor: url("https://s3-us-west-2.amazonaws.com/tweakapp.co/Framewebview/bobble.png"), default;
}

About

A web viewer for Framer.JS prototypes

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages