This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index

November 2015

November 01

Prakhar Bhardwaj
Hi everyone, I have been trying to import a design from sketch, where some images are masked over a rectangular layer. After the import, the mask seems to be non-functional in framer. Please help. I couldn't find anything online. Please help!
4
Djordje Vanjek
Another prototype from my challenge, make some noise 😝🎹🎧 Prototype → http://share.framerjs.com/7yu36qasz66f Check it out on dribbble too → https://dribbble.com/shots/2323321-Framerpad-framerJS-Challenge-4 Cheers
5
Callil Capuozzo
Found a cool little way to do multi touch gestures without hammer.js You can query for event.touches to return an array of the touch events that are firing. If you write a simple if/else to check for the events you can write logic based on the amount of fingers, their location and more. Here are four examples I wrote based on this, works really smoothly, let me know if you have any questions. These only work on touch devices. (tested on iphone 6s and lenovo windows machine): 3 finger drag: http://share.framerjs.com/2zgwf6xw6h66/ MultiTouchLines: http://share.framerjs.com/kyyp81vat6ag/ Pinch and zoom! http://share.framerjs.com/6mphpk6hnj4z/ Pinch and Zoom maps: http://share.framerjs.com/3kc3jehehqyn/ Thanks to Jordan Robert Dobson for revealing the touches thing in his force touch module and Ola Laurin for some svg things. Edit: Shape generics could have been very useful here - things like c1 = new Circle, l1 = new Line x1=-,y1 =0,x2=10,y2=10 with properties for each. Anyone written something like this before or might find it useful? also - anyone know how to get this to work on macbook trackpads?
17
Koen Bok
Twitch, a live streaming platform for games, just announced a creative channel. This could be pretty cool for live building Framer prototypes. Cool to help people get started, or to show off your skills. I think I'd like to do one of these, maybe together with Benjamin if he's up for it. Any suggestions for what you'd like to see us make? If you're looking for some cool examples of live building, see how Notch (from Minecraft) remakes Doom: https://www.youtube.com/watch?v=6p-Z6TXoN10 or how Kristoffer remakes the MPC interface: https://vimeo.com/71172009. http://blog.twitch.tv/2015/10/introducing-twitch-creative/
14

November 02

Marc Krenn
Jordan, let's talk Chat Heads! To me it seems like the "passing down"-method seems to work pretty well, beside some jittering at the end of the "tail". What do you think? final version: http://share.framerjs.com/oyy3fvogc8f1/ vastly improved v2: http://share.framerjs.com/0vhurv89y6py/ version 1: http://share.framerjs.com/4ie8ww3pfq8y/ (gif shows v1)
10
Noah Tsutsui
Double-tap event. Does it exist?
4
Don Behm
Is there a way I can disable the auto hiding of vertical scrollbar in the Framer UI? I have to trick it into appearing by selecting text outside of the viewable area or by horizontally resizing the editor window and it's kind of a bummer when I'm trying to work. Thanks!
2
Benjamin Den Boer
Introducing a big update to the Framer AudioPlayer Module, alongside an all-new example! The AudioPlayer Module for Framer makes it easier for you to prototype with music. It allows you to easily visualize the time, duration, progress, volume and more. It combines the power of the HTML Audio Methods with the flexibility of Components. Alongside the update, I’ve made a Material Design Music App prototype which contains multiple tracks, previous-and-next controls and more. On Github: https://github.com/benjaminnathan/Framer-AudioPlayer New Example: http://share.framerjs.com/download/v68wxklica9y/project.zip
14
Jorn van Dijk
We're hiring! I'd love to hear from you if you want to shape the future of Framer. Check out our new jobs page: http://framer.com/jobs/
12
Edoardo Guido
Framer was a nut to crack for me, since I've never been into coding and I've learn the basics of JS this summer... well, I've cracked the nut! Comments are much appreciated. http://share.framerjs.com/ernabz5xg1ll/ The hamburger menu button is based on Giel Cobben's, so: thanks a lot man!
4
Louis Currie
Dear Framerers is there any Event that can listen to Touch + Hold + x, y position? Mouseover would not be ideal in this case. I attached the prototype so you understand what I'm trying to achieve. Thanks in advance and feedback welcome :)
4

November 03

Ola Laurin
Is there an easy way to get the PageComponent to align the first page to the left and the last page to the right? Similar to how Facebooks mobile carousels work.
19
Jon Øvrebø Dubielzyk
On Layer 1 I have a bunch of stuff. Layer 2 is a modal. After I bring up the modal, I can still click on Layer 1 stuff "through" Layer 2. Is there a way to disable this?
2
Junhyuk Jang
Hi guys. I want to add css ‘outline’. so I did copy & paste this syntax on framerjs/docs, but it doesn't work. How can I fix it??
17
Thani Suchoknand
Hey Framers, I am trying to animate a scroll but can't seem to get it to work. I would think it would be something like the following: FeedScroll.animate({ properties: { scrollPoint: Feed.height }, }); Is this even possible or will I need to use jQuery to accomplish this? Thanks in advance, y'all!
5
Jiaxin Chen
Hi, all I want the `AnimationEnd` react on `animate 2` only, but now it impacts both `animate 1` and `animate 2`. Looked up documentation found nothing...
3
Jiaxin Chen
Hi all, here is another question. layerA is keyboard, layerB is a card that has a list inside which is scrollable. When layerB is on, touch the layerA can close layerB, but now when I touch the cross area it will be closed, how can I make the cross area invalid? Thanks!
2
Arron J Hunt
So I can hover over a layer in the inspector and see it highlighted in the code window. Can we have it so that when I am typing inside a layer, it highlights its name the inspector? That way when working with many layers I can quickly select it in code and see where it's at in the inspector.
1
Anton Jarl
Hi, I'm having problems with "ignoreEvents". I need to click an object in a scrollable list, and the list transitions to show the users what's behind it which is a another scrollComponent that I need to scroll. But I won't get ignoreEvents to work. That list still captures all events so I won't reach the under lying layer... Any ideas?
3
이정익
Hi everyone! I made a muti tasking concept sample. But it was not perfect performance. It was so a difficult control when page component layer become small size. Here is my source code. Thanks. http://share.framerjs.com/c8v7x0opxqg2/
8
Robert van Hoesel
Dear Amsterdam Based people: This weekend we're organising FuseHack, the biggest student hackathon, for 250 designers and developers. In the morning before the hackahton we're hosting several cool talks and workshops. Since one of the workshops got cancelled last minute we have a group of 80 motivated and young developers with nothing new to learn. Our ask: Can anyone in this group help us by giving a 45 min quick intro to Framer? It will be a great help! (Will be Saturday at 11.30 at B. Amsterdam)
0
Ee Venn Soh
Anyone getting this weird cursor problem on Chrome Version 46.0.2490.71 (64-bit)? I just opened an example on framerjs.com and the transparent png can't render properly. It works fine on other browsers.
15
Arturo Goicochea
Not a big deal, but everytime I'm adding states, I have to stop and be sure not to autocomplete the wrong thing ("addPage" instead of just "add"). Should "add" appear in the dropdown as a suggestion too?
2
Joshua Pekera
I'm polishing this prototype I did for LinkedIn's dormant users as a "welcome back experience". Got some micro interactions to still do, but its in a good enough place to share. Feel free to critique.
4
Richard Kho
I'm trying to set up a workflow that allows me to prototype in Sublime with Gulp + Framer, but is flexible enough that others can open it in Framer Studio for versatility. Right now I have a Gulpfile set up in a Framer Studio project that lets me live reload in the browser. However, I'm still relying on having Framer Studio kept open because it needs to occasionally re-compile my Coffeescript, which is not very ideal for my pace -- A while earlier, I ran into some issues with a compiled file that would not re-compile because the syntax errors I had were throwing reference errors to FramerStudio and Utils, and this required me to do some work replacing the files in my Framer subfolder from an older commit. Any suggestions? I'm happy to write vanilla JS, I just need the project to still work with Studio,
4
Keith Lang
This print statement works for me in Studio, but on iPhone it prints 'Undefined'. I *think* I'm wrapping it correctly, but it seems not. Any help would be much appreciated! myThing.scrollable.on Events.TouchStart, (event, layer) -> myTouchEvent = Events.touchEvent(event) startingPoint.x = myTouchEvent.x startingPoint.y = myTouchEvent.y gestureIsScrollCandidate = true print startingPoint.x
2
Dave Crow
I finally wrapped up this prototype (all the interactions are in the sidebar): http://share.framerjs.com/6fkai5jb3c1b/ The animations are pretty simple, but I used this project as a chance to wade further into the deep end of programming concepts. A few things I learned: - Creating a list of items by looping over an array - Interacting with and modifying layers in an array - New techniques using conditionals - including using “unless” A big thanks to everyone that helped out by answering my questions. This community is one of Framer’s best features!
3
Caitlin Charniga
Hi all. I have a simple app where i'm swiping left from screen to screen. I have each layer added as a new page in the pagecomponent. I have scrollvertical set to false in my pagecomponent, BUT I need it set to true just for one layer within. How can I do this?
4

November 04

Jeremy McAllister
Hello Framers! I'm working with my dev team on a quasi-functional, retina-quality iPad prototype app, and we're looking for tips on how to overcome the massive load time & performance chug that we've run into. We're up to 72 Layers, 4 VideoLayers, 6 AudioLayers, a SliderComponent, the "shortcuts" and "AudioPlayer" plugins being required, and over 40 Event listeners. Other than try to compromise on the quality of the 2048x1536 backgrounds, what can we do to help out our 61.10 MB mammoth page load? I hope this can be helped within Framer, and if not it's understandable. Thank you very much.
9
Don Behm
Hello! I'm still very new to framer, but I'm really enjoying it so far and this community is just awesome. Thanks for all the help getting me unstuck over the last few weeks. I've been working on a little menu system (73 lines) that uses a for loop to fill a Layer with as many buttons as you'd like. It has over and out states wired up and it keeps track of the active button. It also has a variable for the selected button on first run. Maybe someone will find it useful, maybe not. I'm hoping one of the more advanced users in this group will take a quick look and maybe shoot me a few pointers on how to improve on it? Thanks!
2
Jianqi Chen
Hi everyone, i have a question. in addition to click on the share button to get a url, is there a way i can find the file of my prototypes, so i can upload it to my own website?
3
Danny White
Hey friends. As promised, the first Framer NYC meet up will be held on Thursday the 5th of November, at ustwo New York. Would love to see as many of you there as possible. Know anyone in NYC who might want to come? Please also invite them too. It's gonna be great! cc Josh, Hoyd, Mindy
5
Reshad Farid
Hi I have trouble importing my sketch layers into framer studio. The import is going smooth but the layers are showing on just 1/4 of the top left viewer screen. I use the standard artboard size from sketch and I also found the template files that were provided by framer and those are fine (they are 2x bigger ). Does it mean I have to scale every artboard to 200% by hand every time I want to import from sketch and scale down when using it elsewhere? ( I am using iPhone 6 artboard by the way )
3
Krijn Rijshouwer
Just made this prototype for our Blendle Walkthrough. What do you guys think? http://share.framerjs.com/uru4ntnu637k/
8
Bhaskar Ravi
Hi Framer community. First post :-) I recently decided to give Framer a go, attempting to recreate Periscope's chat as a way to learn the ins and outs of the platform. I have a hacky solution up and running, with one issue -- when I switch away from the prototype, and then switch back to the prototype, the chat animations break. This happens whether I'm viewing the prototype in a web browser, or in Framer Studio. So for example, if I have the prototype open in one tab, and then switch to another tab / window / space for a few seconds, and then switch back to the prototype's tab, the animations go out of sync. I'm curious to understand why this is the case? Obviously if the prototype is refreshed, things work as expected. I've attached a link to the proto here: http://share.framerjs.com/zdghemekre9a/ Any help is appreciated. Thanks!
3
Thomas Law
Can I import an image in its original size, without defining its width and height?
25
Rafael T Balbi Jr.
Hey, what's the best way to get this javascript snippet going in my project? Upon insertion, I get an initial error of "Missing/(unclosed regex)" any ideas? <form id="link-form-id" method="GET"></form> <script src="https://cdn.plaid.com/link/stable/link-initialize.js" data-client-name="Client Name" data-form-id="link-form-id" data-key="test_key" data-product="auth" data-env="tartan"> </script>
0

November 05

Song Jianzhou
Hi I have this page component issue from beginning and someone told me this is a framer bug. Just want to make sure I didn't do anything wrong. why I didn't see the padding on the right when I swipe? Thank you!
1
Mudassir Ali
My first day at framerjs: Does framerJS support drag handle? Basically a component inside a layer that can be used to drag the layer.
3
Jeongmin Kim
Hello, Framers! I have a question about coffeescript. Could you explain difference between these two codes?
3
Andy Cetnarskyj
Any plans for Framer studio demo to highlight where the touch points are? Invision does something similar where it highlights briefly or if a user error where the touch areas are?
1

November 06

Jordan Robert Dobson
Drawing Lines Between Points Demo: http://jrdn.io/0j093u0Z0T2g After seeing Callil's work on the touch points and his pain points on drawing a line between two points I wanted to see if I could find a solid way to do this with some basic layers along side some animation. I think it came out pretty well. Next step is connecting the points as I loop through so they are all connected. Like one big nacho connected by cheeeeeeese... Grommit. :D
5
Brendan Donohoe
Hey Framers, I'm trying to make an infinite carousel of pages so you could swipe through the five or so pages and when you get to the fifth one, the next swipe takes you back to the first. I've been trying to manipulate PageComponent into doing this and not having much luck. I've tried adding new copies of the pages, but you can only add dynamically at the end. I've tried reordering the array in pages.content.subLayers using shift, push, pop, etc. but even with a call to updateContent, the page component doesn't seem to like what I'm doing. Has anyone successfully reordered the pages of a page component? Or is there another angle I can take to making the pages loop?
1
Rene D'Cree
I hope I am wrong. But I am having problems with Dragging and draggable layers and using them as they are now, does not make me feel that this is a meticulously framed library. Now, I am not using framer in its studio, I am using it as a standalone download and text editor. Draggable seems to be bricked badly. Here are my steps (pseudocode). ------------------------------------------------------- > create new layer1 < compile ok // layer is not draggable. fine > layer1.draggable.enabled = true < compile ok // able to drag the layer around the canvas, both X and Y // trying to disable vertical dragging > layer1.draggable.vertical = false < compile ok // still able to drag the layer around the canvas, both X and Y // disable horizontal dragging as well > layer1.draggable.horizontal = false < compile ok // still able to drag the layer around the canvas, both X and Y ------------------------------------------------------- scoured from the framer.js file lodash.VERSION = '2.4.1';
2
Rene D'Cree
on this page: http://framer.com/docs/#animation.animation spelling and grammatical mistake alert search for "rotate" and have a look at first example that pops up. in the section: layer.force2d <boolean> it should be "whether" and should be "When this is enabled" tnx
1
Djordje Vanjek
Hello people, Here is the new prototype from my framerJS challenge, hope you like it 🙃 http://share.framerjs.com/78xa2jz98yhw/ https://dribbble.com/shots/2337297-Meet-Djordje-framerJS-Challenge-5
1
Rene D'Cree
is there a way to export framer animation as gif? or as some format to be used in webapps built of html/css/js ?
0
Farid Kalirad
Does anyone knows a tool to create cool/smooth css/javascript animations for a website (not an app) with code-export? Has anyone done something like this with framer?
5
Carlos Santiago
is there a coupon to buy framer? i just played with it and the trial period ended and oh buy im in love!!! theres an input field for a coupon, hence my question; not being cheap but if theres a coupon, ill take it
3
Feles Daniel
Yet an other pull to refresh animation, i just had to share it :) https://dribbble.com/shots/2337389-Pull-to-refresh-animation-for-Skyscanner http://share.framerjs.com/32ms4kwaj8wr/
10
Jackie Chui
Don't we all hate that tiny close button in mobile Safari? Here's a concept for a more efficient tabbed browsing experience: Three-finger swipe left/right to switch between tabs. Three-finger swipe up to close tab. http://share.framerjs.com/y5jh5rzrtw23/ Design process: https:[email protected]/shortcut-gestures-for-ipad-safari-a582c0c87ef
6
Santi Allende
Hello! I am new to framer.js and I'm having trouble with how my sketch artboards are importing. View video below. Any help would be awesome!
3
Brendan Luu
Does anyone know if it's possible to slow down video playback in framer?
3
Андрей Миронов
Hey guys! Probably someone asked this question before, but anyways, is there a reliable way to capture and export a 60FPS GIF? Quicktime + Photoshop CC do not do that, unfortunately. Thanks!
10

November 07

Jeff Lin
Hey Framers, So I have a PageComponent at the top of the screen, and a ScrollComponent at the lower part of the screen, and I am using Utils.modulate to control the X of the PageComponent as I scroll the ScrollComponent. But for some reason, if I scroll too fast, the PageComponent will lag for like 2 seconds (00:03). Anyone know how to solve this? Thanks! http://share.framerjs.com/z50b282py5ko/
3
Alex Venus
Hey there Framer Community, i am writing you on behalf of our team at sehen und ernten - we are a design student initiative, created and run by students of communication design from the HTW - University of Applied Sciences Berlin, Germany. Our goal is it to teach other students valuable informations and get them some design jobs outside of the stuff they learn at the university. From time to time we give free workshops about design related topics for students. Some of our members are really into framer right now and we would love to have a introduction workshop or bootcamp. My question is do you know any (or are you a) „framer experts“ located in Berlin, Germany that might give a presentation / introduction for some students over at our place? Beer is on us! If you do just drop me a PM or Reply here :)
3
Brandon Souba
I'm trying to place a map within a smaller mask area and have it draggable only within the bounds of the mask. I figured draggable.constraints would work, but it is funky. I did figure out a solution using an if statement for the draggable x position of the map (if map.x > number, draggable.speedX = 0) , but is there something better? Here is the funky example:
4

November 08

Stephen Crowley
If you are in or around the Seattle area, come join us this Thursday at Substantial for our 6th Framer JS Meetup. https://www.facebook.com/events/1480854628891122/
1
Zhenchao Li
Hi everyone! I've just started playing around framerjs and having a good time with framerjs! Thank you for creating this! I have one question: I wasn't able to download framer generator linked from framerjs' github page: http://framer.com/static/downloads/Framer.zip and the generator is not part of framerjs it seems.. Is there a place I can download the generator? Thank you!
0
Eugene Dobrovolsky
Anyone knows of working links to map prototypes? Preferably with pins and scaling?
3
Danny White
How could I target/act-upon all layers inside an array, except for one? I'm thinking splice() and then re-targeting array is the way to go, but not having much luck. I'm re-writing Djordje Vanjek's drag and drop prototype, trying to get more familiar with using arrays. Original: http://share.framerjs.com/9nrr5kq2pcxi/ My version thus far (lines 90-104 is where the issue lies): http://share.framerjs.com/upt2ru81dm6x/ See commented-out text for a detailed explanation. Basically what I'm trying to do is animate the scale of all layers inside the array, apart from the one I'm interacting with. Thanks!
14

November 09

Kevin Schaefer
Does the ScrollComponent support any easy sort of way to find out which of its children are currently visible within the viewport? I have some more complex logic written to figure this out - but was hoping to simplify it.
3
Brad Wrage
Hi everyone, Is it possible to have multiple scroll components? I'd like the first page to scroll. From there you can click to a new layer(page) and be able to scroll content in there as well. Any ideas?
8
Lukas Imrich
Shouldnt something like this be possible? layers = [] numberOfLayers = 5 for number in [0..numberOfLayers] __layers["layer-#{number}"] = new Layer I am using the latest beta build, latest production build yet still having the same issue. All the layers are named: "Untitled", my expectation was "layer-1" and so on What am I doing wrong. It is actually possible to do something like I am trying to do there: layers["layer-#{number}"] = new Layer
3
Josh Ackerman
As I promised Marc Krenn, here is the source code for an example of a d3.js force layout in FramerJS: http://share.framerjs.com/vx817n41jf50/. This is a slightly modified version of the project shown in my dribbble shot: https://dribbble.com/shots/2183088-Graph-FramerJS-V2
8
Baisampayan Saha
Josh Puckett Thanx for the svg module...was trying something in the morning....It can really be used to do some awesome stuffs...:)
2
Naema Baskanderi
Hi All, I was hoping you might be able to help. I am using the native keyboard for my prototype. However I am finding that it is pushing my background image up and I am getting a blank area. How can I stop this from happening. It looks like it is allocating too much room for the keyboard. I'm using a module for the keyboard input:
1
JL Flores Mena
Hey Frameristos, I found a different way to create ScrollComponents with sticky headers. I decided to rebuild my module from scratch. It's much simpler and more flexible than before. Just add " name: 'StickyHeader' " to the Layers you want to become sticky. And pass your ScrollComponent through this function: "StickyHeaders.enableFor( )" Demo: http://share.framerjs.com/fzvyfeal4l3r/ GitHub: https://github.com/72/StickyHeaders-for-Framer I hope this saves you time in your prototypes! Let me know if you have questions.
1
Didi Medina
All my designs are made for iPhone 6 but I own a iPhone 6+ ... any way to get everything to scale to fit? Haven't found much on the topic on the group when I searched :/ Heres an image that kinda explains my ongoing complex at the moment...
3
Arron J Hunt
Is this a known bug? Using padding in the style attribute causes the layer's frame to break
3
Reshad Farid
Anyone know how far the update for the sketch import issue is? Like is it coming near future or is it not even on the plan? ( the issue where you have to scale layers up in order to get right format )
1
Sahil Khoja
What's the best way to target a layer in the Navbar? I'm trying to make the selected button's opacity 0.5 so you know that the screen showing correlates with that button. My layers look like this: tasks->NavBottom->Settings, Tasks, Home and I'm trying to target the 'Tasks' button. Thanks!
6
Sergio Masellis
Hello! I am new here! I have been trying to create a prototype of a dragable trending graph But i am not sure how I can pull off simulating different values in the graph. like graph would go up or down. Does framer.js have masking capabilities of svg shapes? I was thinking i would mask a few shapes to give the impression data is changing while swapping out masks.
1

November 10

Danny White
What am I missing here? I'd like to have the Framer.Defaults.Animation change depending on which page is active. Thanks in advance
8
Guus Baggermans
Hey Guys, I want to animate the height of a layer by giving coordinates for the Top and Bottom. Anyone have an idea how to best go about this? Trying both minY and MaxY just applies them one after each other, instead of scaling the layer :)
4
Jordan Robert Dobson
MODULE: Sprite Animation Layer Demo: http://jrdn.io/3I0L0G1W3B2L I had a few requests for this module today so I decided to post it up on http://framerCo.de This module helps you do a sprite sheet animation. You just have to provide the image, a single sprite size, sprite step count and the speed to step through the sprite. Setup looks like this: sprite = new SpriteAnimationLayer  width: 70  height: 100  steps: 4  speed: 0.1  stepsImage: “images/sprite.png” The methods you can call on the layer are:  • sprite.play()  • sprite.playOnce()  • sprite.pause() By default, calling .play() will continue to loop until you call .pause() on the sprite. If you only want to play once then use the .playOnce() method. The .pause() method will pause both of the .play() and .playOnce() methods. Framer Studio Source Simple Example:  http://jrdn.io/3Z2T1x2r2g2Q Framer Studio Source Advanced Example:  http://jrdn.io/3I0L0G1W3B2L Module:  http://jrdn.io/code/0E2g3D2l2T12 I hope this works well for you. Let me know if you find any issues or have any ideas on how it could be better. Thanks and Enjoy!
14
Jordan Robert Dobson
PRO TIP No need to use "transparent" for a transparent background on your layers. All you need to do is this to save a few keystrokes: foo = new Layer  backgroundColor: ""  html: "No bg color." I wish I would have figured this out a long long time ago. :D
8
Weston Thayer
Been looking at drag and drop to rearrange items in a grid recently. The iOS home screen is a good example of that. Work in progress...
3
Don Behm
Howdy gang, I'm looking to change the bottom border color of a layer with styles and states and not having any luck... here's the code... any thoughts?
3
Marc Krenn
Jordan finally gave me some reason to modify my constrainToCircle-module (http://bit.ly/c2circle) to make it work like a virtual analog stick, which is commonly used to control touchscreen games. It's a bit of a hack-job, but who cares as long as it works, right? :) stand-alone framer file: http://bit.ly/VirtualAnalogStick20 (new version!) SF2-themed version: http://on.fb.me/1MhPyte Btw, I'm using Jordan's great pointer- (http://bit.ly/1QbfigU) and my very own, not so great but effective, degrees- (http://bit.ly/FramerDegrees) and distance-modules (http://bit.ly/FramerDistance) :)
8
Hector Jaime
i heart framer!
2

November 11

Siavash Shabanipour
Is anyone else having issues with Frameless or Frames loading shared and local projects, it's just showing a blank screen. Opening in mobile and desktop Safari works fine.
3
Sindu Narasimhan
Looking for alternates. In the framer prototype below, I have a plane asset, which moves from x:100 to x:620. Since this animation is meant to show the origin and destination, I dont want the flight to backtrack to the destination. Rather I'd want it to restart at 100. One way I know to do this, is to make the opacity=0 when it reaches 620. Is there any other better way to do it without making it backtrack?
1
Anton Jarl
I have problems uploading/sharing. I get a big load of errors but the last row is "HTTPError: HTTP Error 413: Request Entity Too Large". Anyone else been noticing this?
4
Brian Sugden
Is there a way for an object to have different actions for vertical vs horizontal swipes? Example: Swiping down on screen will bring down a panel, swiping left would move user to another section?
9
Steve Lee Marreros Chuco
Hello. I tried to download Framer.Js to work outside Framer Studio by using this link: http://framer.com/static/downloads/Framer.zip However, I got "Sorry, this page could not be found". Any help on that? Thanks!
2
James Matchett
Does anyone else have a problem when importing text layers from sketch they seem very blurry? I've done the scale up in sketch and scale down in framer but that increases the load time. Any Solutions?
2
Weston Thayer
Finally had a chance to clean up the iOS Home rearrange prototype I showed last week. http://share.framerjs.com/cyy2x1py8yf1/ Feel free to suggest improvements at https://github.com/WestonThayer/Home.framer/. With a bit more work, I think someone could create a common module for grid rearrange.
6

November 12

Christian Dorian
Recently have been trying to find a simple way to do longpress as I am somewhat new to coffee script. After digging around I have found two solutions—neither of which are ideal for what I am trying to accomplish: 1) http://codepen.io/stakes/pen/ubfnw 2) http://framergroup.com/posts/664579473669127.html Basically, I am looking for a more straightforward way to have longpress and click perform different actions on the same layer. Appreciate any help!
6
Jorn van Dijk
Today, the team is attending Google's SPAN conference in London. Come say hi if you’re around!
0
Vilav Bhatt
Hello! What's the best way to export a prototype that can be self-hosted?
3
Santi Allende
Hi all! I am having an issue with pageComponent. When I snap to the third Artboard, the layers on the Artboard are scattered within and outside of the view window. I'm not sure how to remedy this. Any help would be awesome! View here:
0
Marc Krenn
Koen / Jonas is there a way to add a custom spring-curve by extending Framer's animator class using a module? Please excuse my naïvety, I've really no idea if that's possible or not.
2

November 13

Christian Poschmann
Question: I'm trying to change the background color of my background layer when switching to a specific page. What is the best way to do this? I managed to change it when using scroll.on "change:currentPage", -> module.colourTransition(background, 'rgba(74, 164, 233, 1)', 0.4, 30) Is there a way to say something around "if page 2 selected then backgroundColor is "..."
4
Paimai Ued
Hi there, just a quick question. When i use ScrollComponent.wrap(copy), sometimes it shows a layer called content but sometimes it shows ScrollContent... i am confused. what causes the difference? thanks
5
Didi Medina
Inspire thy self...
2
Rory Smyth
Can we please get support for the transitioning of background colours? This seems like something very basic that should "just work" with a prototyping tool. Especially a html/css based tool like Framer. I know and have tried all the options. 1. Creating 2 layers and crossfading. For a raster based tool, yes. But if i'm creating html layers manually, this isn't a good solution 2. Hack a null object and use modulate to change rgba values. Asking too much in my mind. 3. Custom modules? Not attached to Framer states or animation objects 4. Manual CSS attributes? Not attached to Framer states or animation objects Thoughts?
9
David Lee
This is not a framer question but I think it might be a good place to ask. I really want to know how important (or unimportant) micro animation like #twitter star/heart is. I'm wondering how conversion rate changed after twitter added the micro animation to the star. If you know something about it or related research/experiment, please help me to resolve my growing curiosity.
2
Marc Krenn
Benjamin / Koen Is there a way to change the draggable.momentum on the X- and Y-axis independently?
3
Aaron James
Layers in a ScrollComponent can be scrolled past the bounds of the ScrollComponent. When you let go of the layers they will bounce back. Is there a way to disable this behavior and not allow the layers to overscroll?
3
John Grendon Enderby
Any chance we could have the size in Framer studio for device screens (for desktop) to align with the predefined artboard sizes in sketch? Or include one in Framer for the Sketch HD desktop artboard 1440x1024?
3
Andrew Nalband
Here's a little way to create a circular progress indicator (view video in full screen HD for best results) There are squares, circles, splatters and more: http://share.framerjs.com/h3d2om1rrh7d/ Happy to share some of the other examples shown here if people are interested.
8
Dave Crow
Some interesting thoughts from Basecamp on choosing Framer for prototyping.
1
Keith Lang
Feature request for Sketch import: A little warning on import when there are layers that are not in layer groups. 😊
3
Aalok Trivedi
Anyone know why this is happening? I can't import any sketch files. Im on the latest version:
3
Matt Johnston
https://github.com/mattsjohnston/stitch I just finished an early version of a framework that adds interactions to your prototype without using code. Just by adding a trigger name on one of your Sketch groups you can trigger particular functionality in Framer. I've currently only created a component for scrolling, pagination and carousels, but the framework is extensible and it's easy to add new triggers. I'd love some feedback from the community here to see how I might develop it further.
2
Aalok Trivedi
Is there a way to add a different animation option for different state sequences? For example: layer.states.add state1: scale: 1 state2: y: -100 For state1, I want to have a spring animation. For state2 I want a ease-in animation. Do I have no choice other than to separate them out into completely different states?
2

November 14

Niels van Hoorn
Hey everyone, I really like Apple's CAReplicatorLayer (https://developer.apple.com/library/ios/documentation/GraphicsImaging/Reference/CAReplicatorLayer_class/index.html#//apple_ref/occ/cl/CAReplicatorLayer) so I recreated it in Framer. It's really powerful and you can do some pretty neat stuff with it, these are just some examples I could come up with: Spinner: http://share.framerjs.com/bikwgpcr473q/ Wave: http://share.framerjs.com/fenggjbizveu/ Swirl: http://share.framerjs.com/op7e3zfb5ctv/ Most of the logic is in the replicator module, which is less than 60 lines of code. Cheers!
5
Aaron James
What's up Framer fam! I built an Android on/off toggle tonight as practice. Have a peek and give me your feedback. There were a few hurdles I had to overcome to transition colors between the on and off states. Ultimately, I had to compromise and use grayscale and brightness properties to fake the transition. Does anyone know if Framer will support backgroundColor animation in the future?
1
이정익
Here is a sprite sheet animation. This is Teacher's day a special logo project made by my coworker 홍성인. It is a great animation. Actually, it is flash timeline animation, so changed to a sprite sheet animation to use framer js. Thanks for good a sprite animaiton sample Jordan Robert Dobson :) Share my code :) http://share.framerjs.com/kncdfo7ebcha/
9
Jordan Robert Dobson
A very good Framer article by the old 37Signals crew about how they prototyped Basecamp 3 mobile app. https://signalvnoise.com/posts/3978-building-basecamp-3-mobile-prototypes
0
Danny White
How could you append/prepend to an existing variable to a parameter passed in a function? In English: I have a strict naming structure for multiple properties. E.g. bananaFill, kiwiFill, bananaRadius, kiwiRadius. How can I act on both the `Fill` and `Radius` properties by just writing one `fruit` parameter in the function? See the attached images for the clearest representation of what I'm trying to do. Thanks!
3

November 15

Amit Patel
This might be a very old question but I'll ask anyways. Everytime I open a new Framer document, completely blank, an iPhone appears on the preview side. In the IDE there is nothing. So to remove the chrome, i use "bg = new BackgroundLayer " and if I remove that line, the phone disappears! Why would it do this?
2
Djordje Vanjek
Hello everyone, I just published 6th prototype of my framerJS challenge. Check it out, it works differently on desktop vs mobile. http://share.framerjs.com/ayb3yf2jvv3z Also if you're looking for dribbble invite → https://dribbble.com/shots/2348367-Safe-framerJS-Challenge-6
3
Benjamin Den Boer
Hey all! This week, we're going to work with Pieter Omvlee from Sketch to see how we can improve the Sketch - Framer integration. We already have a couple of things on our wishlist, such as layer group flattening, fixing masking errors, artboard scaling, PDF/JPG support, and more. I'd love to know what your major & minor gripes are, from feature requests to small issues you're running into. Please let us know! :-)
34

November 16

Lauren Nielsen
Hey Framer people! I'm glad to be part of this network (thanks Jordan) and I'd like to share my work and get some help. I'm working on my first prototype and I've gotten to the point where my brain hurts thinking through the logic, and I just don't want to research anymore. I think what I'm trying to accomplish is pretty simple, but I can't get it! I would like to set an active state for my menu buttons (right now when you open the menu and click on Schedule, it will change color), and I don't really know what way to approach that kind of thing. Probably with attributes in Layer States linked to a click event...
3
Way Chang
Hi everyone! Maybe It’s a stupid thing ~ I made a bouncing ball animation in framer. then I got a problem… “loop_limit” is “6” , first loop is ok but second loop -> loop display shows: 0,2,4,6 third loop -> 0,4,8 … framer project: http://share.framerjs.com/w8z627le1mea/ Any help on that? THANKS!!! and, is there a better way to key animation like this ?
5
이정익
I made the random position text animation. I'd like to introduce members of our study(framer js) group. Thanks!. http://share.framerjs.com/r2fa4do769f3/
4
Chris Nellis
Hey folks, I came across this group, very cool. If anyone is interested in any permanent UX/UI designer positions in London, I'm recruiting for some super sexy companies. Feel free to contact me by email on [email protected] Sorry to bring down the tone of the group with the business talk!!
0
Arvi Raquel-Santos
This is probably an easy question, does anyone know why I'm getting an "unexpected newline" error here? I'm basically trying to create an array for the animationoptions.
2
Santi Allende
Hey all! Can't quite figure out how to implement scroll.updateContent(). This is what my code looks like... scroll = new ScrollComponent width: Screen.width height: Screen.height scroll.scrollHorizontal = false scroll.updateContent() $.dayViewDash.superLayer = scroll.content $.annaFreudExpanded.superLayer = scroll.content $.sessionLogistics.superLayer = scroll.content $.currentProblems.superLayer = scroll.content The error is that each layer scrolls to the height of the tallest layer...
0
Keith Lang
Feature request: 'Copy Preview as Image'. Just a convenience feature, but as I log/share screenshots of work, it would be nice to be able to capture the current Preview view onto the clipboard.
1
Aaron James
I created a simple function for Android Toasts. It works, but I'm looking to make it better. Is there a way to calculate the textbox height automatically? my goal is to change the size of the toast based on the length of the message. See code here:
0
Guus Baggermans
Hey Guys, I'm trying to create a prototype with an automatic time-out after 5 seconds of no interaction. Right now I have a function that cancels the time-out when any button is touched, but this creates a lot of code duplication. My question: Can I capture a general Touch Event, that registers when any layer is touched, in stead of making it layer specific?
3

November 17

Matt Marriotti
How can I upon tapping a layer, get the X/Y position of the tap relative to the layer's area? If I grab the users tap X/Y position, it's relative to the screen, which is fine, but when I grab those coordinates upon tapping a rectangle because I want to make a Ripple effect on that rectangle (like Material Design), I need to determine the X/Y of the tap within the box's area, not the screen's area. I've been looking at the demo for the material effect, but I'm struggling to pull the position on the tap in my project. http://share.framerjs.com/fgrom3h8dgf1/ I figure there is some means to subtract the overall location of the rectangle in relation to the screen, but I'm struggling on what things to subtract out.
7
Algert Sula
Hey fellow designers! I recently posted an article on Medium about the tools I use as a full stack designer. Framer JS is in part of that narrow list. Let me know your suggestions.
0
Keith Lang
Feature request: Code folding and/or some ability to visually group code blocks. I'm loving the depth I can work at in Framer—having had years of experience in Quartz Composer, loving being able to extend a sketch into very featured prototype without tying oneself in noodles. Maybe it's just me, or maybe the designer-mind, but I find my eyes glazing over when I look at my own code after a few days. Request 1: Code folding (or better). I imagine I might select a block of code, click a disclosure triangle and have the entire block fold into a single line… would be nice if it picked up the first comment line as the 'title' of the block. Request 2: Perhaps the ability to remember these blocks, so even if the code is 'unfurled' then the visual 'blocks' are visible. Request 3: If nothing else, some general advice on best practice would be wonderful! For example, I've taken to drawing 'lines' with #'s to achieve some 'blocking', see image.
7
Kate Pincott
Hello advanced framer boffs! Who wants to teach a 15 people workshop in London on Saturday 28th (we are about to announce) Or you are quite good and willing to be an assistant? Message me
1
Keith Lang
Can anyone explain to me the reason for the comma in 'layerA.on Events.Click, ->' ?
2
Jonas Treub
We just shipped a new version of Framer Studio with a main focus on fixing bugs. A ton of stability issues were fixed, and some general improvements. We also added some nice polish, like a downstate for the cursor and made it retina. Thanks for reporting issues everyone.
13
Dan Clarke
Hey gang! just wondering if anyone here has experience with this:
3
Aaron James
I'm building out my first module today. Question for you guys: When I add my module to a Framer project, layer names I defined in my module are renamed to Layer 1, Layer 2, Layer 3, etc. Is there a way to retain the layer names?
0
Danny White
Does anyone have or know the link to this Framer prototype? Or one with a similar functionality? I'm trying to dynamically add layers to a scrollComponent (and push older layers down). It's called 'tasks.framer' in one of the screenshots. Thanks
6
Arvi Raquel-Santos
Anyone still using Frameless? If so, how do I navigate to a different project once one has already loaded in?
5

November 18

Richard Kho
Hello! What are my options for running a FramerJS prototype on a mobile device (not using Studio)? I plan on testing on both iOS and Android.
3
Stefanos Kofopoulos
Check out Stich, https://github.com/mattsjohnston/stitch A lightweight framework for adding interaction to your Framer prototypes directly from your Sketch designs. Here's a demo with interactions added automatically with Stitch using only folder names from Sketch. http://share.framerjs.com/14cxtooumuwv/
2
Wie Kiang
To all members. I am new with Framer, a newbie question for you guys, is this only for prototyping? If yes, after prototype what is the best way to transfer this to real apps?
2
Timon van Spronsen
Hi Framers, I'm prototyping a track selector for a DJ app. I'm pretty new to Framer and I'm not too happy with the code. I'd love to get some feedback on how I could be doing certain things better :). Demo/code:
2
Riccardo Buzzotta
Hello all, :) I'm logging things like: >>> print Framer.Device.deviceType Mirroring through Framer/Frameless apps, this info is passed (why?). So my question is: is there a way to discern when I'm outside the Framer Studio context? Thanks~!
3
Lukas Imrich
Hello, I just created my first class, Parallax Page Component, here in framer, which is extending Page Component. I commented whole thing, so you can see what I was thinking when I wrote that. Would like to see your feedback, and what I could do better next time. Here is the link: http://share.framerjs.com/ziczinikh1xd/ Big thanks goes to Josef Richter and his prototype http://share.framerjs.com/84ydhul7e29p/ from which I took all the parallax logic. Another big to whoever finds time to have a look :)
2
Rohan K
do framer prototypes not work on windows?
8
Bhaskar Ravi
Anyone having trouble loading videos in share links? Everything works fine in Framer Studio, but once exported videos don't load (.mov and .mp4). Videos in old share links that were working as recently as yesterday don't load anymore either. Tested on multiple devices!
6
James Matchett
Wondering if anyone else is experiencing this or how to fix it. When you scale an imported object the x, y, width and height all remain at the unscaled values. Is there any way to correct this?
10
Alex Ivanov
Hey guys, would you refer me to some examples of multi-screen apps (with 5+ screens at least) prototyped in Framer? Trying to see how complex would it be to prototype the whole app (not just one or two separate screens). Thanks!
8
Keith Lang
Not sure if it's me, but I find the 'light up' line numbers (for errors) being a little too subtle to find easily. Feature request: flash/pulse the number once or twice when error is clicked.
0

November 19

Christian Dorian
Hi All had a question about the Frameless iOS app. Everything looks great in the framer iPhone 6 preview on my desktop, but when I open in Frameless on my iPhone 6 the designs scale is off. Wondering if anyone else has experienced this issue. Thanks!
4
Jungmin Baek
Hi, everyone! Today I'm making a loading animation prototype for e-commerce page transition. http://share.framerjs.com/s48hmms7lbpx/ As you can see from this prototype, this animation should be repeated till finishing the page load process. (no user input events) Simply I just want to make this animation repeated. (because this is just prototype) Anyone know how to develop a repeated animation with no events? Thank you!
0
Oran Jacob
Hello framers, I'm battling with a simple animation in framer, my left side of the brain is dysfunctional today. Im trying to use states to simply animate menu with some elements around the logo and it all works 100% but then after a few seconds some elements form the menu goes bananas.. can some one throw me a wisdom nugget please ? (try to click on the logo > top left > and then close)
0
Fiona Rolander
Good people of the Framer community! I think I remember reading somewhere what you could name folders in Sketch to have them not shown up in your layer import list. How? Or did I dream this?
2
Ivor van Rensburg
Hello everyone, in Framer How do I capture a click outside of a layer? For instance, clicking outside a modal dialog to close it?
1
Jorn van Dijk
Exciting news everyone! Noah has collaborated with Skillshare to create a nice class on "Mobile App Prototyping: Designing Custom Interactions" It's free if you join: http://skl.sh/Framer
8
Jason González
Hello everyone! I need to prototype a desktop website! Could someone help me to know how to do it on framer? Help!
2
Alex Pereira
Hi folks, super noob here...brace yourselves. I'm trying to add a global touch feedback animation to my prototype. I figured I could individually register all the layers to the touch event but I'm bummed at the amount of code this will add. Is there a better, more global way to achieve this without manually registering each layer?
5
Ivor van Rensburg
Hi All, I'm trying to prototype a list based UI off an array, but I can't for some reason register a click of the item I'm clicking. Firstly every click prints out the last row, and secondly would you do it this way or is there a simpler way? The example is http://share.framerjs.com/wgaeta1l0xr8/
4
Oleg Andrianov
Design for Virtual Reality in Framer.js
0
Arvi Raquel-Santos
Anyone experience problems with files not opening? I'm trying to open my files and nothing opens. I'm on OS 10.10.5 and running Framer V 45. Starting a new file/project does the same thing.
2
Noah Levin
Want the chance to win a free copy of Framer? All you have to do is submit a project to the new Skillshare class by Thanksgiving (next Thursday, November 26th)! More info: http://skl.sh/Framer
2
Lynn Liangying
Working on a school project to prototype the climate system in car. I created a layer in framer called temperatureLayer, so by pressing the up and down temperature button, it can show decreased or increased temperature. But it says it is not an object?Can anyone helps me? By the way, how can I make the temperatureLayer be a sublayer of onoffcontrol layer? This is the link:http: //share.framerjs.com/yd66baqruk32/
3
Carolina Jucksch Paula
Hi all, I'm brand new to Framer and have a video player question. I'm trying to set a layer (Permissions) to animate in (Action) when my video ends (State). I am not sure what I'm doing wrong. This is the section (39-43) that's baffling me. I know there's a simple answer somewhere... Any help would be greatly appreciated. Thanks! #when the video stops and permissions appear videoLayer.on "ended", -> permissions.animate properties: opacity: 1
7

November 20

Jungmin Baek
Hi, I'm making a loading animation prototype for e-commerce page transition. http://share.framerjs.com/s48hmms7lbpx/ As you can see from this prototype, this animation should be repeated till finishing the page load process. (no user input events) Simply I just want to make this animation repeated. (because this is just prototype) Can anyone help me? :) Thank you!
1
David H. Shen
Hi everyone, I'm a Framer newbie. I'm wondering how Framer handles multiple artboards when I import? I can see them gray out and listing but seem won't be able to act on them. btw, Peter Urfer nice to see you here :)
5
Rene D'Cree
anybody knows how to bring the mac system status bar (the one with the apple icon and the clock) from its postition at the top of the screen to bottom, windows style???
4
Agisilaos Tsaraboulidis
New to framer what is going on? i imported my design from sketch and i want the introduction screen as my first screen but first i can't view the whole screen and second my introduction screen can't fill the whole iPhone! How i can solve the problems ? Thanks in advance
2
Niklas Jordan
Hey guys, thanks for the invitation! I want to build a working form validation in Framer Studio. Are there any ressources, tutorials or example you can recommend? Thanks, Niklas
1
Sergey Voronov
guys any way to know the absolute position of the layer to "viewport"? i have scrollable list of layers, want to trigger some events to the whole…i have scrollable list of layers, want to trigger some events to the whole array of levels, with effect depending on the absolute Y of the layer
0
Tom Smeeton
Anyone know how to make a video in a VideoLayer endlessly repeat? Got a project where the background is a video layer that needs to just loop over and over
0
Adria Jimenez
Just updated my Framer complete course to include a full section with new lectures about Virtual Reality, Jonas Treub component. Now making a total of more than 7 hours of video lectures. Use the BF2015 coupon to get the course with an amazing Black Friday discount!
3
Aaron James
I've begun building out a small suite of lightweight Android modules that will help accelerate prototyping Android apps. This first module animates in a static keyboard when it's called. You can define any of the Android keyboards (numbers, symbols, etc), if it's uses the light or dark theme, and whether AutoCorrect is shown. It's simple, yet useful. Take a peek. https://github.com/imaaronjames/Simple-Android-Keyboards I should also mention that this is my very first module and feedback is totally appreciated. Thanks Framer fam!
4
Chris Lee
Feature request: log all events to the console for easier debugging (or at least with an opt-in "verbose mode"). I have a bunch of overlapping layers with events that are probably all triggering, causing unexpected behavior that I've been trying to debug for a while now.
0
Guus Baggermans
Created this Radial Animation for a colleague. Thought I might share it here for whoever finds it useful :) http://share.framerjs.com/aw47up7lth1q/
4
Mike Scopino
First time working with the pageComponent and scrollComponent elements. They're great. But I can't seem to add any layers with click events inside of them. It works on desktop browsers but then the events don't fire when viewing in Frameless on iOS or Framer on Android. It seems like the dragging overrides any subLayer events. I made a simple example to demonstrate the issue. Can post code if needed. Swipe left/right to see pages. Click the white box on the red page to fire a click event. www.scopino.net/framer-test
1
Aalok Trivedi
What's the best way to detect when an element is over another element when being dragged? I want to drag a square object over a circular object, and when any part of the square object overlaps the circular object, I want the circular object to scale. When the square is off of the circle, the circle should return to its normal state.
1

November 21

Jitendra Vyas
http://www.appanimations.com/
0
Kate Pincott
Get tickets to the next #framerlondon workshop http://framerlondon.com/ hosted at Newspeak House on Saturday 28th November - 15 places!
0
Ivor van Rensburg
Hi Guys, still struggling with the issue I mention yesterday. I've created another version http://share.framerjs.com/e9shdvbts6dm/ which works to a point but still notice that it print out the last items content i.e Z and not the one you click on even though the animation happens on the clicked it. Any ideas
4

November 22

U-Kyung Kim
I found a cool interaction design on dribble, so I coded it using FramerJS :) *Framer share: http://share.framerjs.com/shegg0moz675/ *Dribble: https://dribbble.com/shots/2209627-UI8-Nav
1
Ning Chen
One lesson painfully learned: every layer suppose to own a unique name within one single Sketch/PS file.
1
Way Chang
【 Minion Bouncing Ball Animation 】 Hello! I’ve posted a question last weekend. Now the problem was solved ~ Thanks for my colleague’s help! The problem is something about " register & unregister events "... Framer Project: http://share.framerjs.com/hzx1m8synpom/ —— Bechance: https://www.behance.net/gallery/31452285/Minion-Bouncing-Ball-Animation
1
Eugene Dobrovolsky
Guys, I can't get the pop-in part to work right after the pop-out for every individual element. They only pop in after all the elements pop out. What have I got wrong? logoContainer.on Events.Click, -> for index, layer of pinsContainer.subLayers layer.animate properties: scale: 1.1 time: 0.2 delay: index/7 layer.on Events.AnimationEnd, -> @.animate properties: scale: 1.0 time: 0.2 curve: "spring(270, 0, 0)" delay: index/7
3
Aaron James
Next up from my suite of simple Android modules is Simple Android Toast. This module creates an Android toast just by calling android.toast in your project. You can easily customize the message too! https://github.com/imaaronjames/Simple-Android-Toast Let me know what you guys think. Cheers.
0
Денис Дрожжов
I often have problems re-importing layers from Photoshop to Framer. Most common problem is when some layers do not import or show up in the wrong place in the layer hierarchy. I suspect it happens when there are too many sublayers, but I'm not sure. Does anybody have similar issues? Are there any do's and dont's for Photoshop source files? Does Sketch import work better?
5
David H. Shen
Framerjs + gulp or grunt vs. Framerjs Stuido. Which one is easier and fit into your workflow?
2
Djordje Vanjek
I published my framer challenge prototype 🖐🏻✌🏻(7), at this one I wanted to play with the data from JSON file and it went very well. But I have a few questions: 1. Why is this prototype laggy in framer studio, but when I publish it works super well? 2. Is there any simpler way to access to an active (current) page from page component? You'll see that I used `id` but that's definitely not a good way to go since id goes like (4;6;8;10...) https://dribbble.com/shots/2358632-Solar-framerJS-Challenge-7 http://share.framerjs.com/qf43kqicp05m/ Thank you
1
Joon Won Lee
Ive been working on animating objects on Framer these days. And I tried few experiences on Framer Im inspired by previous posts about sprite animations posted by 이정익 and Jordan Robert Dobson And I see a opportunity on gaming prototype through framer. Below is what Ive worked for game prototype. http://share.framerjs.com/cxkb740nxgkt/
3

November 23

Timon van Spronsen
I'm having a little trouble with moving an object after an animation has ended to change the origin position of the object that gets animated next. When you click on the left half of the circle, other circles will surround the semicircle. My goal is to let the circles animate from the position of the previous circle instead. Illustration: https://i.imgur.com/LcPhSey.jpg. The animation is handled in the code starting at line 135. http://share.framerjs.com/5qsw1d4tx5fa/
0
Hanno ten Hoor
Hello everyone, my name is Hanno. I made a prototype Hue remote this weekend. The two circles represent lights, the slider on the bottom controls the brightness. It works by drawing a background gradient in a canvas element and the reading the value right beneath the circle while dragging. Changing the brightness is done by changing the brightness value of the gradient itself. So nice you have the full power of webkit available. Let me know what you think! http://share.framerjs.com/1dmffzeg2w7s/
6
Javier Chávarri
I've been working on integrating Hammer with Framer, so we can use something like: layer.on Events.Pinch, (ev) -> ... in Framer in a transparent way, including all the available gestures at Hammer: Pinch, Rotate, Tap, Press, Pan and Swipe. And also retrieve the parameters from Hammer events: velocity, angle, distance... I put an example in the following link -open it from your phone better, from your laptop the pinch and rotate examples won't work-. I would love to hear your ideas or suggestions! :) http://javierchavarri.com/framer-gestures.framer/
8
Malte Nuhn
A small interactive art project... the gif doesn't do it justice though! FWIW I find the declarative approach far easier to work with then P5*js / processing etc http://share.framerjs.com/4ie4c9u5jodh/
0
Adrian Forster
Framer London Workshop this Saturday. Come and join us!
1
Florian Pnn
Hi guys, I'm stuck on a coffeescript problem, I'm trying to use a variable (string) and use it as a key for a property to animate. I don't find any work around to make this work, how can I do it? A gist of the example I'm dealing with : https://gist.github.com/florianpnn/3f16fa1faa282021b137
3
Alexander Rauser
Hey there. I am trying to wrap a large website/desktop view into a scroll component so the user can see the entire page. It's imported from PSD 1170x2550 pixels. I tried: viewer fullscreen, but then I only see what fits into the browser viewport and there is no native browser scrolling (which makes sense) I tried also: layer = Framer.Importer.load "imported/design" scroll = ScrollComponent.wrap(layer.content) but getting undefined is not an object (evaluating 'layer.subLayers') What I am trying to achieve is showing multiple interactions on that large web page... Any help would be appreciated. Thanks! v45 (2537)
3
Jaime Fausto
The new update says "Updates expire on Oct 12, 2016" So now after a year, my app will expire? Seems like you're trying to turn it into a subscription model and thats not what I paid for.
8
Hidde van der Ploeg
What is the cubic-bezier of the effect used when you have a .snapToPreviousPage() with .animate?
1
Ning Chen
Hey guys, when I am trying to put an input field (layer.html = "<input />") in a ScrollComponent, it's no longer a type-able input field. Anyone can help me out? Here's the demo: http://share.framerjs.com/p826c9983hfo/
0
Brain Rush
Hello, I'm new to Framer and I'm wondering if it's possible to prototype orientation transitions. You know when your phone switches from landscape to portrait (or vice versa) based on it's position/the clinometer? Can anyone give me any tips related to this or point me to projects that have done it?
1

November 24

Alex Pereira
Noob here. I'm trying to position a rectangle at the touch location. Despite returning the correct value everywhere else in my code, the variable storing the touch coordinate returns (0,0) within the animation function (where I'm trying to position it at the touch location). Any ideas why this is?
1
Alfred Lui
To the Framer JS team: Is there any plan to add more Android devices to the viewer, like the new Nexus 6P, 5X or the Samsung Galaxy S6/S6 Edge?
2
Joshua Pekera
Just got done redesigning and adding some new feature ideas to part of the Lovely app. Really just design oriented, but any feedback is welcome. http://share.framerjs.com/7vewe03bugs6/
4
Jungmin Baek
Hi, I have one problem in developing some animation. I want to repeat the circles (around a rocket) highlighted in turn again and again. http://share.framerjs.com/vpq1p2yxp40f/ Now the 'circle highlighting' works only one time. How can I make this repeated action? Please help me! :-)
0
Manuele Capacci
Hey everyone, happy to have finally taken this step of testing Framer, and to have joined this community. Can't wait to be proficient enough to include Framer in my design process
2
Arturo Goicochea
My time has come! Here's my first shareable prototype (i.e. "finished enough"). I'd love your help and comments on it. It's an app I'm designing for keeping score when playing golf and helping calculating bets. At first I was using an "on-rails" design for creating a new game but I started to seriously doubt if this would work: what if they want to go back and delete/add a player? Change a bet? Do I know which order the want to/can configure a new game? I then thought: a way to solve this would be to have a quick navigation for the steps: selecting the golf court, adding the players and configuring the bets. My current design for starting a new game: show the steps and let them choose what they want. And at any point they can stop and go into another step (or finish that step and then choose the next). I thought it would feel cumbersome to have to go in and out but since they are only three steps..I feel the navigation feels fluid too. I guess testing with actual users will do the trick. Anyways, enough jibber jabber, here's my prototype!
1
Nicola Felasquez Felaco
Already posted? It's awesome!
27
Ban Nguyen
Could someone help please? I am new with framerJS. I tried to add an input into a scroll.content, it shows but I couldn't type. What did I miss?
5
Gregory Dean Hall
My clients have iPhone 6 plus's. I have designed @1x for iphone 6+ in sketch. Had to scale in framer by 3 to display on viewer iPhone 6 Plus. I have an iPhone 5. How do i now view it on my iPhone 5? Hew!!!
6

November 25

Lynn Liangying
Does anyone know how to do the fans' speed part? When press up or down the blocks will increase and decrease. Here is the link: http://share.framerjs.com/kq5jwjrvikgt/
5
James Cam
Was V45 just pushed? It was crashing so bad on load, I had to reinstall it. OS X 10.10.5
4
Gregory Dean Hall
how do you animate a mask shape over a fixed image from sketch?
15
Sungin Hong
Hey everyone, I made the interaction of the Apple iPhone calendar Updates will look to complete the next^^ Thanks!
1
Swaminathan Jayaraman
Hello Community, Excited to share my first prototype built out of Framer Studio. Alphabeta Lamps are a pendant lighting system from Hem.com that 8 different shapes, each with their own 3 different colors. This creates a total of 24 available shapes for one lamp. I've started to explore some advanced interactions - a more fun and intuitive way to customise the lamps for touch. Currently built using the Page Component and will explore draggable objects and expand the prototype for both top and bottom shapes, multiple colors and more lamps. Link - http://share.framerjs.com/8m5lc1c8iwq7/
2
Johannes Dänzer
I have some trouble with „Utils.modulate“. I want to use it multiple times to animate a element with scrolling, but the second „Utils.modulate“ overwrite the first one. This must be a super easy thing, but i don‘t get it can anyone help me?
0
Gregory Dean Hall
utilize phone camera or computer camera?
0
Gregory Dean Hall
Is prototyping on an iPhone 6 Plus a bad idea. I am getting really slow animations
11
Gregory Dean Hall
Perhaps adding a search bar would speed up productivity immensely for me. What do you think?
4
Aaron James
I had some more time today to put together another one of my simple modules. This time around, I created an easy way to include Android Touch Ripples to your project. You can find the module here: https://github.com/imaaronjames/Simple-Android-Ripple Any feedback? Let me know.
4
Jordan Robert Dobson
It was awesome to finally have a monthly internal Microsoft Framer meetup. There are some awesome projects happening and we're finally uniting across teams to share knowledge and tools. Super impressed and excited for this and our hack days.
3

November 26

Taylor Wright
Is there a simple grid list component (similar to the PageComponent)? I'm working on a prototype that needs a grid list that'll update its layout based on a one dimensional array with changing content.
5
Gregory Dean Hall
Help needed. iPhone 6 Plus not happy being shared!!!:(((
4
Yohan Baillet
I am trying to target a layer created with a for ... in loop for index in [0..7] layer = new Layer name: "layer"+index width: 6 height: 6 x: 0 y: 50*index All layer are named "layer1, layer2, layer3" but I can't access layer2.opacity = 0.2 Any idea if this is possible?
4
Joshua Pekera
It's officially Thanksgiving and I just want to say I am thankful for this wonderful community of designers. Everyone I have met through this group is genuine and always willing to offer help and guidance. That being said, I have two Dribbble invites to give away. I want to give them away to deserving designers in the Framer community. I only have two, so to be democratic please post a link to your best work and Dribbble handle so you can be drafted. The community can look at your work and give their thoughts and input on who they think are the best candidates. Keep in mind that design thinking and overall product design will be equally waited against grandiose visual design skills. I hope you all have a happy and safe Thanksgiving.
0
Gregory Dean Hall
Is it possible to have multiple layers in an animation function? Only the last one works!
14
Agisilaos Tsaraboulidis
Hello guys, i have a problem and i can't figure it out. I definitely need your help. I want to import my sketch file into Framer, but when i do it this is what happens! p.s 1) I asked this question again but i didn't figured it out either. p.s Also i uploaded a screenshot from sketch with my layer list etc. Thanks in advance!
1

November 27

Breno Baldrati
Hey everyone. I have a video layer that I want to send it to the background, but it's currently on top of my design/sketch import. How do I send it to the back? Or do I need to put the video inside a layer already imported from sketch (how?)? Thanks.
1
Adrian Forster
Just a quick reminder for those in London.. there are a couple of spaces left for the workshop TOMORROW!
0
Jakob Stecher
Hey, is there a way to include simple tracking via, for example, Google Analytics, in your prototype? Thanks in advance 😊
4
Taylor Wright
I'm surprised there wasn't a "Hipster Barista" meme about CoffeeScript at the ready when checking Google Images.
0
Genpei Zhang
Hi guys! Is there any way to call keyboard in iPhone in a framer project? I tried html input, but the keyboard push the content up.
1
Arwind Gajadien
Hey guys, just wondering: what are the best Framer prototypes you've seen in 2015?
3
Alexander Bennett
With the awesome help of Weston Thayer I was able to figure out how to automatically generate uniquely named layers. Unfortunately I'm having trouble using those unique names to have them do stuff after they have been generated. Like events based on clicking them, or animations. Any help would be greatly appreciated :-) Sample Project:
4
John Kopanas
Long time listener... first time caller! :-p #JustStartedUsingFramerYesterday Is their a way to make it so that when I move a parent layer off screen that all child elements follow automagically? http://share.framerjs.com/hbvq8k0t587a/ I have a layer called "widget" whose superLayer is the first page "viewSettings". When viewSettings get's moved off screen why does "widget" not follow it? And is their any way I can have it automagically follow it? Thanks... really loving Framer JS!
3

November 28

Lauren Nielsen
Good morning Frameristos! (a la Jordan) Hope everyone had a wonderful Thanksgiving! I just started using Sketch yesterday to build out the visuals of my next prototype. With the help of Rich, I group all my things so it's all imported how it should be, but how the heck do I call out the layers to add events or states or visible:true/ false or even add a 2x dimension so it's the correct resolution of the screen?? :D
7
Geun Hae Kim
Hi! this is my first work uploading on framerJS page. I made this with some pictures of my favorite movie called mommy. and titles that being below those pictures are titles of movie soundtrack list. I was very fun with making this prototype. so enjoy! :D
6
Gregory Dean Hall
I have read the docs, but as a designer I find it hard to install the modules, like a camera or gyroscope etc. I download stuff from github, follow read me but there seems to be a disconnect in terms of UX between github(dev type people) and designers who are temping coding. It makes it harder and more intimidating.
2
Khallil Mangalji
Are there any plugins / planned support for vim mode? Whenever I try moving down a line, I end up with the letter j :(
0
Taylor Wright
I had a really productive day today, all undone by 4 key strokes and a mouse click. Thought I'd share with the group.
1
Geun Hae Kim
hey guys. I need some help. I saved my project after I checked my prototype in viewer. and when I open my saved project, I can’t see the viewer anymore. Let me know why the prototype viewer is loading constantly. please help!
1

November 29

Dmitry Sholkov
Hey guys, any tips on how to showcase prototype for web in retina? I currently imported Sketch file with 2x, and scaled .Screen to 0.5. Prototype itself works fine, but safari preview window seems to be only 1x.
2
Taylor Wright
Questions about: Scope, Throttle, Modules, and superLayer's adopting size of subLayers I'm building a prototype that will augment Instagram's grid view. For this I've built a GridModule that allows custom layout functions (so you can animate transitions outside of the module). 1. SuperLayers are not adopting subLayer heights, so the grid grows but the ScrollComponent it's inside of does not, so I can't scroll. 2. When cells are added to the grid if you use the default behavior there is an "updateContentSize" that is called and everything works fine. However, if you write an animated behavior you need to adjust the content size after the animations are complete (app line 27-33, 59) but I have been struggling with managing scope here (my attempts with apply didn't work either). 3. Towards the bottom of GridModule.coffee I was trying to throttle behaviors but ran into scope issues There are 3 buttons that pop-up in the beginning, those will add 1, 2, or 3 image to the grid when pressed. This is a lot to throw out at once, I definitely owe a beer to whoever helps out. ;)
0
Taylor Wright
Utils.throttle() What is the scope of the handler function when called? How can it retain the initial scope? How can you pass arguments to the handler?
4
Baisampayan Saha
Hi guys need a quick help.... how can i stop the vertical scroll of a scroll component when i m scrolling a page component that has horizontal movement and is a sublayer of the vertical scroll component and another problem i am facing is that when i click a button i am not being able to call a certain page of a page component as the current page...
3
Cyrus Cheng
anyone kown that ? in the framer official website,there are The tutorial...one of them like blow... but i have try it in my new project in framer...it not work like chained infinitely.....
6
Andrew Larking
Is there a way to get more control over draggable constraints? Imagine a simple fix in the middle of the screen, you want overdraw enabled when dragon up but disabled when at the lower limit. Is this possible without some serious hacking?
1

November 30

Jordan Robert Dobson
I added three new android modules today to http://framerco.de thanks to Aaron James. I'll be posting a few of my own next week as well as a few others shared here in this community. If you're interested in contributing or collecting assets / snippets / examples / workflows / videos / or anything Framer related to post on FramerCo.de, let me know, and I'll add you to the group. Any help collecting great resources would be very much appreciated. Happy Thanksgiving! I'm definitely thankful for this community. You're the best.
1
Jameson Campbell
Hi everyone, just downloaded Framer today and had a quick question. When I import my iPhone 5/5c/5s design artboards from Sketch of 320x568 into Framer, the preview shows the following. Do I have to make larger Sketch artboards or is there a way to fix this in Framer? Any help is appreciated!
2
Don Behm
Hey! Is there a way that I can include or import a framer project into another one? My code is getting kind of lengthy and it's getting more and more difficult to manage/navigate as I progress. It would be great to build it all in pieces and have one main Framer project that compiles all of them. Thanks guys!
1
Guillermo Romero Jr
Is there a way for a layer to detect when it's over another layer? For instance, you're dragging layerX over layerY, causing layerX to have a glow. I've seen a few fake ways like detecting if layerX.y < layerY.y, but that only works in certain situations. Thanks!
2
Alex Pereira
Does anyone have any experience creating an <iframe> layer? The following code simply loads the page in another browser tab instead of within it's hosting layer.
1
Nick Bewley
Is there a way to set the fill width of a sliderComponent? For example, something like attached:
7

Monthly archives

2017

2016

2015

2014

2013