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

What is Framer? Join the Community
Return to index

July 2015

July 01

Noam Elbaz
Can anybody help me with writing a correct constructor? (I should be able to change their x/y independently )
24
Philip Lackmaker
Is your server down? Can't share my prototypes :(
1
Koen Bok
The share server went down. Again. It's not really a coincidence because more and more prototypes get shared everyday, which is great. I reset and upgraded the server so we should be good for a while now. Sorry for the inconvenience.
0
Nir Benita
Getting "The import failed. Sorry. Please check console.app for errors". When trying to load a new Sketch file into a fresh project, while all the console prints, is: `» Framer build 0` Are there currently any known issues?
11
Stefan Hvlmnns
To get all Layers that are available in Framer you would use: "Framer.CurrentContext.getLayers()" thx at Koen Bok for the hint!
2
Adam Deher
New to framer and coffee script, and am trying to wrap my head around the PageComponent. I can't seem to get the pages to transition from one to the next when clicking on an object in one of the pages. I am not getting any errors and the developers I am working with say everything is structurally correct. I don't think it is a scoping issue since I can access the properties of the page from within my function. Any help would be greatly appreciated. Thanks Link to working file:
6
Matt Barr
I have a layer in my prototype "width: 600, height: 2, backgroundColor: "#DCDBDB" and when setting the viewer to iPhone 6 at the "Fit" setting the layer no longer becomes visible, however it is visible when viewer is set to "50%". Was wondering if anyone else has encountered this before/ has a solution? Thanks!
4
Benjamin Udink ten Cate
Is it possible to import sketch files @2x? Right now if I import a sketch storyboard it only displays on 1/4th of the screen. I assume I could design storyboards in @2x only just for Framer but I'd rather not :)
3
Chris Camargo
Has anyone tried using Frameless on iPad & iOS 8.4? Everytime I tap the settings button, the app crashes. Known issue? cc Jay Stakelon
2
Stefan Hvlmnns
https://plus.google.com/hangouts/_/event/cjkr965g61klvcok680ueasd shocasting a module to make live easier, join if you want to
3
Anton Jarl
With the scrollComponent, do I need to do anything special to make it NOT scroll back to the top? I have checked examples but I see nothing in the code the differs from my prototype. Do I need to add something else except to wrap my Sketchlayer in a ScrollComponent?
6

July 02

Jason Nelson
Is it possible to call a function within a module that is defined in your primary app.coffee file? I've got a piece of modular UI that I'd like to be able to call a function in the parent document. Thanks in advance!
7
Patrick Arminio
Hi everyone! I was wondering if there's a bit of delay when using Events.AnimationEnd with states. I wanted to run another animation when a state animation was complete, but it seems to me that there's a bit of delay. Or is it just me? :) I was trying to share a demo, but I get this error when uploading the work: https://up.kibakoapp.com/v72OVsKSnk
14
Mathijs Kadijk
Hi there, I was wondering if there is a FramerJS Swift/ObjC library to do animations with or at least get the correct timings. Since Framer itself is written in ObjC/Swift it would be awesome if the animation timings would be officially supported by Framer itself. This would speed up development and make things a lot easier. Is there anything like this or is it an idea to create something like it?
7
Ola Laurin
Anyone with experience of using sprite animations and Framer? What's your approach? Know of any modules for the heavy lifting?
2
Arved Baumgärtner
Is it possible to make a masking effect similar to this one, with framers components?: http://jsfiddle.net/LmkwxkfL/ I've tried doing it with a simple mask, but could not get the content fix inside of it, while scrolling..
1
Chris Camargo
Is there a way to "transfer" momentum from one draggable object to another? I have a content layer inside of a ScrollComponent. The ScrollComponent is inside of a layer.draggable. Hierarchy: - layer.draggable -- ScrollComponent --- content When I throw my layer.draggable up, and it reaches the top of its bounds, I want to transfer any remaining momentum to the ScrollComponent inside, while also enforcing the ScrollComponent's scroll limits and bounce effect. Can this be accomplished? Happy to post a low fidelity example if this question isn't clear.
2
Alberto Moro
Hi people! When using a PageComponent, is it possible to access it from anywhere in the code to change its scrolling attributes? For instance something like: "page.scrollHorizontal: false"? I tried but it doesn't work. Any suggestion? Thanks in advance.
6
Édouard Urcades
For those of you with a second to spare, I'm having issues with a prototype I'm working on, linked here: http://share.framerjs.com/yc8qiezz0w6a/ Basically if you look around lines 56-59, I'm trying to build an if...else statement that sets my animateOptions to switch depending of the state of the animated object. First problem: The prototype works perfectly the first time around (clicking the button results in the drawer sliding out slowly, clicking the drawer header results in the drawer receding quickly), but after that, it gets stuck with the quicker animationOptions Second problem: Apparently the "else..." portion of the code is having very stupid issues with indentation, not sure what the exact issue is here, but I've attached an image with the problem I'm having.
4
Freddy Roosevelt
Who can point me in the direction on how to take my framer prototype from Framer to Swift 2 or Swift 1.2?
37

July 03

Rich Zarick
Here's a sneak peek of something I'm working on - triggering the lights in my apartment with Framer, via Parse via IFTTT. It's ...a bit reckless with the number of linked platforms, but if you haven't seen the maker channel on IFTTT yet, it really opens up a ton of possibilities! Check it out. https://ifttt.com/maker
18
Rafael Puyana
Is there a way to use css blend modes in Framer? http://goo.gl/YMdtVB
2
Alberto Moro
Hey folks! Very basic question here. If I create a pageComponent and I add a couple of pages to it, is it possible to temporary disable the swipe between the pages? "scrollHorizontal: false" locks the very left and the very right border but doesn't do it. Here's the link if you want to take a look. http://share.framerjs.com/lwr9tregaq4u/ Thanks!
9
Dae Hyuk Yoon
Is there an elegant way to only allow event listeners on the top layers to be active and block any other listeners?
3
Ilie Ciorba
After updating Framer I have this issue of having my prototype perfectly centered when next to code and completely misaligned when in presentation mode. It's not a particular layer that's misaligned, but the whole prototype. Anyboby else had this? :(
6
Cody Doherty
Hey I'm new to using Framer and I'm attempting to design/develop my first app. I'm very critique oriented so any suggestions/advice you could provide would be very much appreciated.
0

July 04

Freddy Roosevelt
The more and more I prototype in framer studio, it really lets me know how technology is really moving forward and making life as a Coder easier. Example: I decided to do a ui search vc prototype today and it only took about 15 mins to do. Me knowing the process of sketching an idea out before would take me 10 mins to think of how I want to sketch it, another 10 mins drawing the sketch then go in Xcode and work on it (which will take about 30 mins in coding then designing it). Total time about an hr. Now why is this 10mins in framer so important? B/c now I won't waste time! if I don't like how it looks or feel by prototyping, I can just make any changes I need to before I take my idea into Xcode. As we all know time is important and time wasted can never be given back.
1
Claudio Silva
Anyone with some tips to display the prototypes in a gif animation? I recorded it using quicktime and after made the gif on Photoshop but it looks like rubbish. any advice?
3
Chakri Jagarapu
I tried searching everywhere and i have a very serious doubt now. This framerjs is only used to create prototypes and just for presentation purpose or else we can actually create minimal apps using this. Like , create apps and releasing them in store etc etc ... or just for the purpose of presenting Thanks in advance
8

July 05

Sarah Kranz
Hey there - beginner level question ;) I'm currently working through "CoffeeScript for Framer" from Tessa Thornton. In the second example, "Toggling between states", the dropdown only opens if the menu_icon gets clicked two times. Can anybody tell me why and how to make it work with one click?
7
Brian Moon
Hello everyone, I'm a Framer newbie and trying to learn Framer from random tutorials that are online. Can anyone recommend a course that will teach me from the basics to advanced prototyping? I am willing to pay as long as the course is well-structured and has enough content to learn on my own. Thanks!
3

July 06

Claudio Silva
Hello good community, hopefully someone can help me with this. I have an image on the background and a pageComponent with 3 semi-transparent pages on top. I want to be able to while swiping from page 1 to page to change the opacity of the image from 1 to 0. I can do this with a ScrollComponent but I can't seem to find the solution with pages. Any help with this?
6
John Grendon Enderby
Hi guys, if I have two artboards that are named differently, but the layers within are named the same (i.e. Artboard_1 > button and Artboard_2 > button) how do i store buttons into variable for use in demos? If i use button = sketch.button there is no functionality, which I assume is because the layers are named the same. How do i store them into separate variables? tried button = sketch.Artboard_1.button but doesn't work... Would love some help please :)
5
Dan Clarke
Hi everyone. I'm just starting to learn Framer and have encountered an issue. I created some assets in sketch and I've got an animation that when clicked the image grows to 1.5 size before receding to 1.25. However, the time property doesn't seem to be working for me? The image below shows it at '0.25' but it don't seem to have any affect, it always animates at 1 second regardless of my setting? I'm working in the trial version right now if that makes any difference?
19
Cassandra Lewis
Hi All, Does anyone know if there is a way to take down a link once shared to the web via Framer Studio?
2

July 07

Kasper Andersen
Hey Is it possible to change a text (.html propperties) in a click event? Let say i have a text layer, I use a variable to define the text like: text1 = "Lorem Ipsum" text2 = "Something else" textLayer.html = text1 I want to change textLayer.html from text1 to text2. Is that possible?
9
Brooks Hassig
Hey guys! First time poster / long time lurker here. Got a tiny little question I can't seem to figure out on my own. I'm trying to get the navbar and top stuff to disappear when the cards are scrolled. This works on the up scroll, but is buggy on the down scroll. What am I doing wrong here? http://share.framerjs.com/rar41u1o53ws/
17
JL Flores Mena
Ok group, I owed you this, StickyStamps-for-Framer: A module to create scroll components with sticky stamps. I'm still working on the documentation, but right now it pretty much covers everything you need to create your own stamps. https://github.com/72/StickyStamps-for-Framer And thanks to everyone who read/shared my post 'Unlocking ideas' in Medium! You guys rock.
7
Jesper Garde
This is my first Framer project, based on what I've learned from Tessa Thornton's CofeeScript for Framer.js book. Would welcome feedback on the code. Things I know could be done smarter: - Load and animate the five social media icons with an array - Place the five social media icons relative to the bubble (superLayer) Next step is to make the page draggable. http://share.framerjs.com/i933zbzae0yq/ (Click the share icon) Thanks!
4
Claudio Silva
Finally after some inicial problems, (but how boring is life without challenges) my Designer Quotes prototype is finished. Find the Framer version at http://share.framerjs.com/zkptrmd7w7mn/ and a special thanks to Jonas for the help solving the referred inicial problems. Hope you enjoy and get Inspired by the Masters. Feedback is always welcome.
4
Mudassir Azeemi
I was discussing with my teammates about the FramerJS bit. I have a question, it is so cool and dandy to make the interactive screen however how to build the prototype of a flow, for instance if I want to prototype the purchase flow with nice Interaction from one screen to another is there is a way to do it? Like linking couple of screens!?
2
Kev Craven
Hello - I'm playing around with Framer (as a designer with limited coding knowledge) - I am using a TouchEnd event to go to the next state of a circle I've drawn, but I want the opacity of the shadow to animate, at the moment it just plays the animation, and then it snaps to the new (rgba) value. Is there a simple solution to this?
4
John Grendon Enderby
Hey folks! Just wondering about if statements in framer. Is it possible to do something like: if oneItem.visible is true or twoItem.visible is true mask2.visible = false else mask2.visible = true Not sure if I have done the if/else right or not but could really use some help :)
5
Anton Jarl
Quick question. I have a menu on the left side and a menu/panel sliding out from the right. Whenever the menu or the panel is visible I want to stop all other interaction (like you shouldn't be able to slide the content in the background or click any buttons). I have an Overlay-layer that also appears under the menu and panel to darken the background. How would I do this? Do I have to stop all event listeners on all the layers, or could I have the Overlay layer collect all clicks and just du nothing with them? What's the best approach?
10
Dan Clarke
Hi everyone, is there a useful learning resource for framer and sketch? I've seen this book which I'll but (http://coffeescript-for-framerjs.com/#buy) but just looking for some guidance on working with sketch in framer. Should I (can I) be using page components or layers when I have content from framer? I.e. can I work just the same way as I do with regular created framer objects?
5
John Grendon Enderby
Hello everyone, another quick one from me. Has anyone tried importing objects from Sketch that were imported as not visible and then tried to show them and it not work? Opacity is 1 on the layers and the layer inspector panel shows that they should be active and visible, but they aren't. If I import them as visible and then hide them by default I have no problems. Wondering if this is an issue?
19
Poamrong Rith
Trying to recreate this shooting effect that I saw on dribbble. Close, b not exactly there... suggestions? http://share.framerjs.com/sljapgylqxqu/ thnxx
9

July 08

Jordan Robert Dobson
Layer Events: Create & Destroy Example Code: http://jrdn.io/bsO7 Joshua Tucker asked me if there was a way to listen for an event when a new layer is created. I dug around this morning and found a way to listen to create & destroy events for any layer at the root or as a sublayer of another layer. This is helpful for when the "change:subLayers" event won't suffice. Let me know if you have any questions or concerns... or even better ways to do this reliably. Click the circle to fire the destroy event. #framerCode
5
Benjamin Den Boer
Hey all London folks! We'll be flying over this weekend to give a presentation + workshops at the UsTwo offices. There are still a few spots left! If you'd like to join, contact Kate Pincott to confirm your attendance. Date: Saturday 11 July, 10:00AM - 6:00PM See you there! :-)
6
Pete Schaffner
If you'd like to use Google Fonts in your prototypes, but want to avoid touching index.html, this module might be for you: https://github.com/peteschaffner/framer-googlefonts If you have any interest in using it with Typekit or another service, holler and I will make the API more extensible.
7
Sergio Majluf
Hi! I'm trying to come up with the best way to code the following image. My idea is to swipe up/down to adjust the value of the number in the middle. When the user is done, she would tap the larger number and be redirected to a previous screen. I've tried using a transparent Page Componenet in the bg, and using ot's offset to math out the value, but it's very hacky. I also thought about tracking drag events, but it would be a similar approach. Have you done something like this before? Any tips, ideas or leads?
4
Guus Baggermans
Hey guys, I'm playing with transparent videos from After Effects. It seems it only plays them 1 in every 2 refreshes. Am I trying unsupported things, or is it a bug?
5
Rhys Merritt
Hi Guys.. Not sure if this has been asked before, but here goes anyway... Is it possible to set an animationOption to a single, specific state? I have just started creating this prototype here - http://share.framerjs.com/zgixgtjug94t/ The issue I have, is that I am happy with the delay of the layer 'textone' for the 'reveal' state, but I would like to have no delay at all on the 'fade' state of this layer. Is this possible? I hope that made sense... Thanks!
5
Greg Woods
Hi guys, It would be useful to be able to automatically generate shortened variable names for my layer groups imported from Sketch. The lists can be quite long when I do this and it takes a while to do them. How can I target the layer groups please. I assume it is a function with a loop?! Thanks for your advice. demo = Framer.Importer.load "imported/wishlist_prototype5" back_he = demo.back_he cancel_create = demo.cancel_create cancel_edit = demo.cancel_edit close_ho = demo.close_ho content = demo.content curser = demo.curser delete_list = demo.delete_list done_create = demo.done_create
5
Luca Cioria
do you know if animated gifs are supposed to work in framer? I've tried but it doesn't seem to work..
3
Jérémy Jones
Hey guys, I'm trying to use Typekit and I have a question. What do you put inside the domains input? http://cl.ly/image/471S0o3o0u2Y I tried localhost,etc... but I can't see my font.. Also, I put the javascript from Typekit inside my index.html. Thanks!
9
Cole Townsend
Hey guys! Here's my first framer project, a prototype animation for http://meta.sc: http://share.framerjs.com/4uvpgrigkl0u/
4
Jordan Robert Dobson
Animation: Sprite Sheet Animation Demo: http://jrdn.io/btQd I'm one of five presenting Thursday and the demo is part of my talk at Seattle FramerJS Meetup 02 on animation and modules. Event: https://www.facebook.com/events/440491706131696/ I'll post up all the pieces after the talk. The demo above is a small piece of what I'll be talking about.
7
Katie Wu
Hi everyone I'm relatively new to this so I have some basic questions: I have five ScrollComponents and at any time only one of them is visible—but I have a persistent navBar, which is NOT a superLayer of the other components. I want it such that whenever the navBar is clicked, the ScrollComponent that's currently visible scrolls to the top. Is there some way to find out which is visible, or should I just stick them into an array and loop though it, and check for visibility that way? Thanks!
3
Arvi Raquel-Santos
Anyone else getting the attached error when trying to share? Console doesn't really show much either.
2

July 09

Pete Schaffner
Wrote a little module for tinting icon template images with solid colors or gradients. Pretty handy for speccing with the production assets you create. Module: https://github.com/peteschaffner/framer-icon Example: http://share.framerjs.com/edojz1mvguvx/
7
Julian Veerkamp
Just a quick question, how does FramerJS handle Sublayers with the same name of different parent layers? Example: ParentA --Layer1 --Layer2 ParentB --Layer1 --Layer2 I imported those Layers from a Sketch File I'm working on.
5
Kasper Andersen
Hi I have these 3 layers, that are doing the exact same animation, on the exact same time. Is there a smarter way to write this?
3
Josef Richter
Hi guys, I have a simple web prototype with all layers imported from Sketch. However, everything is kinda blurred, as if everything was shifted half pixel. Any ideas why it's happening and how to fix it please? Thanks for help.
2
Dan Clarke
Hey everyone I have another question, how is the best way to show an animating cursor in a text box. not sure if there is a better way but I created a layer called 'cursor' and tried the shown code to get it blinking but to no avail?
6
John Grendon Enderby
Has anyone else had an issue where you animate the height, but it doesn't behave as expected (importing from Sketch)? E.g. if I set an initial height to 0 and then animate to a different value in order to reveal the layer, weird stuff happens. It will work for the bottom most layer-group I'm trying to animate, the layer-group above that is just visible all the time (but the layer inspector says the height is 0) and the third layer-group behaves as normal. Just a weird one I came across today
2
Pete Schaffner
Is there a way to extend default `Layer` getters/setters? In other words, it would be nice to do something like: @define "width", get: -> super # custom shtuff
22
Matthew Barton
Does anyone know if you can nest ScrollComponents or PageComponents?
1

July 10

Jon De Heus
Hi all, I've been reading the Learn section on the FramerJS website in order to learn the basics, but at this point I feel that I'm ready to move beyond the basic tutorials. Are there any sites that provide intermediate level tutorials or help? Thanks!
4
Daniel Lin
Hi all! I have a question: I saw there's "__.animationStop()" to stop all currently-running animations on a layer, but is there a way to stop/cancel all queued animations from happening AFTER they've been called/delayed using "Utils.delay" ?
1
Siavash Shabanipour
I have a ScrollComponent with a PageComponent inside. How can I stop the ScrollComponent from scrolling vertically while I'm scrolling the PageComponent horizontally. My implemenation so far stops the vertical scrolling while scrolling horizontally however I can't scroll vertically while dragging on the PageComponent layer.
2
Jinglu Liu
Hi everyone, one basic question, how to change the state automatically instead of by touch or click event. I usually change the state by using heart_no.states.next(), but it requires under the touch or click event. This is the example code, heart_no.states.add one: {scale: 1.5, opacity: 0} two: {scale: 1, opacity: 0.5} theree: {scale: 0.5, opacity: 1} like_no.on Events.TouchStart, -> heart_no.states.next() Now, I want to change states without touch or click event, thx~~
7
Matt Barr
Has anyone encountered this? weird behavior with scroll layer's content layer showing up behind navbar layer that sits above it in a 1-2 pixel area at the top of the iphone's screen frame. Tried moving navbar's Y value to negative but the problem persists. Thanks for any help!
5
Katie Wu
Is there a way to store properties for more than one layer? Like for example when a button is clicked, have LayerA.visible = true and have Layer B.visible = false, and store that somewhere called like superStateA? Basically having one action trigger multiple things without having to call each individually.
1
Daniel Louwe Kooijmans
Hey all I was wondering how I can set a layer to "CenterX" in a state? Is this even possible?
5
Jesse Wilbur
I'm brand new at Framer, but super excited. I'm stuck on what seems to be a really basic problem: I can't access any of my sublayers when I import from slack. Basically every action just hits the parent layer and nothing beyond that. I'm using some code from an example that seems to be similarly structured, so I'm wondering if anyone can help me figure out what I'm doing wrong.
5

July 11

Baisampayan Saha
Hi....I am facing some problem in accessing layers created by for loop. I am not being able to initiate a click event, where in when I click the box layer shown in the code, the layers created by for loop will come to various positions of X.
5
Svet Denkov
Hi All! I am trying to replicate the 1st animation from http://capptivate.co/2014/06/16/elevate-3/ I reproduced the hexagonal mask in Sketch but it is rendering as a rectangle in Framer. Also on resizing the mask renders as image. Any leads on how to handle custom masks in Framer?
22
Jeff Lin
Hi guys, I have a question. I'm trying to create a loop animation with a play/pause button. When I press the green play/pause button, the red square at the right should loop form the top to the bottom in 3s. But when I press the button to pause and replay the animation loop, depending on where the red square is, it will still go from there to the button in 3s, which means it goes at a slower pace. Does anyone know how to keep the animation speed the same? Or another better way to make an animation loop with play and pause button? Here is my Framer file: http://share.framerjs.com/ry2sgwzg64m4/ Thanks
3

July 12

JinJu Jang
Hello everyone! :) I'm testing out a "swipe to dismiss" interaction, like as seen on Official Twitter app and somewhere else. http://share.framerjs.com/klpv4ymcam26/ From this point, I managed to create a simple up or down dismiss interaction, based on measuring the current Y position of a layer to its original Y position. Eventually, I'd like to add a couple of conditions, so the layer moves back to it's original position when you swipe it a little bit. In the meanwhile, swiping a lot will make the layer move away from the screen. What I'm having trouble with is to make it return to the original position. ;/ Is there any good reference to look at?
4

July 13

Benjamin Udink ten Cate
Is there an easy way to select sublayers of a imported sketch file? right now I made a small function to do so: find_in_sublayer = (parent, name) -> (parent.subLayers.filter (i) -> i.name is name)[0] I did this because sketch.plan.stats.x would give a error (undefined is not a object) but if I do find_in_sublayer(sketch.plan, 'stats').x = 100 it all works perfectly.
6
Rory Smyth
New to framer. Loving it so far. As an exercise, I've created a Tinder-y type prototype. Enjoy! video here: https://www.youtube.com/watch?v=eK3K7JXt-UM code here (bit slow): http://share.framerjs.com/r6mv1dw9j91q/
3
Elliott Samuel Lemberger
Is there a way to get the name of a layer that was clicked on?
12
Constantin Jacob
Guys, I've searched for this but it wasn't helpful so please bare with me... I'm trying to insert a variable I have into layer.html and I've tried almost everything I know of but it just wont work. I've tried #{variable}, {#variable} and #variable and other stuff. Does anyone know how this works?
11
Hans Kristian Smedsrød
Hi guys, I was under the impression that once I had imported a Sketch file into Framer Studio that it would auto update inside Framer Studio once I changed something in the Sketch file. If so, what should I do to make it happen?
2
Arron J Hunt
Working on an interactive graph
8
Robert van Klinken
Is there still a way to play the animation in 'slow motion'? Pretty sure it used to be possible in earlier versions of Framer.
5
Joon Won Lee
Hi all, Recently, I struggle with using "Scroll component". I found that there are "momentum", "bounce" properties in draggable. I wonder... can I have "momentum", "bounce" properties on Scroll component as well? (Ive tried it, but it seems does not work on Scroll component)
3
Tyrale Bloomfield
Is there a better way to write is out? Card.on Events.Click, -> Card.states.next() Account.states.next() Logo.states.next()
5
John Grendon Enderby
Does anyone have any idea how to animate the height of a layer up from the bottom rather than down from the top?
2
Ed Lea
I have a scroll component within a scroll component. The parent ScollComponent scrolls vertically. The nested ScrollComponent scrolls horizontally. When scrolling horizontally (on the child scroll) it's also triggering the vertical scroll. What I'd like to do is to lock the other scroll components that you are not interacting with. Wondered if anyone has some tricks up their sleeve for doing this. Ideally something I can specify on the parent ScollComponent as it could contain any number of child ScollComponents.
3
Joseph Reni
I've noticed .next() will toggle through the initial state and the new state. is there a way to go to the initial state?
4
Katie Wu
For states, can we manipulate the visibility of a Layer's sublayers? For example (I know the syntax is wrong but this is essentially what I'm trying to do):
1
Nick Bewley
Got one for the coffee cats: Say you have a scrollComponent housing 10 cards. On click you want to expand the height of the clicked card. This is no problem, but then you realize that you need to animate the y of the cards that follow (every object in the array after the one that you clicked) so that the layers don't overlap. This is where I am stuck.. Any ideas that could help? Thanks for any input.
3
Giel Cobben
The example page has been updated with 12 new examples! Featuring prototypes from Tes Mat, Raphael D'Amico, Rıza Selçuk Saydam and Benjamin Den Boer Contacts Scroll - http://framerjs.com/examples/preview/#contacts-scroll.framer Photo Filter - http://framerjs.com/examples/preview/#photo-filter.framer Video Player - http://framerjs.com/examples/preview/#video-player.framer Swipe Filters - http://framerjs.com/examples/preview/#swipe-filters.framer IF Onboarding - http://framerjs.com/examples/preview/#if-onboarding.framer Type Tester - http://framerjs.com/examples/preview/#type-tester.framer Rainbow Calendar - http://framerjs.com/examples/preview/#rainbow-calendar.framer Webmagazin - http://framerjs.com/examples/preview/#webmagazin.framer Page Component - http://framerjs.com/examples/preview/#pages-simple.framer Page Indicators - http://framerjs.com/examples/preview/#page-indicators.framer Swipe and Scroll - http://framerjs.com/examples/preview/#swipe-n-scroll.framer Scroll and Click - http://framerjs.com/examples/preview/#scroll-n-click.framer Be sure to check them out. If you would like to see your prototype featured in the gallery, please send us an email at [email protected]
6
Koen Bok
Since a few weeks we started curating the best posts about Framer and prototyping tools in general on our Twitter account. We post about two high quality links per day, a nice way to keep an overview of what's going on.
0
Rohan K
hey guys framerJS (and programming) noob here. so please be gentle :) I am trying to make a simple prototype for class where I want users to be able to increase / decrease the size of a circle by dragging on it. I am close, but am missing something simple because my circle keeps resetting in size every time the user clicks on it. here's the link http://share.framerjs.com/wjm67r9vf8by/ can anyone help? :(
1

July 14

Constantin Jacob
Just wanted to let you know that I have created a module that draws a ring onto the screen which can then be animated.... with just 3 lines of code ;) I want to give it to you but I have to fine tune some stuff first. Are there any Framer internal plans to create a set of standard modules that ship with Framer Studio?
5
Sarvagya Vaish
Just started using Framer yesterday. The example project that I downloaded from Github displays the layers but doesn't animate when I click on the icon - im using the latest version of chrome. Has anyone else had the same issue?
6
Constantin Jacob
Is there a way to check against null/nil (does not exist)? If I read stuff on stackoverflow right I have to use 'when x?' ??
5
Giovanni Caruso
Hi. Newbie here! :) Is there a way to create a custom shape layer for a mask? Let's say I want to create a transition close to the one made by Min-Sang Choi but using my own shape instead of a circle (or square, or rectangle or any other "standard" geometric figure). Thanks for your help :)
10
Rohan K
is there any way to capture or elegantly handle the touchcancel events in framer? currently if you click on a the layer and drag the cursor outside the layer it totally screws up the event callbacks
0
Rob Voets
Hey Guys, I hope you can help me out. I've created a prototype containing multiple arrays, which looks and works fine when using it in Framer Studio, but the moment I want to share the prototype, it seems that it doesn't load all the assets. Do you guys know how to solve this?
2
Nathan Langley
Hey all thanks for the invite. Brand new to FramerJS (which is awesome btw) and pretty new to JS in general so bear with me :/ I'm looking to import two Sketch docs into one framer presentation. Clicking on one fades into the other. How can I do this? I've searched the web to no avail. And the paper-photo zoom example gives me draggable events which I don't want. Thanks for your help in advance.
2
Giles Perry
Is there a way of telling Framer Studio to ignore an artboard when importing from Sketch?
5
Arvi Raquel-Santos
Quick question, can I use utils.modulate to rotate an object when a user scrolls?
3
Jaydev Ajit Kumar
Im getting a 504 for share.framerjs.com
1
Giles Perry
I'm just getting started designing an app with Framer and Sketch. Sketch is set up with non-retina artboard sizes. e.g. 375x667px for iPhone 6. When I import my Sketch file into Framer Studio, the iPhone 6 viewer has retina dimensions (i.e. 750x1334px) so the designs are half size. How do I modify the import script so that everything is imported at 2x scale? mysketchfileLayers = Framer.Importer.load "imported/mysketchfile"
3
Laura Galbraith
Hey all! Quick question, I can no longer view my prototypes in a browser locally ... I get a warning about "Local File Restrictions" and a button to "try anyway" but nothing loads now... I'm using chrome and trying to view the files in browser from my computer... What can i do to fix?
5
Mark J Harvey
Is there any way to do a simple button tap animation / interaction? When I tap a button, it bounces, scales to 0.8 then back to 1 with a spring curve?
12
Diego Oriani
Here's a question. When working with states, is it possible to create different animationOptions to each state?
4
Andrzej Słupski
Hi there! I'm looking for a framer example sketch with similar functionality to Apple Music "bubbles" (ie. fluidity, resizing). Have anyone tried to replicate it yet?
12
Benjamin Den Boer
Hey all - here's a little ScrollComponent example that Jonas Treub and I worked on a while ago. It contains some pretty nifty tricks and evenly distributes opacity and scale values. You can easily extend this to include 3D rotation effects, to replicate the iOS Calendar App date scrolling interaction, for example. Fun to play around with. Hope this helps! :-) http://share.framerjs.com/36g5n5wsng6w/
6
Jordan Robert Dobson
I just pushed up some updates to http://FramerCo.de. Feel free to submit some suggestions for tips, modules or code examples you find helpful. I'll be adding a few of mine tonight... Including my talk at the Seattle Framer JS meetup.
2

July 15

Lin Kim
Can I change the editor to use javascript?
2
Brad Wrage
Hello, trying to get multiple hover components to show and hide. For the most part, I have it working, but seeing a particular layer blip in and out upon hovering over my target layer. Any ideas? Using actionstarget = new Layer space.icons.opacticy = 0 actionstarget.on Events.MouseOver, -> space.icons.animate properties: opacity: 1 time: .2
1
Văn Công Bằng
Hi, I'm a designer, but i love to build fancy prototype, that's why i come to Framer. When watching some examples on Framer page, i notice some coders use @ symbol in their code, for example: @monthWidget = new Layer. What is it ? I'm new to coding, thank you very much !
2
Jon Arnold
Hi Guys, I want to share with you my favorite snippets I use in every project: https://github.com/ServusJon/PrototypeWithFramerjs/tree/master/Snippets Also more details here: https://github.com/ServusJon/PrototypeWithFramerjs/ Hope it is useful for some of you ;-)
0
Kees Plattel
Hey! I've got an array of objects created by a for loop (A set of cards, that stack on top of each other). I want the top card to be placed on the bottom (Currently using 'sentToBack()' for this) once it's dragged beyond the borders of the screen. When it's no dragged that far, it needs to snap back. How would you approach it? I currently have something like this: for cards in [0...amountOfPages] card = new Layer name: "card_" + "#{cards}" image: "images/card_#{cards}.png" width: 704, height: 964 rotation: Utils.randomNumber(-2,2) superLayer: stackSuperLayer index: 1 - (10*amountOfPages) card.center() card.draggable.enabled = true card.draggable.bounce = true card.on Events.DragEnd, -> index: ordervalue card.sendToBack() The issue is that 'sendToBack()' only works on the first card, probably because of the loop right?
3
Mark J Harvey
Hi, I just got Framer and am enjoying it but am having trouble trying to prototype a simple interaction. It's a left side nav (iPad) and I simply want the buttons on the nav to have views move the content in or out depending on the tab. Right now if I could just get 2 to work it would be great. The way I need them to work is: - tap nav button - content that is y:-600 moves to the front (z-index) - content then moves to y:0 - content that is to move out gets covered - content that is to move out then moves to y:-600 only after the new content has covered it. You would not see this transition These need to happen one after the other, not simultaneously. Any help is appreciated
3
Tyrale Bloomfield
How do you target an html object that was created with the .html? I want to target the li's here: cardMenu.html = "<ul> <li>Menu Item</li> <li>Menu Item</li> <li>Menu Item</li> <li>Menu Item</li> </ul> "
5
David Phillips
What's the proper way to write a constructor when extending a Framer class such as Layer, where you also need to pass in additional parameters when instantiating? e.g. Foo extends Layer constructor: (??????) a = new Foo ({width:100, height:100}, otherParameter, yetAnotherParameter) Possible?
2
Vicky Yang
This is what I’ve achieved with Framer js so far. Currently I’m trying to figure out how to target class name like layers labelled - “alphabet” rather than targeting layer names with unique ids with click events. I also want to enlarge the letters on click, and scale down the ones that are no longer in focus. Here is the link to my code: http://share.framerjs.com/n6p6vvpxnljt/ Would be amazing if I could get some help on this!
6
Guy Gunaratne
Hi all - I've just joined so apologies if this has been asked already. Are there any examples of 1. a web-app that has been designed in Framer? 2. a design in a horizontal phone orientation? (for horizontal video player design)
0
Mark J Harvey
I am trying to draw an overlay with new Layer in framer for popup / modal overlays. For some reason the placeBehind or placeBefore properties are being ignored. Any ideas as to why? overlay = new Layer width: screen.width , height: screen.height backgroundColor: "#000", opacity:0.3 overlay.placeBehind(layerItShouldBeBehind)
5
Ryan Gambles
Would anybody happen to have an elegant proposal for how to determine whether I'm at the first or last page in a PageComponent? It's the end of the day and I'm done stumped.
6
Jordan Robert Dobson
Update State Properties Dynamically EXAMPLE: http://jrdn.io/byD6 Here's a simplified example of how you would update properties / values in your states. As you hit the square in the middle notice the rotation changing with each switch to that state.
2
Joseph Van Geffen
Howdy Framer JS'rs! I'm having issues keeping my Framer.js/Coffeescript code DRY. Any good tutorials out there? (To be specific, I have a dynamically generated list of buttons with event listeners (for swipe/touch/etc). I ended up copy pasting the events over and over instead of being able to programmatic-ally create/set them).
13

July 16

Ryan Gambles
How do you go about tracking animation events on PageComponent.snapToPage()?
8
Arvi Raquel-Santos
utils.modulate question I was able to get this quick test to work — getting an object to rotate while a page is scrolling. I kind of stumbled onto this solution by accident but don't really know what the "5000" refers to in this line? "square.rotation = Utils.modulate(yOffset, [0, 5000], [0, screen.height], true)"
12
Jonas Treub
Checkout the Memory game I created. It’s pretty complex for a prototype but don’t let that scare you away. There are a ton of little details which you might find interesting. Besides game logic there are things like tilting a layer on mouseover, flipping a layer and adding sound effects. Comments are added to the code. Let me know what you think or if you want anything to be further clarified. http://share.framerjs.com/bd3koxxcq34s/
19
Văn Công Bằng
Hey guys, i intend to make a countdown timer, any suggestion ? I'm new to coding, so i need some suggestion. Thanks
3
Kev Craven
Is there a simple way (I'm a coding newbie) to animate a PNG sequence in framer? It's a spinner animation created in After Effects. Or is it best to import a video?
7
Arron J Hunt
Hey Framerians, I built a simple tap prompt pulse thingy for FramerJS. These little callouts prompt the use to click on something. They're really easy to add to any existing prototype. Link to the Framer Project: http://share.framerjs.com/iw2xzioxefr8/ Link to the Module: https://cl.ly/bqhg?_ga=1.41472930.1873892174.1435883583
8
Berend Holtland
Hi Guys, I'm stuck at a project i'm working on. http://share.framerjs.com/sodvag79i68y/ When you drag the green/red layer up, it scales from 0.8 to 1. What i'm trying to do is the following: During the scaling, i want the green/red layer to cover the navigation bar in the bottom. I tried doing this by increasing the scrollComponent height by calculating it with the scale of the green/red layer. However, when the images begins scaling, it won't scroll to the top anymore.. For now i have deleted the increasing height of the scrollcomponent. Do you guys have a solution to this problem? If it needs more explanation, please ask me! :)
4
Colm Roche
If I make a scrollable list that starts from the top – you scroll DOWN to view more content – it works fine. If I start it from the bottom – you scroll UP to view more content – it doesn’t work. Any thoughts?
4
Josh Ackerman
Hello, Has anyone achieved a floating/hover effect through animation? My current solution which does not work very well, is to animate the layer position with y: layer.y - (Utils.randomNumber(2, 8) * direction), where the direction cycles through [-1,1]. This results in layer moving up and down, although it is fairly choppy. My next idea is to move layer around a tiny circle at a possibly random speed. It would help me greatly to hear any other ideas. Thanks.
2
David Phillips
Is is possible to use the export/require module convention to externalize classes? I dropped one of my classes into a module file, but adding "export" before "class Foo" throws an error, and without it, I can't access the class.
13
Junhyuk Jang
I made ‘Nat Geo View’ style navigation bar prototype. I made scroll component and zero scaled navigation bar. When you scroll up, navigation bar will be appear. http://share.framerjs.com/szaflo9c86o8/
1
Philipp Doms
Hi all! I have some troubles wrapping ScrollComponent on click. The ScrollComponents gets wrapped around 'mainNav' by default. After clicking on 'navItem', it gets wrapped around 'secondNav'. Everything's fine so far. As soon as I click 'logo' and try to wrap ScrollComponent around 'mainNav' again, a blue frame appears and I can't scroll anymore. Any idea why this is happening? Cheers
2
Dan Clarke
Hi everyone. I would check this myself but my trial has expired and I have to wait until the weekend to buy my license. Can I set custom document sizes for Framer? I.e. not a desktop or an iPad but a physical hardware product that is 50x20cm in size?
2
Koen Bok
Hey for all you starting coders, I have a question. I run into a lot of people that always wanted to learn coding, but finally got into it. I think that is mostly due to a shift in perspective of what it means to be a designer, new output requirements like real interaction and animation, and new tools and communities like these. For us, the biggest thing we can do for Framer is help even more people learn. So what I'd love to hear from you is what ultimately drove you to pull through and get into coding? How did you motivate yourself? What are your tips for others?
32
Mike Stężycki
Hey Framer community. Quick question, is there an easy way to define a layers property as a value that can be used to manipulate? For instance, I know the height of layerA and I want to move layerA down by its height using: layerA.states.add one: { y: -"#{layerA.height"} } Is something like this possible?
7
Kev Craven
Hello, I've added some input text to my prototype (username field) and I'm wanting to change the placeholder text colour... How do I do it?
10

July 17

David Phillips
The Framer Android app resets to the default state (no page/project loaded) when you go to the home screen and back. Has anyone found a way to keep the prototype loaded in this case? Am trying to present my proto as a "fake app" so to speak...
5
Anthony Roscoe
Any chance of adding a XHDPI (2x) Android device to Framer Studio?
5
Jinglu Liu
Hi, how can I use the jQuery easing parameter in curve?
5
Brandon Souba
Anyone ever seen this bug?
6
Văn Công Bằng
So, i have 3 pages(1-2-3), on every page there is a discard button, if i press the button, the current page is move up off the screen and the next page is move in the screen (from the right). I used states.switch for current page when pressing the button, after (Utils.delay) a time, page.snapToNextPage(). The problem is, if i am at page 3, page 2 is discarded (up off the screen), but page 1 is not, when discarding the 3, how do i make the page return to 1 which is not discarded ?
2
Pasq Vitiello
I designed some widgets in Sketch and i want to import them in Framer. Any widget is a group and I am able to import them separately using drag and drop. Now I want to import all widgets at once, so I select all my widget groups and create a new group containing them (cmd+G). The problem is that Framer can't import that group, in facts I can see no green plus icon while dragging. What am I doing wrong?
0
Burak Esen
Hey guys, how can I center the device in fullscreen mode for present?
1
Katie Wu
If I have a sketch group with subgroups, is there a way to make the group a PageComponent and have it automatically add its subgroups as additional pages? (if there isn't, maybe a suggestion for next release?)
2
Danny White
Is it possible to simply "chunk out" portions of your code into modules? Basically just cleaning up/minifying the main .framer file. I'm seeing a lot of posts that are vaguely on this subject, but I can't wrap my head around how this works. Especially how objects & classes work in the Framer world. Possibly a stupid question, but I think it would be useful to know, and avoid having to scroll constantly through the code for a prototype that's even semi-intricate. Some posts from here that I've tried & failed to grasp: https://www.facebook.com/groups/framerjs/permalink/709177452542662/ https://www.facebook.com/groups/framerjs/permalink/708775342582873/ CC some people who've been involved in these posts: Chris Camargo, Jordan Robert Dobson, Pete Schaffner, Adria Jimenez, Benjamin Den Boer Thanks a bunch
18
David Phillips
Is there a way to set the background color of a VideoLayer? When loading, the layer is black and I need to change it to white.
5
David Dusanek
I'm currently working on a project where we need to deploy a prototype that feels like a native app on the client's iPhone. I’ve heard that this is possible by either creating a simple One-Webview-App in XCode or with PhoneGap. The latter I’ve just tried, but can’t seem to get it to work. So how exactly would you do that? Is there a special way I need to prepare or package my framer files for PhoneGap? Justin Mariano wrote about converting the coffeescript code to js and somehow changing the file-structure, but since I’m using a lot of modules in the prototype, I wouldn’t even know where or how to start with that.. Would it be easier with the XCode WebView? Are there any tutorials or resources online? Thanks for sharing!
0
Jordi Martinez Ortega
are the servers down? I can't load projects I am sharing
7
Ash Adamson
Looking for a place for Framer Sessions 03 SF! Does anyone have access to a place to host?
0
Luis Ricardo La Torre
Finally finished my first animation that I'm proud of. Hint is the search bar when you scroll. Dribbble Shot: https://dribbble.com/shots/2147878-Search-Bar-Animation Prototype: http://share.framerjs.com/c3h5u0o1fxub/ Photography by Ricardo La Torre
19
Paulina Galoostian
Happy Friday! Looking for someone in San Francisco area interested in taking on a small creative framer JS project so if you're interested in learning more please let me know :) you guys are all really talented and would love to work with you
0

July 18

Daniel Lin
I'm conducting user-testing sessions and would like to somehow capture users' interactions/experiences with a Framer prototype (that's loaded on on a mobile device using Frameless). Maybe something that can screen-record their activity as videos, or access the phone's front camera to record users' facial expressions, or tracks which elements are interacted with in what order / at what time, etc, etc. Does anyone have experience with using Framer or other mobile software to achieve this? Or recommendations?
8
Josef Richter
Now that animations landed in React Native, is there any discussion going on about basing Framer on that? What are the limitations? The benefit would obviously be that our Framer prototypes will de-facto be the native app front-end without need to export or translate anything.
4
Chris Camargo
Hey Frameristos! I gave a brief talk last Thursday at the Framer JS Seattle meet up at Disney, on the topic of creating multi-screen prototypes using FramerJS. I wanted to share the materials in case anyone else finds this useful. As part of the presentation, I quickly covered the principles I follow when constructing a multi-screen prototype. I also showed off a simple view controller component that I built to help me create multi-screen prototypes without having to write and repeat a bunch of logic. Here's my slide deck: https://speakerdeck.com/chriscamargo/multi-screen-flows-in-framer/ And my 1st attempt at a public component, ViewNavigationController: https://github.com/chriscamargo/framer-viewNavigationController/ Thanks, and feel free to ask questions! Its easy to get lost when you don't have the words to go with the deck. :)
21
Jordan Robert Dobson
New updates posted to http://Framerco.de If you've seen anything else we should have on there please leave a suggestion on the site.
2

July 19

Nick Mangos
Is there a way to set focus on an element that has content editable set to true? Focus() works on a input element, but not the below example. background.html = "<div contentEditable=true> #{text} </div>"
6
Randi Dumaguet
Hi all. I tried animating colors in Framer and this is what I have so far: http://dumsdei.com/samples/colortransition-for-framerjs/ In the sample above, the background's backgroundColor property is animated using rgba colors. It will take the background color of the clicked button. I uploaded the project to Github in case anybody would like to help in improviing it :) https://github.com/dumsdei/colorTransition-for-Framer
1
Chris Chen
Hi all, I am very new to Framer and love this fast prototyping tool!! It really helps designers to communicate their Ideas to engineer so much easier. However I am wondering is there any fast or simple way to have event listener for pinch, or three finger gestures ? Thank you !
8
Elliott Samuel Lemberger
Is there a way to animate color in framer? Say I want to animate a layer from gray to three other colors depending on what is clicked? Thanks!
3
Stefanos Kofopoulos
Hey guys. I wrote this tutorial for those non developers, creative types out there like myself. Would love to hear what you think. My goal is to lower the barrier for beginners within the Framer community with easier to understand material. I hoped i helped a tiny bit.
9
Dan Clarke
Hi everyone I'm trying to create a meter in Framer, like an audio meter you'd find on a hifi. I have 9 states to show and have 9 groups from Sketch to show this. I need to change between all of these states, displaying one at a time but in a random way. I know there is a Utils object for randomNumber but just thinking how I should do this? I need to assign a Sketch group to a layer and then add the other groups as .addState and then randomly toggle through using nextstate = myRandomNumber just not sure how to go about adding the Sketch groups to layers and states in this way?
13

July 20

Arron J Hunt
How do I end an interval?
2
Ben Blumenfeld
All, making a desktop site prototype at 1280 pixels wide. When i share it it gets scaled way down in the presentation screen. How do I share it at the actual resolution?
4
Katie Wu
So I've made the only the top layer of a PageComponent draggable but I want to restrict the dragging only horizontal dragging. I've written these lines: ------sampleProject.draggable.vertical = false ------sampleProject.draggable.horizontal = true but it doesn't work? I can still drag in all directions. Any ideas?
2
Kev Craven
Can't find anything in docs, but I'm sure it's very simple. How can I delay the start of video playback by 2 seconds triggered by a TouchEnd event?
4
Jordan Robert Dobson
VIDEO WALKTHROUGH Periscope Heart Animation Module Video: http://jrdn.io/c03F Code: http://jrdn.io/c0MU A walkthrough I presented creating the Periscope app heart animation in Framer Studio from the July 9th, 2015 Framer JS Seattle prototype meetup at Disney in Seattle, WA. The module attempted in the video was completed after the talk and is included in the Framer code above. Topics Include: • Layered Animations • Emitter Creation • Animation Loops • Animation Objects • Utils.randomChoice • Utils.randomNumber • layer.hueRotate • layer.saturate • layer.copy() Post on FramerCode: http://framerco.de/post/124353078989/video-walkthroughperiscope-heart-animation-module
4
Caitlin Charniga
If I have an image layer that changes to a new image on a new state, how can i get the two images to fade?
3
Katie Wu
I'm trying to implement behavior that follows the attached chart, where each rectangle is a screen. Right now I'm using 4 PageComponents: 1. RED screens (A, B, C) 2. GREEN screens (A.1, B.1, C.1) 3. BLUE screens (A.2, B.2, C.2) 4. All the A screens (A, A.1, A.2), which has pages that are the PageComponents: RED GREEN BLUE, mentioned above But right now I can swipe from A.1 down to the B screen, and from B.1 back to A, which isn't what I want. How do I limit the swiping interaction to only the behavior shown in the chart? Thanks!
5
Benjamin Bilow
Simple question: How do I get a video to loop?
2
Claudio Guglieri Lillo
Quick question! I'm working with the gooey effect and would like to have images / UI behind it. Right now to make the blur/contrast webkit filters work you need a solid BG color. Is there a way to make this solid BG transparent? Some sort of blendmode:multiply or maybe a different way of doing it?
1

July 21

David Lee
I wrote a tutorial for Framer beginners and scripting newbies. If you have any feedback, please leave a note there!
13
Josh Ackerman
Hello, I recently set out to improve the clock prototype I uploaded to Dribbble a while ago by making the second hand rotate smoothly. My solution to smoothly rotating the second hand is to use milliseconds and essentially rotate the hand by a very small degree, each millisecond. Obviously the issue is that time.milliseconds() counts from 1 to 1000, which means that every second, I need to add 1 to the number of milliseconds for an accurate count of how many have passed. I need to count how many seconds have passed because they influence the rotation directly. Is there a better solution? If not why is the function "r" not working correctly (in the attached file)? http://share.framerjs.com/dnahgy1h0iai/ Any help would be greatly appreciated!
5
Callil Capuozzo
Hi all, I thought it would be fun to have a little code challenge. I was working on inline collapse expand in a scrollable list but was really struggling with how to update the values of the subsequent layers after the state had changed. I ended up writing a little function that fires when the clicked layer is animating using the change:height event. This is the most simple way I could figure how to make this happen so I'm putting the challenge out there. See if you can write a more performant, or more simple method/function for the same behavior! Edit: forgot to attach the project: http://share.framerjs.com/3fnewle4oir4/
0
Lut Ze
I am trying out framer's sketch import function now: Is it really necessary to use unique names for every layergroup you import (even if they are sublayers in different layergroups), else you cannot select them? and: is it not possible to use any hierarchy within your imported layergroups? these two constraints make it really hard for me to consider using sketch imports for more complex layouts...
3
Florian Pnn
Hello guys, I'm looking for a way to use a string as a variable name. I used to do : var variableName = "layerXYZ" window[variableName] = new Layer... Any idea how to achieve that with CoffeeScript? Thanks!
1
Lukas Imrich
Dear Framer community, I designed my prototype in Sketch @1x size, which means 360px width. Now i want to import it to framer studio. Framer studio always imports the file @1x size. Is there a way I can import files @3x size? Now I do it all manually. I export each layer @3x size and then import to framer.
5
Timur Sultanov
Hi there! Just got some bugs: 1) can't use word "while" in comments 2) using quotes (") in comments breaks highlights
1
Saran Jith
Hey all! I tried running a Framer JS prototype in Microsoft IIS Server. IIS was not able to render the prototype properly. While trying to run the prototype in Apache server, it renders properly. Can anyone help on getting it up and running on IIS? Thanks in advance!
4
Chris Camargo
Share server appears to be down again. Can't load prototypes.
0
Bala
Did anyone buy this book? looking for some Honest review :)
6
Caitlin Charniga
Is there an easy way to set the same style for multiple layers? For instance I have form fields and want to just write one style for each different field as opposed to having to copy/paste a bunch of times.
2
Alex Bystrov
Share server appears to be down again, anyone having the same problem now?
0
Koen Bok
We're prepping for a nice update. If you'd like to verify our fixes and see some new features try the beta for a bit: framerjs.com/beta
2
Katie Wu
So I have a tab bar on my prototype, each with ScrollComponent screens, but whenever I happen to scroll and "let go" (end the scroll) over the tabs on my bar, the tab bar registers as Events.Click, and switches tabs. How can I distinguish between a regular TAP event, and the end of a SCROLL event, so I don't get this funky behavior? Thanks!
1
Jacob Berlow
Has anyone found a way to listen for the system back button on Android?
0
Mike Chung
Is there a way to use framer with javascript ?
4

July 22

Akhil Dakinedi
I have a bunch of full-width cells inside a scrollComponent, each with their own Events.Click action. it works well, but the problem is that the Events.Click actions fire when the user grabs one of the cells to scroll up/down (and then lets go of it). Is there a way that I can trigger the Events.Click actions ONLY on an intentional click/tap? Not when the cells are being used for scrolling up and down on the screen? Any help appreciated.
4
Daniel Lin
Is there a way to use PageComponent or ScrollComponent to recreate this interaction, but by dragging the circle over (as opposed to clicking "Start Now" as shown in the video)? :o Specifically, I'm having trouble keeping the second circle/state partially visible in the initial state. (my first time using PageComponent)
1
Josh Ackerman
Hello, As promised here is V2 of my clock widget, now with a second hand which animates smoothly. Thank you everyone who assisted me. Version 2: http://share.framerjs.com/j8wnmtfc79kh/ Version 1: http://drbl.in/nNUB Feel free to like the shot or follow me on Dribbble: http://drbl.in/prOt
0
Văn Công Bằng
Can framer update the prototype/preview after i press save, not every time i type ?
2
Kinsey Wang
Hi all, I am a beginner and just wonder can I set a action to call system camera ui? like this, I tap a button and it open a camera view. Thanks!
0
Koen Bok
Hey everyone. If you use sharing a lot, you might have noticed some instability over the last few days. The short story is, Framer is getting popular and the server can barely handle it. Please bear with me over the next few days where I try to keep it up and running while we move everything over to some better infrastructure.
6
Fabian Buijing
I've imported a Sketch design with 2 artboards, "Photoshoots" and "Coverage". I want to select "subtitle" inside Coverage :) Just "subtitle" works, but soon I'll have more artboards that have that element..
5
David Dusanek
hi, is there a way inside of framer to get rid of the "Local File Restrictions" warning and "try anyway" by default (without changing browser settings)?
1
Michał Jarosz
Hello all! I'd like to present you something and to all dribbblers asking for like support. Framer project: http://share.framerjs.com/wk16phyj3uon/ Dribbble shot: http://bit.ly/1Jef4Sy Feel free to use it as you like.
16
JL Flores Mena
Framer is becoming the biggest game changer I've seen in a long time. It might not be widely used by designers, but the impact is having in more experienced/dedicated groups is huge. I have never considered myself a programmer, but I do enjoy struggling with code. The progress that I've made with Coffeescript is 100% thanks to Framer. So when I refer to Framer as a game changer, it's not only about changing the way we work, but also the way we learn. On that note, I have a question/request: Are there plans to have a version that is focused on using plain Javascript instead of Coffeescript? I have friends who are trying to make the jump from design into interaction design, and Framer is an amazing tool to help designers (or visual thinkers) get into code. But at the same time, if they want to apply their newly gained knowledge (ie, in Front-End/web development), they have to 'unlearn' some of that Coffeescript flavor. In my case, Framer got me into reading about Javascript, and I'm reading Eric Elliot a lot; I'd like to have a tool like Framer to experiment with some of his ES6 (or ES5) examples. Sorry for the long post! TLDR: What about having a 'Framer Edu' version focused on being a playground to learn plain Javascript.
14
Văn Công Bằng
Hey guys, everytime i press present on Framer Studio, framer auto focus on my input element. For example, i have a chat screen with chat input on the bottom, when i focus on the input, the keyboard image moves up, it's ok when working with normal screen (half code, half present), but when i open full present window, framer auto focus on the input and my keyboard image moves up, i didnt use layer.focus(). And does it happen when i share my work on server ?
4
Jaime De Ascanio
Hello guys, im trying to prototype a signup form with real html inputs and I have a couple questions: 1. How can I do to display the keyboard from the beginning? I have tried "inputElement.focus()" and its not working for me 2. When I tap on the input the whole page scrolls how can I maintain the elements fixed on their position? Thanks!
2
Caitlin Charniga
is it possible to have different animations options for each state in a layer?
3
Arron J Hunt
Hey guys, I have a layer with differing border radii (30px 0 30px 0). I'm trying to animate it, but it's not working because I need to use "style" for multiple border radii and I can't animate that. Any suggestions?
8
Tony Hightower
Hi Group, Anyone know any UK agencies/inhouse using framer js?
1
Katie Wu
What should I do if I want to limit scrolling on a ScrollComponent to only DOWNWARD?
3
Jorn van Dijk
Google just announced their acquisition of Pixate. I’m curious to see what comes out of it. Congrats to the team!
17

July 23

Kushagra Gour
Hello all! Presenting "Prototyp" - A free web app built over Framer.js to create interaction prototypes -> http://prototyp.in/ Appreciate feedback.
0
Rapha Ël
Hello Awesome Community ! First steps with Framer. I would like to know how i can select a layer from sketch and give it an animation i tried something like this: sketch.theLayer.animate propertises: { properties...} didn't worked (tried to put sketch.theLayer in a variable too)
8
Chris Camargo
Can someone explain this? The code shown will print negative y values when sliding my scroller upward (expected). But if I say "print @scrollY", it always prints 0 (unexpected). scroller is just a standard ScrollComponent.
8
Andrew Nalband
I've been using framer to prototype a game with an 8bit graphic design style. We're using tiny graphics and scaling them up on the device. For example, the "pitch ball" image I've attached to this post is only 100x20 pixels but we scale it to nearly the full width of an iPhone 6. The trouble is that if you do this with the default image scaling in Framer it gets sort of blurry because of the normal way the scaling is done. I've been able to get the file to scale up nicely and stay crisp and blocky in the broswer by adding this to the CSS file .framerLayer { image-rendering: pixelated; } However, I can't get it to look crisp in framer app (see attached images). Is there any way to get Framer to scale images in a way other that the default? (This is a rare case when I actually want that blocky pixelated look)
4
Stephen Crowley
FramerJS Seattle group's place to host next month has fallen through and we are looking for a new spot, any leads would be much appreciated. Thanks!
1
Caitlin Charniga
I'm currently trying to prototype a poll where the percentages animate from 0 to x. Does anyone know of any good framer examples I can look at that do this? I know I need to write something using the Utils.interval, but I'm really struggling. Here'a an online poll that has a similar number animation to what I want to achieve. http://blogs.disney.com/oh-my-disney/2015/06/25/the-ultimate-disney-princess-poll/?cmp=SMC%7Cpri%7Cnatural%7Cblgomd%7COMDJuly%7Cpin%7Cprincesspoll-OhMyDisney%7CInHouse%7C2015-07-10%7C%7C%7Cesocialmedia
5
Samwoo Ee
Is there an effective way or a shortcut to pan the viewer so it's focused on the area that I'm working on? I'd like to set it to a 100% so I can get in on the details, but it always centered. Any ideas?
3
Jordan Robert Dobson
mix-blend-mode Pretty neat discovery / effect based on a question by Claudio Guglieri Lillo using multiply blending mode and a goey effect. http://share.framerjs.com/tfje5tl2k1lq/ I completely forgot about this because support wasn't amazing when it first landed and I definitely need to do some more testing... but it's pretty neat if you could use this to prototype some ideas. Read more about it here on MDN: http://jrdn.io/c0fd & http://jrdn.io/c0zL
14
Fabian Buijing
Can I animate an image with a bouncing scale effect (spring), but keeping it at scale: 1 both before and after? This works, but it's unsharp and too big in 'active' state: "inactive": scale: 1 "active": scale: 1.1
2
Aaron Paterson
Hey guy and gals, how do i post something a made for feedback? Is there a way to get the URL exported via FrameJS for everyone to see?
5
Ash Adamson
Hey ya'll. Looking for mentors for the next San Francisco framer session. Let me know if you'd be interested in helping designers learn.
7
Eric Chao
Hey Everybody! Currently playing with Framers new PageComponent. Is there a way to setup an Events.Click on a separate layer to snap to a specific page within the PageComponent? I tried: button.on Events.Click,-> page.snapToPage(page2) It doesn't snap the page, but when I print change:currentPage, it prints two lines in the console. (perhaps the page snaps but then snaps back) Any help would be great! Thanks!
2
Ray Yip
The clipping in rounded corner doesn't work, even i set the overflow. i'm sure i did this before.
3
Danny White
not long ago, someone posted a module for quick and easy annotations/comments on your prototype. Can't find it to save my life though! Any one know where I could find it?
0
Katie Wu
Say I have a page called "A" in a PageComponent, and I want another layer called "Cover" to sit on top of "A" and FOLLOW the position of "A," such what whenever page "A" is horizontally swiped to, you see "Cover." Then, when the user swipes UP on the "Cover," it goes away, and page "A" is revealed. Should I make "Cover" a page in the PageComponent as well, with the same x,y position as "A" and try to handle events that way—or should I have "Cover" be a separate layer on top of the page content and then link their positions with Modulate (can you even do that)? Thanks!
7
Fabian Buijing
I want to animate an image and fade in from visible: false. After animating back to the default state I want to return to visible: true. "Events.AnimationEnd" apparently sets it forever. Is it possible to fire it just once? Or else link it to a state?
2

July 24

Tarun Chakravorty
I'm trying to figure out if I can do an animation of the border of a button similar to how this animation works : https://dribbble.com/shots/1680799-Play-Pause-Animation?list=searches Does anyone have an idea on how to do this in framer?
2
Koen Bok
Hey Framer teachers and students! Because we had a few meetups this week we worked on a few nice, but simple examples that you can rebuild while you are teaching Framer. They are all simple things that focus on something specific, but patterns that you will use a lot in everyday prototyping. And they look good :-) This is just the beginning of building a repository of teaching materials. There is so much out there, and with more and more meetings coming up it just makes sense to organize it a bit. Some next things that will come up are a simple teaching class format description, and step by step overviews of how to work through some of the examples. Ideas, other examples and pull requests are very welcome. https://github.com/motif/FramerTeachExamples Examples: http://share.framerjs.com/cinw13nmd706/ http://share.framerjs.com/nrtboo3dnh0s/ http://share.framerjs.com/7y6wautoh90y/ http://share.framerjs.com/5ovfx0bflifz/ http://share.framerjs.com/dbvb7poiozux/ http://share.framerjs.com/beip72l48igj/
18
Thomas Law
When I change viewer device into iPhone 6 Space Grey or Gold, there will be no deview at all. Why?
3
Văn Công Bằng
The spring curve is not affected by time in animationOptions ?
1
Thomas Law
Why I'm using the Scroll Components (named "scroll"), I observed the output of "print scroll.y", it just keep outputting the same number, though the layer is actually moving vertically. Why?
7
Jorn van Dijk
We just shipped a nice update to the Framer site. The frontpage has better copy, we overhauled the code base, switched to roboto, updated the color scheme (now consistent with the app) and changed the navigation to full width (white on scroll). Let me know if you find any bugs and we'll squash them right away.
8
Koen Bok
I'm happy to announce our biggest update yet: Layer Inspector http://blog.framerjs.com/posts/prototype-with-layer-inspector.html At times, it could be hard to figure out what exactly was happening in your prototype. Until today. A layer panel on the left side of the preview lets you inspect the size and position of every layer. We also updated the look and feel of the editor, and fixed a ton of smaller bugs. We hope you enjoy this release!
33
Anubhav Saxena
Is there a way to import sketch files at @2x resolution?? Or svg?
4
Katie Wu
After an event, I change the x positions of pages in a PageComponent such that it reaches PAST the original PageComponent.content, but the pages are clipped because the PageContent has the original dimensions and position. I tried changing the PageContent's position but it moves all the pages too :( Any ideas?
18
Patrick McLean
Hi! I'm wondering if there is an Event listener for key strokes? I'm not seeing anything in the documentation. Specifically, I'm trying to do something after a user has entered X number of characters into a text input. Any ideas? Thanks for your help in advance!
3
Antonio Krämer Fernandez
Hello Frameristos, I'm wondering how many designers use Adobe Illustrator for UI Design. In my environment I see that the majority of UI designers actually use Illustrator. I myself use Illustrator on a daily basis for UI design and found a workflow/workaround how to combine it with Framer. Basically I just distribute all of the assets on different artboards and export them directly into the images folder of the framer project. This way I can tune the concept and visual design while developing the prototype. This works well for me but nonetheless I was wondering if there is a plan to integrate Illustrator into Framer like PS and Sketch? <3
3
Édouard Urcades
Hi friends!! Quick question regarding animating paths: So I'm looking to animate a circle in the manner shown here (the circle loader), about midway on the page: http://www.ibm.com/design/language/framework/animation/fundamentals It's looking like at 0deg of animation none of the path is shown, at 360deg of animation time, the path is at its full length. Any idea how something like this might be animated? Or what would be the best way to start? Any help would be super-appreciated
5

July 25

Dmytro Izotov
Hi everyone, I'm working on a prototype with multiple views and when going from one view to another, the first view stays behind and still receives click events even though it's completely covered by the second view. Is there a way to make sure that only the view that's on top receives click events?
7
Tiago Joel Domingues Ferreira
Hey everyone. I've just started looking into framer and I wonder how hard it would be to make the framer generator app compatible with GIMP.
1
Jeff Lin
Hi guys, Has anyone had problems setting up a custom device with framer? I’m trying to set up a custom device, and for some reason, when I hit command R or the reload button, the device disappears, and I see a blank screen. I figured out that if I select a random device from the drop down manual under the view button, then zoom out, my custom device reappears. Does anyone know how to fix this? Here is my file: (download and open it with framer, because the reload and zoom method does not work on the browser) http://share.framerjs.com/l6uqahpc77se/
1
Zach Whelchel
Hey everyone. About a month ago I started a project called Napkn. Napkn is a website where anyone can submit an app idea and we build the best one every week for free. If you want to know more about why we're doing this check out the link below (my first comment explains the goals of the site). The reason I wanted to share with the Framer group is that we just announced that we are opening up the platform to other developers/designers. The idea is we give you a place to jump in for a week and collaborate with someone new to create an MVP app. You get to share your process and get feedback from our audience. Napkn is a great way to show off the skills you've been working so hard on. It's also a great place to hone your skills as you move forward. Its meant to be a place for up and coming designers/developers to gain exposure... but in a selfless/cool way because your enabling other people's dreams at the same time. AMA below, and if your interested in checking out the apps we've been working on here are some links: www.napkn.io www.twitter.com/napknapps http://www.napkn.io/posts/calling_all_app_makers https://twitter.com/NapknApps/status/624693299337654273 - Zach
5
Jonathan Lazarini
Hi guys, I decided to dive into FramerJS, I was wondering whether you could point me to nice beginner resources, tutorials. I read the documentation and have seen some nice post on medium. Thanks a lot :)
3

July 26

Asher Isaac Simonds
Hello folks! Wacky draggable question - A few fellow teammates and I are working on a draggable element for a hackathon and are wondering about how we might build it. Hopefully I can clearly break down our scenario: We have a center point that is dragged around the screen like normal. We also have a larger element that is linked to it displaying screen information. The trick - we'd like to have that element drag around with this element as though it was attached like a trailer. Image attached for visual explanation. Is this a feasible interaction for Framer to handle, or are we stuck animating it in After Effects? Thanks!
10
Mudassir Azeemi
Any discount code for Framer JS Studio !??!
4
Alexis Morin
Long time listener, first time poster. Here's a little prototype I made for a microphone for toggling between active and muted. Comments / insults are welcome.
3
Pete Schaffner
Quick tip on updating node modules in your projects: 1. $ npm update 2. Make a change in and save the module file where you are `require`ing the node module (like myModule.coffee), as Framer Studio looks for changes to any of the files in the modules/ directory before re-bundling everything. 3. View > Reload Preview (⌘R) to re-bundle and see the updates.
1
Vipin Kosuri
After doing basic prototyping with Invision, i want to use framer for high level prototyping. I have experience in HTML & CSS but never learnt JS. This would be my first time. Should i learn JS or Coffeescript? Any resources that would help me learn and get into prototyping within a month? Thanks
12

July 27

Benjamin Zanatta
Hi people ! My brain can't find the solution : How is this possible to create a wheel that I can rotate at will ? Here is a demo : http://share.framerjs.com/pt7k7c7g3jvy/ You can also download this app to see what I want : https://itunes.apple.com/fr/app/orthoplay/id582616765?mt=8 Thanks !
2
Shahzeb Khan
Any way to get a student discount on the software? Tried emailing them but got no reply.
1
Joon Won Lee
Is there anybody who has a problem with sharing function on FramerJS studio? now? It doesn't work on me now.
2
Arvi Raquel-Santos
How do I set the width and height of a pageComponent that references a sketch file? In the example, the circles should scroll horizontaly from the edge of the screen? I tried "circle.width = Screen.width" but that didn't seem to work. I also tried adding a mask in sketch but it wasn't importing the layers properly... http://share.framerjs.com/f876tp4io5s4/
4
Văn Công Bằng
Can i add another devices to framer studio ?
3
Aaron Paterson
http://share.framerjs.com/2dbm481zka7f/
2
Anubhav Saxena
Hi, I am using framer for a desktop prototype and was wondering if there is a way to change the pointer circle to a normal mouse pointer?
7
Rapha Ël
Hi community ! Does someone have a good tut for bezier curves with Framer ? (is it a implemented fonction by the way ?)
2
Yang Gao
Hi, does anybody have this problem? I saved a Framer file and opened it again instantly, and its preview window was always blank. There wasn't any warning or error message, even thought I import my sketch file again, the preview is still blank.
3
Dean Broadley
Am I missing something here? That starting example looks remarkably familiar haha
4
Văn Công Bằng
Could someone please explain to me what DidStart and DidEnd actually are ?
2
Ina Moon
Hi, this is my first time using Framer JS. It might be easy for others but I'm trying hard to figure out how to make scroll, still, I don't get it. So what I want to do is scroll 'grid.png' section up and down.
4
Aaron Paterson
http://share.framerjs.com/k0x6qy7coavs/
4
Madhu Rajanna
This is an awesome tool but Is there a basic tutorial to get started. I imported. PsD file and it imported all layers but couldn't figure out how to apply interaction for each element. For example trying to slide open a menu on clinking menu hamburger. Appreciate your help.
1
Katie Wu
So Chris Camargo and I tried to solve this issue last week but didn't make much headway: the pages in a PageComponent go 1,2,3 with a black square on page 2. Once the square is pressed, the steps switch positions to 2,1,3, but step 3 get's cut off from the PageContent and cannot be swiped to. Any ideas? Thanks!
2
JL Flores Mena
Hey all, If you have used Scroll Components and draggable elements in your prototypes, I'm sure you've encountered the infamous 'this._simulation.y' bug. I went full mythbuster on this and I can say that there's always a solution for that bug. You just have to rethink the logic of your code. Maybe I should write a post about this to go in-depth about my findings, but for the time being these examples might suffice. Download the projects and look at the code. : ) A few months back Randy Huynh shared this example: http://share.framerjs.com/l1k0oo93a800/ Please take a look at the code. (To trigger the bug, drag the element, stop dragging WITHOUT releasing the element, THEN release). Here's my fix: http://share.framerjs.com/xfepzd72rmsu/ Check the code, seriously, that fix is a joke. Here's another example, using dynamic objects: http://share.framerjs.com/84wptf2nof20/ Things to keep in mind (not all of these are shown in the previous examples): - Double-check your code if you're using conditionals and '.animate' inside your DragEnd/ScrollEnd events. Your solution might be right there. - Consider creating an 'Animation' instead of using '.animate' (see Docs). - X's befores Y's!! - TouchEnd events trigger BEFORE DragEnd and ScrollEnd. Try to use that in your favor if you're using flags to change the state of things. I know all of this is a bit abstract, but I hope it helps!
2
Chad Clawson
Just watched the video. I'm stoked to try this out. I see that you support PS and Sketch. Any chance you'll be supporting AI anytime in the near future?
6
Katie Wu
This is a really simple question but I can't seem to figure it out: There are 3 pages (A,B,C) in a PageComponent, arranged vertically, I want to limit the scrolling on page B to JUST up. I have something like this right now: pageComp.on Events.ScrollEnd, -> ------if pageComp.currentPage == B ------------do something here to limit the scroll/swipe on page B
4

July 28

Giovanni Caruso
Hi! Messing around with the scrollComponent. Some fix needed to get to the original experience.
0
Arvi Raquel-Santos
Feeling a bit confused. When setting up my Sketch file to use PageComponent, should each swiped page be a different artboard or can they be a different group? I'm playing around with this prototype and wondering where the extra space between each page is coming from — http://share.framerjs.com/48cvhjszq78v/ Currently in my sketch file, each page is positioned to 0,0 (graph 1, graph2, and graph 3)
1
Jacob Berlow
When I am using layer.visible = true / false, is it the act of loading the image from the server that is slow, or is it already loaded and just slow to hide / show? I have thought about using layer.x = -999 / layer.x = 0 instead of layer.visible = true / false, since moving things around seems to be faster than hiding/showing, but this has some problems. Any suggestions? I am using the Framer app a somewhat lower-end Android device (Moto E).
0
Jacob Berlow
Is it possible to have an instant version of "layer.states.next(states array)"?
6
Marta Kiszko
Hi there! I'm new here. I'd like to start learning framer and I must say I'm a bit concerned. I have never been programming before. I barely know HTML/CSS. Would it be a problem to start? I have a background in Axure. I've created lots of interactions, but haven't exactly paid attention to the code it generates. What would you recommend for the first time? I'm gonna use it at work to creat interactions in Sketch.
2
Văn Công Bằng
I noticed in one example that has a line of code: scroll.content.once Events.AnimationEnd, -> what does once mean here, can't find it in docs. Thank you
3
Josh Ackerman
I just posted a prototype of a better tablet interface on dribbble, http://drbl.in/pvIx. In the prototype I included a cool new alternative to folders based on graph theory. If any one is interested I could upload the source file, or write a small tutorial about how to make something similar.
13
Stephen Crowley
I am designing a Dashboard and would like the numbers to animate like countup.js... wondering if it's an effect I could add without using countup.js. Maybe it's Friday but I can't wrap my head around how I should go about it. Thanks in advance for any input :)
21
Raphaël de Courville
Is there an easy way to create a realistic bounce easing/tween in Framer? I've looked at the Easie library but it takes a “time” variable. Framer doesn't allow using while loops so I can't implement it in the way shown in the example snippet (see image). Thanks for your help!
6
Katie Wu
How could I simulation a more iPhone specific interaction, like pinch in to zoom outward? Like if you're looking at a photo on iPhone and then you pinch, it'll reveal the photo's place in the larger grid of photos.
4

July 29

Luis Ricardo La Torre
I want to listen to the change in x "change:point" and do something when the touch ends "TouchEnd" . How would I do that? Which listener should use?
0
Algert Sula
Hi all! I wrote this blog post a few weeks ago to show my fellow designers how to add drawing effects to their FramerJS prototypes. Let me know your thoughts :)
1
Chris Wang
hey guys, is there a way to use backface-visibility in Framer? I'm trying to do some card flipping effect. Jacky has a great module for it. But the fading of Top/Bottom layer doesn't work very well when you customize the easing curves or slow the transition a little bit. Is there a way to just assign a layer to the backside of another layer?
0
Rohan K
[SOLVED]Does anyone know what's the best way to create a mask for a layer? I'm trying to recreate the notification interaction as seen on the iPhone lock screen. I want the action buttons to reveal as you slide the notification to the left. -WebKit-mask works but I am not able to move it. Can I use another layer as a mask, maybe?
2
Santosh Sankar
Hi, I am just getting into Framer and was wondering why the blue boxes are showing up on my file.
3
Luis Ricardo La Torre
I was doing an elevator pitch using Framer, as you could probably guess everything went wrong. I pulled the Frameless app, and I had no wifi on the elevator. Any good Ideas or potential features to solve this problem. Any good ways to cache the prototypes on the iPhone.
32
Pavan Ravipati
total newbie to framer...I tried importing my sketch mockup into Framer Studio and can't figure out how to center my sketch mockups in the framer preview panel. pic:
6
Dan Clarke
Hi all this may be considered a strange request. but is there a way to force framer in to pixel mode rather than vector. I am trying to mockup an LCD screen at 96x64 resolution and need non-vector text. I realise I could create assets in photoshop/sketch but I want to create some more dynamic displays
4
Dan Clarke
Hi everyone, getting in to superLayers, however, the subLayer seems to be 'hidden' by the superLayer when I instantiate it?
7
Jeff Lin
Hi Guys, Does anyone know how to add images to each “PageComponent” page that is created with "for" keyword? Thanks!
6
Rohan K
Im trying to share my prototype but some of the images are just not loading. I tried multiple times and there are always a few random images that get left out. is this a bug?
9
Akhil Dakinedi
got a question on how to set something up. this is a prototype for a quiz where the question shows up on the top part of the screen and the user can swipe through the answer choices at the bottom to view them one by one. that whole answer container needs to snap to the proper position upon a left/right swipe. ex: from this screen (see image), if the user swipes left, the "B" cell needs to animate in to where "A" was. Another left/right swipe from "B" would then accordingly animate "A" or "C" into the screen. Ideally, I would also want this to loop infinitely, where a left swipe from "D" would show "A" again. I know there's a bunch of examples like this for snap-scrolling on the Framer Examples site, but they all use cards generated on the fly in a "for" loop inside a pageComponent which doesn't quite explain how the snapping works and how the left/right swipe is detected. I'll be setting this up in Sketch and then import them in to Framer. So far I've tried making the whole thing a draggable, tried a horizontally scrolling pageComponent, and tried animating each answer cell separately with not much luck. Any ideas, suggestions, or tips? Thanks in advance.
4
Guillermo Romero Jr
I've got a sketch file I'm using for art. Imported successfully. Set indexes accordingly to get the layering I'm looking for. I then put some of the imported assets into a scroll component. As soon as I do that, it ignores the indexes from all the imported art from Sketch and index = 0 puts it behind everything, and index = 1 places it in front of everything, ignoring all my other indexes(I'm using 0-5). I'm guessing it's because it looks at the imported sketch file as a separate layer from the scroll component layer I create through code. Any suggestions?
1

July 30

Guillermo Romero Jr
I love Framer!
1
Benjamin Bilow
Ok, here is another one: is there a way to make my entire framer project responsive with out using Jay Stakelon's fluid framer extension http://stakes.github.io/fluid-framer/? With out having to edit the html of my share?
6
Arvi Raquel-Santos
Has anyone been experiencing lags or sluggishness in their prototypes when sharing their projects? cc. Koen Bok
2
Danyi Wang
Question: anyone use samsung Galaxy s6 to do prototype on framer? Framer doesn't have device present for samsung phone. How can I preview my prototype in right size on framer?
1
Andy Cetnarskyj
Noticed that the pixate group has shutdown and moved to slack. I use this for remote work and it is excellent. Any chance of framer doing the same, easier to find and bookmark things than facebook
8
Katie Wu
This is just my wondering, but did the Framer.js community ever consider using Piazza as a way to post questions/answer questions? We use it for a lot of CS classes at my university and it's super helpful: it supports code, it bumps all unresolved questions, and it's really organized!
2
Keith Lang
In Framer Studio the following code is working (letting me draw stuff on Canvas at the mouse Position), yet on iPhone it's producing 'underfined' for myX and myY. Any ideas? myCanvasView.on Events.TouchMove, (event, layer) -> myTouchEvent = Events.touchEvent(event) myX = myTouchEvent.x myY = myTouchEvent.y
3
Keith Lang
I immensely appreciate the Frameless.app / Framer Studio experience. However, testing my prototype often triggers the swipe-from-offscreen-left gesture that shows the Project picker. Is there a way to disable this, or another method that would get a fullscreen, scroll-less view?
2
Anton Kartashov
For Russian-speaking members of community: Basics of CoffeeScript for Framer Основы кофи-скрипта на русском языке
4
Constantin Jacob
Guys. Whoever did this: Thank you so much!!! I was waiting for this for so long :D
4
Katie Wu
Buttons that used to respond to Events no longer work. In the picture I show that Framer recognizes the physical button on the prototype, and the highlighted code is a simple listener I attached to it. It won't print the line.
8
Dave Huber
I've decided to switch over to Pixate because Framer is too difficult.
19
Ryan Gambles
Has anybody tried using Google's dat.GUI library for allowing state control of prototypes? I recently incorporated it into a prototype and it's proven to be pretty dang useful for finding edge cases, letting developers jump around to different key states, and all sorts of other things: http://workshop.chromeexperiments.com/examples/gui/#1--Basic-Usage I added it to my project as an nmp module and instantiated it in the prototype using: {datGUI} = require "npm" prototypeControls = new datGUI.GUI() prototypeControls.add(progressBar, 'percentage', 0,100).step(1).listen(); Just need to add to Style.css to make it usable: .dg.ac { z-index: 100000 !important; }
3
Keith Lang
Found myself wanting to drag layer items from the centre column into my code, hoping it would insert the layer name into the code 😊
0
Dan Clarke
Hi Framer devs! Quick question for future reference. Is it possible to deactivate a framer license on an 'old' computer and activate on another if upgrading to a new computer?
5
Ed Lea
Having trouble with differentiating between clicking and dragging. I have a scroll component full of clickable things. But swiping the scroll component is triggering the click. Any advice?
3
Asher Isaac Simonds
Is there a way to tune the import process Framer Studio uses when pulling resources from Sketch to do so at a size multiple? I design in MDPI to avoid strange layout measurements and to reduce file size, but to preview correctly on a device I need XXHDPI, for instance.
2

July 31

Ash Adamson
Hey yo! Framer Sessions SF will be held on August 5th. To give everyone a chance for a ticket, I will open up spots August 3rd 9AM. Still looking for mentors if you'd like to volunteer! Event Link: http://www.eventbrite.com/e/framer-sessions-03-sf-tickets-8252115299
15
Elliot Nolten
Hey guys! I don't know if anyone else has this same question or if this was asked before. But is there a way to import only selected artboards from a Sketch file? Or maybe import only one instance from a Sketch Symbol? I don't want the 'imported' folder to get too bulky. As you can see I get a lot of duplicate images from the import. Hope there is a solution. Thanks!
3
Jeongmin Kim
Hi Framers! I need help about animation. How can I make circular path like Min-Sang Choi's work? (I think this case used sin, cos) And, are there any way to make bezier curve in framer?
6
Thomas Law
Can I manually reset the value of Utils.randomNumber after the page did load?
0
Berend Holtland
Hi Guys, I'm sorry if this has been answered already, but i couldn't find a solution. I've imported some groups from sketch. I also made a layer in Framer. Now i want to place the layer behind one of my Sketch groups. I've tried using index, placeBehind() etc. but it won't work. any idea what i should do? New Framer update is awesome by the way! :)
2
Rory Smyth
is there any way to prevent this blurriness when importing?
7
Dallas Peters
Help understanding spring syntax! I know I saw it somewhere, but can someone point me to (or explain) the syntax for spring()? i.e. spring (100, 30, 0). What are each of the 3 defining?
21

Monthly archives

2017

2016

2015

2014

2013