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

What is Framer? Join the Community
Return to index

February 2015

February 01

Kevin Cannon
Does animationOptions apply to background colours? My quick test seems to say no. Is that a bug or known issue, or am I doing something wrong?
5
Koen Bok
Two new beta features to test for you guys. If you want to try them do "File > Update Framer" in your app. Please be aware that these may change or break. --- Utils.globalLayers(<layers>) makes all your imported layers global so you can use myLayer instead of importedDoc.myLayer. It will not overwrite existing variables but throw warnings instead so that you won't accidentally override window or document (and break everything). http://share.framerjs.com/kwmwgs0aan1r/ --- Utils.textSize(text, style, {width:n, height:n}) is a way to calculate text size. Handy if you need to do a layout that depends on the height of a title for example. You can constrain either the width or height of the text. http://share.framerjs.com/fl5f73vz1ei8/
3
Danny White
I'd like to be able to 'scrub' through these layers (coloured circles) without lifting my finger off the screen. Any ideas on how to do this? The idea is when you touch and hold on a coloured circle, the relevant sound will play (a video with opacity: 0) and information will show above. The user should be able to move their finger across to any other coloured circle (and not have lift up their finger in the process) for a new sound to play and information to show. Thanks in advance!
6
Alex Miles
Is there a way to cancel a Utils.delay after it has been called?
8
Kai Daniels
Hey all, is there any way to have two layers animate, for instance translate in the same direction (but delay one layer for some duration) and then have that same layer start animating, but at the same rate of acceleration/derivative of the other layer? I'm trying to go for a "push effect" and am trying to recreate the calendar featured in the Material Design reel. Video Reference: http://youtu.be/Q8TXgCzxEnw?t=26s
1
Joel Leví Hernández
Does anyone have an idea of why when I set the scrollVertical flag to true it works on the computer browser but not on the actual device? (doesn't scroll).
1
Fabian Henzler
Hey guys, is there any nice tutorial on how to work with inputs and probably mock data?
0
Giovanni Caruso
Hi! Did a quick experiment recreating the Tumblr "add new content" animation (http://share.framerjs.com/57dz7aiifa4q/). I've used states and delay to handle the "in" and "out" order. My questions: 1) Is there a way to rewrite the same pattern using the logic of the staggered animation example (http://framer.com/examples/preview/#delayed-animations.framer#code)? 2) Any idea how to reset states without executing the animation? (see line #131). Thanks for your help!
0
Jo Higgins
I am trying to get states to work with myLayer.states.add("infocus", {scale:1.1, shadowY:20, shadowX:20, shadowBlur:20, shadowColor:"rgba(0,0,0,0.6)"}) but it keeps scaling and then after a pause, the shadow displays. I messed around with the default animation and could see the shadow appearing at some weird coordinate off in the distance, then popping into position when the scale had finished. Any insights would be great!
2
Diogenes Brito
Have y'all run into the issue where layer.once....happens more than once?
3

February 02

Moaaz Sidat
Is it possible to do something like: > "foo folder for folder in Sketch.folders" to target each of the groups within the super group 'folders' in a Sketch file, and applying the function foo on them, in Framer? What is a better way to do this?
2
Moaaz Sidat
Hey folks, I recently got back to playing around with Framer and decided to replicate an interaction I really like on Google Drive's Material re-Design on Android L using Framer. Thanks to Joshua Tucker for helping with a question I had earlier. GIF: https://dribbble.com/shots/1910344-Framer-Experiment-Google-Drive Live Demo: http://share.framerjs.com/5y1a331nmach/ Feel free to download and play around with this. In case you choose to dig in, I'm always looking for feedback on how to do something more effectively/efficiently. Also, let me know in case you see something's off. Cheers!
1
Cemre Güngör
I managed to nail down the reason of the "Script Error" error right after importing. When I close and re-open sketch, I find that the file I was trying to import into framer got corrupted, all the bitmaps disappear. So it seems like this is a sketch-related bug.
4
Stephen Crowley
The Interaction Design Assoc. conference Interaction15 in SF starts in a little over a week, I'll be there and just curious if others from the Framer community will be attending? Would be great to meet up!
8
Matt Wujek
How do you turn an integer into hours and minutes? I'm trying to get a slider to show times between 12am and 12pm. Framer file (sorry, it's messy): http://share.framerjs.com/l4srozpbx7ds/
1
Chase Klingel
I'm planning to make a prototype for a desktop site. Is Framer JS a good option for this?
8
Pietro Schirano
Framer is such of a fantastic tool and it was able to boost my design process in a way I could never think! I just finish to work on this transition for my blog app, thank you guys for making such of tool! The link to the framer project is the comment :)
8

February 03

Jardson Almeida
Once again about the cooking app. This is a pretty simple animation for the scrolling content action, but still cool. Any thoughts?
2
Joshua Tucker
Happy Super Bowl Sunday to all who follow! Or, greetings to all of you with the timezone appropriate phrase! :). I spent a few minutes this afternoon writing up a tutorial on an incredibly-powerful feature that Framer Studio offers (one that I think is often overlooked) – code snippets. Code snippets are essentially saved or bookmarked code you can create for Framer Studio so you can quickly add specific code you put together whenever you wish inside a project you are working on. This is great especially when we are bombarded with so much great code from tutorials, examples, and the gracious people who contribute to the community here. We can't possibly remember it all. Now we don't have to worry about it! http://joshmtucker.com/how-to-create-your-own-code-snippets-for-framer-studio/ Enjoy! And excuse my relatively plain website in advance – my HTML/CSS skills are a work in progress!
9
Arvi Raquel-Santos
Brandon, figured it out! Thanks for the assist and inspiration from Rob's question. http://share.framerjs.com/6ati8bifpe5n/
1
Patryk Sobczak
Just finished my second prototype! I'm not very happy with the code quality though, I have a felling it could be way more efficient. Some questions: 1. Is there an "on load" event, so the content box animation could start automatically, without requiring me to tap on the background layer in order to toggle them? 2. Can I set .states.animationOptions for two or more layers in one line? What's the syntax for that? I'd appreciate any comments that could help improve the code, you can play around it with here: http://share.framerjs.com/2f3b4ys10xbk/ I also shared an axure link if anyone's into that. Also, thanks to Pietro for the mockup inspiration!
6
Peter Hilgersom
Silly question: can you disable the bubble pointer on desktop? :) (context: I'd like to create a gif without the pointer ^_^ )
2
Kevin Cannon
Has anyone mase a good example of a Tray menu? I'm looking to include one with the ability to slide them menu in from the edge of the screen.
0
Emilio Iantorno
How do i get started ? I design ui in sketch but would love to make protoypes using JFramer JS?
3
Chad Lonberger
Question regarding loading JSON models from the local file system.. Didn't have any luck loading local JSON with Utils.domLoad* (via XMLHttpRequest) expectedly due to the same-origin policy. Tried wrapping the model in js (see below) and including it in the index.html. It works but is proving to be error prone for PMs who are attempting to update the data (and the prototype) to fit their use-cases. Aside from pushing the model to a server, Is there a preferred way to do this? Thanks in advance everyone. data.js: ----------- (function() { this.data = { "key": "val" }; }).call(this);
2
Rob Silverii
New to Framer and I'm trying to replicate that toolbar animation that Google is using in the Android and iOS version of Google Maps, but I'm struggling with how to handle the fade out and fade in of the text based on their y coordinates. Thanks in advance.
5

February 04

Brandon Souba
Quick little demo for Rob Silverii: http://share.framerjs.com/9vaw1axrlzaj/ Trick is to use the "utils.modulate".
2
Zoltan Ray
Wondering if it's possible to use the animation object's bezier interpolation on the output from Utils.modulate... Seems like I could pass (0-1) output to something like https://github.com/jsplumb/jsBezier then remap the resulting coordinates back to real numbers. But that also seems pretty impractical to do every frame - is there a better way?
2
Brandon Souba
Built a quick card scroller for Arvi Raquel-Santos. Code is available here: http://www.facebook.com/l.php?u=http%3A%2F%2Fshare.framerjs.com%2F4zjph8mtwclb%2F&h=eAQF6WJV4
4
Peter Ng
thanks for the tips with video layers Koen Bok Jorn van Dijk, but my suspicion was correct that mobile browsers suppress non user initiated video playback. Back to using gifs to making it work on device? or perhaps an imageSequence layer might work best for ae to framer.
30
Luke Warda
HI guys. I'm trying to prototype an address form with different states of input based on input state (unfocused, focused, filled in etc). I want to later save that into a variable and render in another layer. Is this something Framer could be used for?
6
Fran Pérez
Is there any way to access sub layers through their parent? parent.layer.doSomething() otherParent.layer.doSomething()
3
Jay Stakelon
First of all, thanks to George Kedenburg III who's been sharing some awesome tutorials about how to integrate Parse into Framer projects for heightened realism and general awesomeness. Inspired by these examples, I wanted to see if I could do something similar with Firebase to share with y'all. Here's a working, admittedly somewhat rough, example I came up with. This prototype pulls popular items from the Designer News API and uses Firebase to keep a list of upvoted items. Firebase allows you to subscribe when items are added or removed and I use those updates to tell Framer when to update the feeds and items in turn.
3
Cemre Güngör
Robyn Morris managed to get inline html5 videos play in a framer prototype by slightly modifying Josh Puckett's viewer app!
13
Logan Merriam
One more quick one: if I scale a draggable layer, it's drag speed changes. For instance, if I scale it to .5 the speed appears to double. Workarounds?
3
Jérémy Jones
Quick question guys, can we export a prototype to a GIF animated? Like that https://dribbble.com/shots/1911722-Corporate-task-manager-dashboard-UX?list=searches&tag=framerjs&offset=2 Or do I need to record my screen? Thanks
11
Logan Merriam
Got a draggable element, and on DragEnd i'd like it to figure out if it's near one of the little dropzones below it and land in that dropzone instead of returning to it's original spot. I know a couple really crappy ways I could pull it off, but would like to understand the right way. Thoughts?
6
Stephen Crowley
Anyone integrating Hammer.JS in their prototypes? For some reason when I import my layers and save, the gesture functions do not work... if I add a line to my code in the editor they do start working. Not sure if anyone has any suggestions?
2
Tarun Chakravorty
Is there a way to detect scroll vs touch for when I'm playing with a prototype on ios? Currently, if my fingers accidentally "touch" the clickable layers while I'm scrolling a phone prototype up and down, it activates the click event and starts executing it while scrolling. I guess another way of asking this is: Is there a way to cancel touch events while i'm scrolling the prototype up and down on a phone?
0
Charlie Sneath
I'm trying animate the opacity of 3 objects that are hidden in my Sketch file. I have set their visibility = true, and am trying to animate opacity to 1. There are three layers I would like to animate in sequence: layers.result0 layers.result1 layers.result2 I am setting the current layer name programmatically, but the layers are not animating correctly. It works if I have the layer unhidden in Sketch when loading the file. Any ideas? Thanks! showResults = (i) -> if i < 3 result = layers['result' + i] result.animate properties: opacity: 1 time: .3 Utils.delay .05, -> showResults(i + 1)
3

February 05

Jon Knoland Blair
Hey all. I'm trying to get Google Map API into Framer. I can get the map to display and style, but I can't get it to be interactive. Can't move the map or zoom. Any ideas how to do this?
10
Peter Hilgersom
hi guys, for the code guru's, there must be a quicker way to do write this snippet right? :)
3
Jérémy Jones
Hey guys, what is the best way to integrate a PSD? 1 - You name all your folders, import them via import-FramerJS 2 - You slice the PSD and export all the images inside the /image FramerJS (example) content = new Layer x:0, y:0, width:640, height:1665, image:"images/content.png" Right now, I'm testing the second choice and I have some questions. Check my example:http://share.framerjs.com/tijzmm2qcvrt/ When I hover the hamburger, I would like to change the hamburger color. I use the Events.MouseOver & Events.MouseOut to do that with an different image. Is that correct? Do you have any other solutions? As you can see when I click on the hamburger, I have an animation. I would to keep the hamburger at the same position, inside the blue bar. What I tried is to manipulate his Y. But failed, not the good way, too tricky. What should I do? Thanks a lot.
0
Kim Does
I've been working on a details screen, and specifically on scrolling (nav bar appears) and drag to close. It works pretty well on my mac, but not on a phone. This probably has to do with the fact that scroll events (or drag?) don't work well on touch devices. Any suggestions how to make it also work on touch devices? Or how to make an alternate version for touch? http://share.framerjs.com/8f80tnw7kldn/
5
Peter Hilgersom
Is there a way to disable the logo and open/download buttons? ^_^
0
Arvi Raquel-Santos
Looking for help on implementing a snap scroll. I was able to figure out how to snap between the first and second cards but can't figure out how to implement snapping to the third card. I have a simple conditional but I assume I'll need something more complex? Any help is appreciated. Thanks! http://share.framerjs.com/o3jcfqmsri4t/
15
Christian Poschmann
Hey guys, thought I'd share what I'm working on right now. Still pretty wonky and i'm playing around with a couple of ideas here. I'm by no means a programmer , so this community was of great help.
11
Benjamin Den Boer
We just launched a refreshed home page! New sections include our presentation at Stripe, new examples and more. Special shout out to Noah Levin and Michael Oh for their great prototype! http://framer.com
3
Kai Daniels
Hey guys, check out my prototyped calendar mimicked from Google's Material Design reel! Took three days and has terrible code, but it works! http://share.framerjs.com/k2umsqs1ysao/#
14
Mariam Braimah
Hi Guys! I just downloaded framer.js and framer generator, but I'm having an issue with importing PSD layers from PS CC to framer. It seems like the import is going fine b/c I get the "Framer.Importer.load" after the import is complete but I don't see any of my layers populated on the left hand side like the screenshot shows on the site (see attached screenshot). Can someone help me this? Not sure if its a view setting that I'm missing. Thanks!
8
Mohamed Tedjani Meftah
Is there a way to use multiple files with framer? I would like to save a bunch of math functions in external file and the import them in different projects
5

February 06

Tannia Obregón
Hi, I'm using the touch events to trigger some animations, but I'd like to know how can I stop the TouchStart event from bubbling up, because is messing with my animations. Thanks :)
1
Nick Franchi
Does anyone have any recommendations for beginner tutorials? I'm a designer trying my hardest to adapt Framer JS to my workflow, and would love any input or tutorial links that you could provide. Thanks so much!! What a great tool!
8
Vaibhav Kanwal
Hi Guys, I have a question about having 2 keyboards popping up in the browser on mobile. Is there a way to only have one keyboard on mobile browsers. This seems to be the issue for my own code and also one of the example on framer website. Refer Example :
8
Benjamin Den Boer
We just updated our Examples page! Featuring new prototypes from Noah Levin & Michael Oh, Kai Daniels, Jorn van Dijk and one of mine. :-) Voice Onboarding - http://framer.com/examples/preview/#voice-onboarding.framer iOS Lockscreen - http://framer.com/examples/preview/#ios-lockscreen.framer Calendar App - http://framer.com/examples/preview/#calendar-app.framer Image Slider - http://framer.com/examples/preview/#image-slider.framer Be sure to check them out! If you have a prototype you'd like to see featured in the gallery - please don't hesitate to reach out: [email protected] Have a good weekend all!
0
Guus Baggermans
Hey Koen Bok, I'm currently sending clients zipped version of my .framer folders, for them to run locally I found that the device image doesn't show up when run locally. The URL to the 'background image' shows up as file://resources.framerjs.com instead of http://resources.framerjs.com. Luckily it was fixable with css though :)
2
Joshua Tucker
Not sure if any of you have ventured through Framer Studio's Menu, but there's a neat feature you might be interested in under View > Show Invisibles. Show Invisibles adds symbols to each line in your code editor so you can see how its indented. It's really handy!
0
Arvi Raquel-Santos
Any tips or examples out there on how to revers an animation based on scroll position? Trying to doing something like Twitter profile photos. Here's where I am — http://share.framerjs.com/kv111cufhy4d/
8
Stephen Crowley
Card Dismiss with Tilt- Select Card > Drag up to cancel, drag down to dismiss card.
0
Koen Bok
If you ever wondered how Bézier curves work, check out this visualization.
9
Joshua Tucker
I call this "ColorfulAccordion." Seemed fitting. It demonstrates an accordion-style drag open/close shade. Mostly made for fun and to practice with condensing layer code as much as possible. The document is thoroughly commented so please feel free to read and play around with it. If you're initially testing it in the browser, note that you can drag starting from first layer on the left. That's the only one that is draggable and the others follow suit. The initial concept was from Stephen Crowley!
0
Cemre Güngör
Do we have a great example for paging views? Eg. I have 5 screens side by side, I can swipe through them, I always land directly on one of the screens (like the iOS home view)
5
Arlo Jamrog
Hi all- I published a writeup on redesigning Contacts on iOS, and used Framer in it. Give it a look, maybe it'll spark something.
2
Adam Kopec
I want to create a basic photo gallery. Tap on a photo to zoom, tap on the back button to reverse the photo zoom. I want it to act something like this: http://share.framerjs.com/10jhc0a8a5j0/ However, I rather just use something like .reverse(), which I've tried here: http://share.framerjs.com/43q6q5fnq00b/ I'm having scoping issues (I think?) and can't seem to call .reverse() on that thumbnail image. Any tips?
2

February 07

Edward Sanchez
How can I reference a layer in a row of layers? For example: rows = 6 [1..rows].map (a) -> cellLayer = new Layer backgroundColor: "#FFF" width: width height: height borderRadius: 6 x: 200 y: a * (height + gutter) + startDelta If want to drag the 3rd row and animate the 4th row.
2
Gabriel Jorby
Nice case study! — "Around that time I begun heavily embracing Framer.js and then Framer Studio for interactive mobile prototyping. The timing could not have been more perfect. Little did I know at the time how crucial this would prove to my process."
0
Jesse Mainee
Anyone know how to change the status bar color when previewing on device? Or remove it completely?
13
Jitendra Vyas
The Javascript code which we write to make Framer.js prototype can be used in native app too? I mean can i give that code to iOS or Android developer so they can use that code to have those animations and interactions in the actual app?
3
Edward Sanchez
How do you animate between 2 colors? Googling framerjs + keywords rarely gets me good results 😔 Searched through examples and only saw one which was using states and huerotate, but I want a specific hex. What would be really useful is if in the documentation, there were links to the examples that use each feature. Shouldn't take too long to map it all out. Thank you!
5

February 08

Matt Bogado
I'm trying to recreate the LinkedIn card interaction in framer, but it turned out to be more complicated than I thought – I'm not a developer :( Here's what I've got so far. Any recommendations on how to complete the interaction?
13
Ben Gotow
I know Framer isn't intended to be a production-facing animation framework, but does anyone have experience using it to power animation in a shipping app / website? I would love to substitute real DOM elements for layers and run our animation code without modifications!
1
Kjelle Vergauwe
Hello Framer folk! Can someone tell me if it's possible to cache an entire prototype on a device? A client needs to showcase a prototype without an internet connection. And I am clueless on wheter to do this with a certain browser that caches everything, or to do it with code somehow...
4
Benjamin Den Boer
If you're just starting out with JavaScript or are looking for something to keep on hand for reference - I can really recommend the JavaScript & jQuery Book by Jon Duckett. "We'll not only show you how to read and write JavaScript, but we’ll also teach you the basics of computer programming in a simple, visual way." http://javascriptbook.com http://javascriptbook.com/about/
5

February 09

Jitendra Vyas
Can we also make graphics (like things we ca create with html and css only) with Framer or whenever we need a grphic it should be imported from Photoshop or sketch?
8
Jitendra Vyas
So we cant see framer preview on windows phone. Windows Phone doesn't have Webkit browser
18
Jitendra Vyas
How to get this setup in my browser locally as shown in this Video https://vimeo.com/74712901. half screen for code and half screen for live reload preview? I download framer.js from github but index.html opens preview in full screen. it will be cool if I can setup like this. I tried with Sublime Text in half screen and preview window in half screen but preview windows is not responsive.
8
Cemre Güngör
Anyone else encounter a bug with the Sketch importer where layers grow twice as big if they are totally transparent? I sometimes need transparent layers to define click targets or to make masks. This is what I get in Sketch and Framer Sketch file: https://www.dropbox.com/s/9exkfkx9ivfk6y7/MaskTest.sketch?dl=0 Framer: http://share.framerjs.com/joqidllq9mnu/ cc Ale Muñoz
5
Jon Knoland Blair
$(window).height(); is not returning the correct value, any idea why?
8
Jeff Lin
Does anyone have an example of how to set up a custom device? I am trying to set up a custom device for my project, but for some reason the device image is not showing...Thanks in advance!
2

February 10

Tin Kadoić
I have a lot of issue with importing from Sketch. Constant errors and unrecognized layers. Not sure what to do.
5
Parul Bhatti
I'm just wondering if anyone else is seeing the same thing, or if it is just me. 'Sorry, sharing is broken on Yosemite'
3
Burak Esen
Hey guys, im having a little issue. I want to make a message visible, after a few seconds invisible. Then the next message should appear. I want to stay "ABC" for a certain time. I tried "time: 5", but somehow it seems to be ignored. My code so far: XYZ.on "end", -> ABC.animate properties: {opacity: 1} time: 5 delay: 1 ABC.on "end", -> ABC.visible = false UVW.animate properties: {opacity: 1} delay: 1.0
6
Hugo des Gayets
Hi Benjamin Den Boer I have a quick question. What is the simplest way to animate back and forth the blue Layer with the current parameters? Thanks!
3
Charlie Sneath
I currently draw my mocks in Sketch at 1x. Is there a way to have mocks from Sketch display 2x in Framer?
6
Lucas Carmichael Lu
Hey guys! I have been wanted to learn FramerJS for a while now. I am a product/visual designer with a good understanding of CSS but only introductory to JavaScript. Any designers out there who have mastered the tool want to share a little bit about their experiences? Thanks.
2
Bobby Giangeruso
Quick question (hopefully), Would it be possible to directly call an artboard from an imported Sketch file as I would with a folder? At the moment, I have a temporary fix for this by keeping everything in one artboard but that's unusual and quite unorganized.
7
Cristian Constantin Olarasu
Hi guys, Is there any way to generate the assets from photoshop(windows) without the generator app? Thanks
2
Charlie Sneath
Is it possible to use states to change an object's superLayer?
3
Christian Poschmann
Hi everyone, I'm having some trouble with putting layers on top of each other. Here I'm trying to bring the Search icon on top of all other layers. But neither layer.index or layer.bringToFront seems to work. I'm having two artboards in Sketch. The search icon is on artboard 1, the scrolling layer is on artboard 2. Any idea?
0
James Wenzel
In the prototype I'm working on I have click targets as subLayers of a scrollable container. It appears the TouchStart or Click events take two clicks/taps because of the scrolling container... is there a work around for this?
0
Jeff Chang
Hi Everyone! I have a question on how to make something like an inverted mask? Basically, I have a layer that's 30% black, and I want to cut a circle in it, and have that circle be animated. Has anyone done something similar?
9
Tony May
Hi guys, has anyone used the app.js from framer to compile a functional phonegap application?
5
Jérémy Jones
Hey guys, do you know where I can find a framerJs prototype similar to this: https://d13yacurqjgara.cloudfront.net/users/57127/screenshots/1713244/gravedona.gif Thanks!
0
Lut Ze
another question: is there a simple way to prevent an image sublayer to scale, when scaling its parent layer?
6
Marcos Navarro
It probably has been asked before, and even more probably it's not possible. But I'm asking anyway: Is there a way to use the camera for your prototype? Showing it at least or even taking pictures with it?
3

February 11

Jason Ogle
Would love to see a solution for multi-line commenting out code in future update.
4
Harshad Kulkarni
Can someone help? The background image is getting stretched screenwidth = 640 systembar = new Layer( { width:screenwidth height:40 image:"images/statusbar.png"} )
5
孟龙
Hi,are there any examples about drawing something with html canvas in framer studio?
1
Harshad Kulkarni
is there a way to have different values for left padding textarea.style = color:'#666' fontSize:'16px' padding:'24px'
3
Артем Турчик
While mastering Framerjs I came up with an app concept that can help you to choose a random movie if you have no idea what to watch in the weekend eve)
4
Cristian Constantin Olarasu
Hi, any news on the PS generator app for windows?
2
Jérémy Jones
Hi guys, it's me again :) I would like to know if somebody can tell me why I can't get the right height and width? What's wrong in my code? Thanks!
5
Ashley Einspahr
Hi Framer community! Quick question. Most Framer examples are a single feature with just a few key interactions. Has anybody tried using Framer to build out a more complex prototype with a few different pages that you can interact with? Or is that not optimal in Framer at this point? I'm designing an app that I plan on user testing, and it'd be cool if they could interact with it all at once... rather than me opening up a new prototype for each page in the app. I've played with this a little, but my code gets kind of gross. Not sure if there are some best practices.
20
Kevin Cannon
Hey All - Simple question for ya, how do I manually insert images into a framer file? I want to import an animated gif I've created in another program.
4
Joshua Tucker
Hello all! Is there any way to change an animation's properties after declaration? I have tried all sorts of reading and wizardry without luck! Say: animation1 = new Animation ({ layer: layer properties: {scale: 1} }) Later in my code, I'd like to change animation1's scale to something different.
6
Matt Wujek
Finished up a prototype for my favorite startup in San Francisco, Scoot Networks. http://share.framerjs.com/3oagnvitw0hn/
7
Rémy Saddour
Hello, I am trying to create a prototype with the video through the element "new VideoLayer" my prototype runs on FramerStudio well as desktop browser, but as soon as I displayed on a tablet browser, the video won't work... Someone would have a solution? Thanks
5
Burak Esen
Hey guys, short question again. Is there a simple way to make everything in a layer not triggering an event while a animation is going on? like muting all .on Click events till the animation is finished.
3
Kjelle Vergauwe
Has anyone encountered the device scale problem on an Android device (Nexus 5 with Android L)? When you access a prototype using mirror on a Nexus 5 it's exactly as it should be. But when you add it to the homescreen, the scale is all messed up (twice the width). Is this a framer issue or an Android issue?
1

February 12

Noah Levin
Anyone have any examples using a circular mask? It keeps getting clipped to the rectangular frame bounds. I've tried hacking it with border radius, but it still gets clipped to a rectangle. Is this possible? I'm probably missing something obvious..
8
Junhyuk Jang
I made circle draw animation, but this is not actually draw circle. I use some layers that cover circle layer, and rotate cover layers to show the circle. I think there's another way to draw circle. Any solutions?
4
Junhyuk Jang
Quick question. Can I register another copy using the same license? I want to use two copies (office & home) I think, I must 'unregister' to use another copy, right? Thanks.
3
German Bauer
Does anybody know of a PDF version of the Framer API documentation? Would love to have this side by side the old fashion (printed) way...
1
Rhys Merritt
Hi Urryone! Total Framer noob here, and I've just finished making a mess of my first prototype :) I have two issues now that I would love to ask if anyone can help me solve; 1.) I can't seem to share, or mirror this prototype.. It seems to just be blank when I share (which seems problematic when trying to share it here in this post!) 2.) I have created the interaction I like, but am stuck when it comes to allowing the interaction to do the reverse once the user clicks / taps the 'Hotels' layer after it has animated. Download - http://share.framerjs.com/33u7cm9mik40/ Any help whatsoever would be greatly appreciated.. I hope I can return the favour in time and help others in the framer community!
9
Arvi Raquel-Santos
Attempting to do a drag on the X-axis. I have 4 cards but as you can see, once I start dragging, the second card is getting cropped out. Does anyone know what I'm doing wrong here?
15
Chris Camargo
Can someone tell me how I would set the style of a tapped layers' subLayer?
1
Koen Bok
Please welcome our newest engineer Jonas Treub. That we may move even faster...
7
Jon Knoland Blair
I have three layers (sComments, sButtons, sFrame) that I want to move when I drag sHeader. I only want sHeader to be draggable, but I want the whole frame to move, like a grabber in android. How do I do this?
4

February 13

Alexander Artsvuni
Question: if layer has 3 animation states set, is it possible to set layer.states.animationOptions individually for each of the states? So far it seems that its a global setting for the layer. Im new to framer and programming, so apologise if the question is not valid ))
6
Trevor Phillippi
Hey, I was wondering if people had a good approach for managing Drag and Click events on the same layer? I'm working on a pretty common use case, where in a TableView, TableViewCells can be slid (DragX) to take/reveal actions. But if those TableViewCells are clicked/touched while not being dragged, I want to go to the detail view. I have the Cell snapping back to it's position on DragEnd, but this seems to trigger Click. I feel like this must be a common enough use case so I'm curious how the people handle Click/Drag events on layers. Below is short video illustrating the issue.
12
Chad Lonberger
How does one remove a prototype that was pushed to share.framerjs.com via the share button? Thanks in advance.
2
Joshua Tucker
Working on a really fun project that's required some rather unique code. Thought I'd share one piece of it! Simulate typing inside of an input field – I based my code off a JSFiddle example (which I included a link at the top of my file). Once this project is finished, I will gladly share it. Look Ma, no hands!
2
Bryan Clark
Is there a way to specify an animation curve for a particular state? For example, something like this: animateInCurve = "spring(400,30,0)" animateOutCurve = "spring(350,35,0)" myLayer.states.add hidden: {y: screenHeight, curve:animateOutCurve} visible: {y: shadeOffset, curve:animateInCurve}
6
Alexander Artsvuni
another noob question: is there a way to do this with 1 line of code: layerA.opacity = whatever; layerA.y = whatever; layerA.scale = whatever;
3
Stefanie Hyde
Hey all! Framer noobie over here, looking for some input. So im currently working on a mini prototype and have gotten three of the layers to drag and snap to the location that I want. Is there any way to make these three layers to also drag and snap to a second spot after the first action? This may have been worded confusingly.. haha. Let me know if you need clarification. Any help is greatly appreciated!
6
Peter Hilgersom
hi guys, I'm having a silly issue. How do I animate from the middle of a layer? This is my framer. When you click on the striped icon the background circle animates in size. but it's not coming from middle. I tired originX = layer.midX and originY = layer.midY but that didnt do it ^_^
4
Giovanni Caruso
Did some quick exercise with Utils.modulate to recreate Twitter scrolling title (iOS). Just wondering how the scroll feeds behind the tab since I already have a scrolling layer. Any hint?
3
Rhys Merritt
I have a new question! Been stuck on all morning. I have created a Super layer and am attempting to restrict the layer from being initially dragged downwards the way a regular app would restrict a user from scrolling beyond the available content. Additionally, I would like to restrict the layer from scrolling upwards past total height of the layer. Are there options for restricting the draggable layer beyond certain values? DL - http://share.framerjs.com/q366tbstskz0/
4

February 14

Arvi Raquel-Santos
Anyone have problems with Sketch imports? Sometimes when I reimport a file, everything disappears in Framer.
5
Koen Bok
Announcing Framer Sharing Today's update brings a new sharing feature. You can now share your project with other designers, your team or the entire internet with just one click.
42
Josh Ackerman
Hello, I created a radial menu in FramerJS. To finalize it I am wondering two things: how to make an event handler for right click, and how to get a layer to track the cursor. Thank you. Edit: Just incase the .gif does not work: http://drbl.in/njQt
4
Cyrus Cheng
how can i add a conditions to a layer.on Events.click,->... I mean layer.on Events.click can do only under one conditions is true?
4

February 15

Abdou Ghr
Hi Framers, anyone who can help to avoid the blurred text anomaly when using 'Nexus-5' device? Thanks a lot.
3
Cyrus Cheng
Does have anyway to draw a Bézier curve in framer? Any references can be recommend?
4
Joshua Tucker
Anyone worked with adding DOM elements to Framer layers and styling with CSS? I am trying to consolidate code by doing this: layerElement.document.createElement("input") layerElement.style = { "height": "#{layerElement.height}px" "width": "#{layerElement.width}px" ... } However, this won't take. It will take however like this: layerElement.document.createElement("input") layerElement.style["height" = "#{layerElement.height}px" layerElement.style["width"] = "#{layerElement.height}px" ... Thoughts? Thanks!
2
Fran Pérez
Hi guys, I put together a quick prototype for adding inertia when dragging a layer. Trying to simulate natural scrolling. I hope it's useful :) http://share.framerjs.com/m912bld6vjqn/ (Tweak the values to adjust it to your own needs)
2
Joseph Reni
So it seems like when I import from sketch (1280/800) things become a bit blurry including text - so I tried to double the resolution(2560/1600), but then framer can't scale it back to 1280/800. any suggestions here?
3

February 16

Koen Bok
#ProInfo: ever heard about garbage collectors causing stuttery animations and wondered what it meant? The garbage collector is a mechanism to manage your programs memory so it returns it after you used it to store values. That way you don't have to manage it yourself. In order to see if the memory can be claimed back, it needs to stop everything for a small moment. These pauses also stop animation, causing dropped frames, or stutters. You can see the effect here (try different browsers): http://v8.googlecode.com/svn/branches/bleeding_edge/benchmarks/spinning-balls/index.html Luckily browsers have gotten really smart about this so if you don't create huge amounts of objects that you then dispose (like the example above does) you are not likely to run into this.
1
Brent Bonet
I have a bunch of layers that are basically list items. Imported from Photoshop. Each item is a group. I can get a click when I use offersLayers.item1.on EventsClick etc, but I'll like to loop to add the click listener as so offersLayers = Framer.Importer.load "imported/offers" for k, v of offersLayers v.on Events.Click, -> onOfferSelected(event, layer) onOfferSelected = (event, layer) -> print layer.name When I do this I get ReferenceError: Can't find variable: layer. Is there not a way to do this?
2
Jörg Linder
I'm having problems when importing from Sketch: It always leads to incorrect sizes (see attached screens). I've created an iPhone 6 artboard in Sketch, and I'm using the iPhone 6 viewer in Framer Studio, so this should work together nicely ...? Could it be related to an incorrect setting? Using Sketch Beta 3.3 and Framer Studio 10.10.1, btw.
2
Matt Bogado
I have different artboards in a .sketch file and each artboard has a bottom navbar. In order to have unique names for each layer, I named each icon in the bottom navbar like 'inbox1' in the first artboard, then 'inbox2' in the second artboard, etc. What would be the best (and quickest way to enable tap on all nav elements? I think I need to write the action for each icon in each artboard and that is very time consuming. Any suggestions will be very appreciated. Thank you!
12
Benjamin Den Boer
We've just released a small update to Framer Studio. This release fixes small text-editor bugs and also improves syntax highlighting and overall performance. All new projects also include an updated template which automatically scales your prototype based on the device your viewing it on. This is incredibly helpful when previewing projects on devices with varying resolutions, such as Android mobile devices and tablets. http://framerjs.tumblr.com
4
Jarne Uytersprot
Hey guys! I'm pretty new to this and very excited to start building Prototypes. I was wondering how you animate the backgroundColor of a layer? Why is it not supported? (just curious)
14
Emilie Park
Hey guys, I'm prototyping a native app and stuck in navigation. aPages =[ title:"Activity" view: Sketch["activity_page"] , title:"Community" view: Sketch["community_page"] , title:"Cotribute" view: Sketch["contribute_page"] , title:"Profile" view: Sketch["profile_page"] ] all the view objects in the array is invisible atm, how can I set them visible? Do I make sense?
2
Alexander Artsvuni
Dear Framer pros, Is it possible to create a layer that looks like this in framer? (without importing this shape/layer from sketch) Is there anything like: layer.TopRadius = 80 Thanks!
9
Mehdi Djabri
Hi guys, when I just use "spring" without defining any options, what are the default values used by Framer JS?
3

February 17

Junyuan Qi
I just made a navigation bar concept using Framer and loved it=) The idea was to hide the labels of tabs so it looks better and show them on touching so users won't be confused. BTW, I had a problem with importing layers from Sketch. There's a cross agent error when requesting imported images. Has anyone came across the same problem?
8
Pedro Carmo
Has anyone built a replica of the mobile Safari selector? I’m using it for a project but currently cheating by using a screenshot as a quick fix to complete the step in the flow.. Curious if someone has already tackled this problem of building iOS interaction templates..
2
Sanjay Raval
Can someone help me understand how to apply swipe gesture. In my prototype, user should be able to move next and previous screens using swipe on a screen.
0
Kjelle Vergauwe
I'm having some difficulties with the ignoreEvents property Layer A has a sublayer Layer B Both have a click handler. Clicking Layer B shows a popup ( Layer C) Clicking Layer A hides the popup ( Layer C) But each time I click Layer B it also triggers the click from Layer A. If I set Layer A's ignoreEvents property to true in the click handler, it still runs the code in the click handler of Layer A. Which results into showing and hiding the popup instantly. Am I missing something? Going crazy about this problem.
3
Fredrik Søgaard
Getting this error when importing from Sketch: "Cross origin requests are only supported for HTTP." Any idea why? I'm in the newest Framer Studio and Sketch 3.2.2
0
Amit Das
Quick question: Anyone has some FramerJS Discount Code? Please? :)
9
Jared Palmer
One of the most annoying things about Instagram is the inability to switch accounts (like you can with Twitter). Here's a prototype for how it might work... In practice, tapping the username (not the profile pic) should probably trigger the account switching interaction since it isn't being used for anything at the moment. Instagram Make it happen.
21
Michael Dorian Bach
Can someone help me understand what's the difference between a Framer Layer and a Framer View? I've seen the use of views in a few examples. Also, when importing from Sketch, does the resulting layers in framers automatically get attached to one root uber SuperLayer or is everything just a a stack of root level layers?
2
Comést Savatino
How would one make the background color of an input text box transparent?
1
Thomas Veit
Hey Guys! Are there any snippets for Click, Touch or TouchMove animations? I want to record my iPhone Screen with QuickTime and show where I've clicked, swiped etc...
5
Matt Bogado
I'm having issues with a framer file. I'm working in a complex file and all of a sudden I'm getting these messages in the console log. I closed the file and reopened, but still getting the same error. Any ideas on how to solve this?
8

February 18

Koen Bok
If you are just beginning or want to brush up your Framer skills you might be interested in this course by Jay Stakelon / Frontend Masters.
2
Zachary Russell Heineman
Are there known mobile Safari issues documented somewhere? I have semi-transparent layers animating over the top of an image that are slow on iOS (iPhone 6 Plus) but not on Android (Nexus 5).
1
Arvi Raquel-Santos
Anyone have any good examples of how to enable vertical dragging of a card while keeping the horizontal swipes intact? I'm looking to horizontally swipe to view cards and vertically drag a card to the bottom to save to view later. This is where I am at the moment but haven't been able to figure out how to grab a card since all the cards are in a SuperLayer— http://share.framerjs.com/n6v3ueib2o6r/
5
Koen Bok
Just did a bunch of updates to the share server. Zip downloads and general serving should be quite a bit faster now. Let me know if you see issues.
1
Trevor Phillippi
I'm curious how others handle capturing/archiving iterations. I don't want to have tons of duplicate .framer folders, but I want to be able to capture iterations to be able to show how my ideas have progressed/evolved. My instinct is just to use Quicktime and record video of every iteration I want to be able to recall–this is cleaner but kind of restricting in that the video is all you have long term. I'm encountering this because as I actually see something and interact with it, I realize all of the problems that exist and then start to head in a new direction. But that artifact is important for me to have for my own uses, as well as to show my professors and put in my portfolio to illustrate how I arrived at my eventual solution.
6
Jérémy Jones
Hi again, I don't understand why my state animation doesn't work properly I have this: box.states.add one: {backgroundColor: "green", scale: 1.1} circle.on Events.Click, -> box.states.next("one", "default") Everything is fine but I don't understand why the BackgroundColor wait the end of the animation to change his color. Check the video I uploaded. http://cl.ly/0v3d1I351i3I And thanks again!
6
Jérémy Jones
Hey guys, I have a class inside my style.css (FramerJs folder project). I will like to apply a different class from this style.css when I "Events.Click". I'm trying to do this but it didn't work. Any hints? Thanks
9
Vaibhav Kanwal
Hi! I experience flicker and jitter in Framer Studio from time to time, I am running on OS X 10.10.2 on a Macbook Pro 15" Retina. This happens often and feels annoying. Is this just me or has anyone else experience this bug also?
0
Koen Bok
To fully focus on Framer, we made Cactus and Glueprint for Mac completely free as of today. Enjoy! http://cactusformac.com/blog/ http://cactusformac.com/ http://glueprintapp.com/
9
Drew Stock
When I open this project on iPhone 6 it's saying that device width is 980 and height is 1744. Anyone else with iPhone 6 get the same (I've set it up so that it should print your device width and height)? In Framer Studio I get correct values of width 750 and height 1334. Any ideas why this might be happening? Thanks.
2
FX Fuhrmann
Hi. I have a question regarding the rendering on Safari mobile. Usually when you scroll a page with Safari, the tap and bottom bar shrink. However when I open the link with my shared Framer, it doesn't react. How can I fix that ? Thank you very much!
4
Zachary Russell Heineman
What is the proper way to load external scripts in Framer Studio?
9
Matt Wujek
Ugh. Can't figure this out. How to you stop and interval from running? ( Utils.interval 4.0, -> )
4
Paresh Ravi
hey guys, Im trying to learn Framer JS. How to I get a layer to centered on the screen. Here is my code: layerB = new Layer backgroundColor:"#2DD7AA", width:60, height:60, layerB.center() I cant get the layer positioned in the center. I keep getting "undefined is not an object error
3
Tarun Chakravorty
Is there an easy way / hack to scale a prototype made for the iphone 5 device frame, so that it fits the iphone 6 device frame?
4

February 19

Zachary Russell Heineman
What's the best-practice way to keep a sub-layer dynamically sized to match its super layer (ie. image inside a container)?
2
Matt Wujek
This may be a trivial matter, but it's really bothering me. On my monitor, the text selection contrast is so low that I can hardly even see what I've selected. Is there anyway I can edit my IDE settings? Koen Benjamin
2
Joe Lifrieri
Hello! Can I delete or remove a project I've shared via Framer?
11
Mike Kotsch
Is there a way to import shapes from Sketch and have them parsed as vector shapes (and text) in Framer?
2
Aman Virk
Is there any way to have auto width on layer's and also something equivalent to text overflow ellipsis. It would be handy for having tag system , where layer width will differ depending upon text size.
0
Koen Bok
We just shipped Framer Studio 1.10. Many improvements to the editor, better syntax highlighting and added iPhone 6+ and many Apple Watch devices. http://framerjs.tumblr.com/post/110641414997/editor-and-devices
14
Ash Baker
hello, can anyone tell me, if i can connect two layers, or group them, so that when i drag one of them it moves the second one, i'm a developer by definition, but i'm doing my first stesp in framerjs, which i think is pretty usefull and how to change from iphone to ipad or apple watch prototype? thanks
3
Ryhan Hassan
A simple wave
4
Paresh Ravi
Is it possible to create Interactions for multiple screens using Framer studio.
4
Josh Ackerman
For anyone who is interested, I have made a working clock in Framer.js. Download or play with it here: http://bit.ly/1E2MoZB
0

February 20

Zachary Russell Heineman
Is it possible to 'ignoreEvents' for specific events? I have a 'Click' and a 'DragEnd' listener on a given layer, and they both fire on the click and are messing up my logic.
6
Zachary Russell Heineman
Anyone have experience loading a Framer Studio project into Cordova?...
0
Matthew Jones
Anyone out there mostly cut Sketch out of their prototyping? Any tips and tricks to share for a pure-code approach?
11
Ash Baker
hey guys, thanks for yesterday's help, now i have another question though.. i try to do a preview of my prototype on my iphone 4S, and the prototype is set for iphone 6. i tried to do the preview with the usb cable with sharing connection and also with both the mac and the phone on the same network, but the result is the same : - on iphone : white page only - on ipad: it finds the project , then when i click to see, it shows another white page. i tried with the ip adress provided but, safari can't load it (on mobile devices), but on my computer all ok. i downloaded the framer link app for both , and that's how i got the white pages, otherwise i wouldn't get anything thanks in advance
0
Danny White
Feature request: ability to update, edit, & remove shared Framer links. Something similar was posted the other day. It would be great if there was some sort of web login where all this could be managed. Axure's flow for this is attached. Don't like their product, but their sharing is done pretty well
5
Jay Stakelon
Frameristos: the latest update to the Frameless iOS browser is in the App Store and ready to go! Bug fixes and the ability to automatically connect to Framer Studio if you're running it. Thanks to everyone who inspired with the Bonjour connectivity work and the folks who helped beta test. https://itunes.apple.com/us/app/frameless-full-screen-web/id933580264
13
Christian Johansson
Hey, thanks for a great prototyping tool. Here's a question Is there any way to get position: "fixed" to work? I want a navbar to stay fixed at the bottom as I scroll the page. I have had no luck with this sofar
1
Minh Thang Pham
Hi, could you please tell me how to do swipe back like the one in the iOS? There is a similiar solution in the framerJs examples (http://framer.com/examples/preview/#ios-lockscreen.framer). User can swipe to the both sides, but I want the user to swipe only to the right. Thanks for help!
0
Mike Stężycki
Hey all, dumb syntax question: Is there a way of rounding individual corners with the borderRadius line? Something like: layerA.borderRadius = "0,0,4,4" ? PS. I love how active the Framer community is, great stuff!
2
Natalia Breadbasket
I have a following problem. I have an element in my prototype that is positioned some distance from the. I need for this element to stick to the top of the device screen when I scroll down. This means that I need to figure out 2 things: 1. How to find out when my prototype has been scrolled to a certain position in comparison to the screen. 2. How to make the menu stick to the top of the screen. Any ideas? The element that I'd like to stick to the top on scrolling down is the one with white bg below hero image.
2
Vaibhav Kanwal
How do I convert value of variable - getLayer to be treated as an object? I want to change states on the objects which are obtained as per position of touch coordinates. Any ideas?
2
Jérémy Jones
Hey guys, how do you handle an infinite loop animation? I'm trying to create a chrono with a start and stop button.
12
Ash Baker
hey guys, thanks for yesterday's help, now i have another question though.. i try to do a preview of my prototype on my iphone 4S, and the prototype is set for iphone 6. i tried to do the preview with the usb cable with sharing connection and also with both the mac and the phone on the same network, but the result is the same : - on iphone : white page only - on ipad: it finds the project , then when i click to see, it shows another white page. i tried with the ip adress provided but, safari can't load it (on mobile devices), but on my computer all ok. i downloaded the framer link app for both , and that's how i got the white pages, otherwise i wouldn't get anything thanks in advance
0
Jérémy Jones
Hi everybody, do you know how I can change the font-family? I would like to use HelveticaNeue-Ultra-Light.
7
Edward Sanchez
Is there a way to create an animation sequence like On LayerA Move x to 200 in 1 second then set opacity to 0 then move x to 100 then wait 1 second then set opacity to 1 ? I tried animation chaining with AnimationEnd but when chaining on the same layer it seems to only work with a single chain, the subsequence animations happen at the same time. Thanks!
6

February 21

Mehdi Djabri
Hi guys, my prototypes don't seem to work as well as in the studio when I share them using the share feature (I'm using chrome). Are there any known issues or is there something I'm missing (maybe the way I write my code)?
4
Mehdi Djabri
Hey guys, most of the time I find myself listening to events only once, what do you think about adding a "once" method in events? Instead of having to write something like: onSomeEvent = -> someLayer.off Events.SomeEvent # do something someLayer.on Events.SomeEvent, onSomeEvent
3
Brandon Souba
Is it possible to animate layer.backgroundColor?
6
Min-Sang Choi
Hi guys. I decided to make carousel with framer for teaching myself this tool. and here's what I made since. hope you enjoy. :-)
22
Javier Díaz
Hi! I'm running into one of those weird situations. I have a layer with a TouchEnd event. The event fires both in desktop and Android: -In desktop everything works as expected. -In Android (Nexus5 running Framer on Lollipop ) the TouchEnd event exists as an object, but if I try to access the properties (for example x). The result is 'Undefined' Anyone ran into this before?
3

February 22

Joseph Reni
is framer not working with sketch 3.3? keep getting this error on import "The import failed. Sorry. Please check Console.app for errors."
3
Rob Silverii
Is anyone having issues mirroring for the iPhone6 plus in 1.10.22? The viewport isn't rendering to the entire size of the device for me.
12
David Lee
Is there an equivalent grammar in coffeescript like below? < !variable > var toggle = false; if condition { !toggle; }
6
Fran Pérez
Shouldn't this work? toggler = Utils.cycle(-> print "a", -> print "b", -> print "c") toggler() // "a" toggler() // "b" toggler() // "c"
4
Luka Marčec
I edited Apple Watch example from Framer website and created this. It's a navigation part of the app for Rimac Concep_One, you can speak to it (McDonald's) and it would instantly show you the nearest location you're searching for. Nothing new, just playing with it. :)
3

February 23

Trevor Phillippi
Anyone have any experience working with audio in Framer? Video is easy enough but it doesn't look like there is anything out of the box for doing simple sound effects.
1
Mike Kotsch
Can I (for some weird prototyping) add an iFrame to a Framer project?
2
Andrzej Słupski
Hey, is there any site collecting code snippets for framer.js?
1
Alex Yakir
Is there a way to save as from framer studio with the device image? Also, does the sharable link stays permanent? Thanks!
8
Joe Lifrieri
Is there a good way to translate and scale an object simultaneously? I'm trying to move an object across the screen but the scale animation screws up the coordinates. Is there a good way to compensate for this?
11
Ivan Cruz
Is there a way to have all elements of an artboard animate in staggered one after the other with a for loop? I am going to start prototyping a walkthrough and the animation for in/out would be the same for all elements.
0

February 24

Ces Cortez
Put together an intro for adding Firebase to a Framer prototype: http://designsprints.com/framer-screencast-firebase/ Jay Stakelon shared a great DN prototype earlier this month using Firebase to track upvotes. I wanted to highlight Firebase's realtime syncing by showing a layer's state and state switches synced across devices.
15
Wasil AR
Hello guys, Wanna ask something might be a bit silly, but I cant find any. Im using sketch & framer together, import it and seems framer detect each element as an image (?). I want to edit css property of each element. Such change the text color using the syntax (pic) but it wont work. The "backgroundColor" works well, but "color" does not. Did I miss something? Thanks!
2
Koen Bok
Haven't extensively tested this. But if you need to convert spring inputs (tension, friction) between Framer, Quartz Composer, POP and Rebound you can find the formula here. I'll integrate it in a future version of Framer so that you can select "curve: 'spring-qc'" for your animations. https://gist.github.com/koenbok/e9a0f7d763ac28eda880
2
Johannes Eckert
may be that I forgot the trick … but In the inspector of Framer Studio, I am expecting to check the value of any object in the framer space. Is that still possible? such as in the demo, seeing what iconLayer.y is about, I always get a reference error / can't find variable iconLayer
3
Matt Bogado
I recreated "connected" from LinkedIn. Stephen Crowley helped me with the parameters for the events. Stephen also recommended to use Utils but I still don't get the concept of Utils. How would you use Utils in these events?
1
Matt Wujek
I did some more work a carousel for a project at work. Each carousel can be customized via object properties. I know the code is a bit lengthy, but I've only been coding for about a year, so please let me know if I'm going about this the wrong way. Anyways, hope some of you can use it on your next project! http://share.framerjs.com/cgcfi6o2cid4/
5
Jason Valenti
Loving this software. Last nights hack on rethinking the create a new Tweet function on Android. :
0
Koen Bok
Hey guys, if you are into quartz/visual programming you should check out the latest Origami update by Brandon, Drew et al. Tons of cool new stuff.
2

February 25

Christian Poschmann
Since the last update I can't seem to use ### to comment out code blocks. Anyone having the same issue?
8
Stephen Crowley
So uhh, yeah- I flaked and posted something completely unrelated to Framer or design- being the super awesome community that you are no one Frank Underwood'd me for it. Sorry about that! Anyway- here is a small exploration of custom vs native notifications. We went with a custom notification but I tightened up the look, animation, action buttons/verbiage etc. in the final release.
2
Gavin McFarland
I've noticed recently I'm experiencing quite a few bugs with Framer Studio that make it relatively difficult to work with. Is anyone aware of these issues? - Changing from landscape to portrait causes issues with the resolution of the prototype causing it to be bigger than the device. - Framer Studio causes my monitor to flicker and the screen sometimes shifts across to the right - The preview pane is very jittery and slow and the only way to preview the animations properly is by sharing it and previewing it in the browser - Sometimes images don't update when using the mirror feature when saving the prototype (even after closing the browser on the device and opening the URL again) - When you're previewing the prototype in Framer Studio using a device template and then mirror it to a device you have to change the viewer to full screen but then you can't see the prototype properly on your desktop. Otherwise I enjoy my time with Framer, but recently these problems have prevented me from using Framer.
3
Giovanni Caruso
...have you already heard about this feature?
6
Emilie Park
Hi, I accidentally clicked share button in my prototype, can I undo it ? I should not share the prototype...
10
Tanner Christensen
I must be thinking about this in the wrong way and could use some help. I have a number of layers which will need to be switched between two states on click: visible and hidden (with opacity at 1 and 0 respectively). Because I will want these states to be actively switched, I'm setting the layers in Sketch to be visible at-start (since Framer seems to have issues with hidden layers from Sketch) and then using states.switchInstant to hide the layers. My problem is that when I click on the object and it changes states, there's a slight flickering effect. What's the best way to approach situations like this?
3

February 26

Ivan Cruz
Is there a way to preview iPhone 6 prototypes on an iPhone 5s? I tried this prototype -http://share.framerjs.com/9890bhx8ccq8/ - without luck, thoughts? Sorry if it's a simple question, day 1 with FramerJS :)
15
Christian Poschmann
My latest experiment of a Filter feature. would love to hear your thoughts on it. Cheers.
7
Koen Bok
This great tool to convert coffeescript to javascript (and vice versa) just got an update.
1
Jérémy Jones
Hi guys! How do you put a default background quickly? (instead of the black one) Thanks!!
2
Jorn van Dijk
The best way to experience a mobile prototype, is on an actual device. Inspired by Jay Stakelon's excellent Frameless for iOS, we’re excited to launch Framer for Android. A distraction free, full-screen viewer for all of your prototypes. Connect your mobile device and Mac to the same Wi-Fi network. With Framer Studio open, your prototypes are recognised over Bonjour and immediately show up. Control your prototype with gestures to reload, navigate back and forth and show or hide the chrome. We think this makes building prototypes for Android a lot better. Download the app today from Google Play, it’s free. Google Play: http://goo.gl/xz0pU5 ––– More info on the blog: http://goo.gl/7ciOp4 And the updated section on the site: http://framer.com/learn/preview/ Thanks to Benjamin and Jean for working on this!
30
Brendan Hastings
Is it possible to revoke a shared URL so it is no longer publicly accessible?
4
Antonio A. Asevedo
New to JS as well as Framer. How do I slide one layer (an image) over another as the user goes from page to page? I see this on "Learn": layerA.on Events.Click, -> And this on "Docs": layerA = new Layer() layerA.on Events.Click, (event, layer) -> myTouchEvent = Events.touchEvent(event) Is it something like this: layerA.animate properties: {x:0, y:0} curve: "linear" repeat: 0 delay: .5 time: 0.3 I am struggling with the syntax. Any help is appreciated!
3
Dane Burkland
Hi All - experimenting with some height/weight input screens. Any thoughts would be great. Cheers
1

February 27

Luis Ricardo La Torre
What is the best way to embed your Framer projects to your websites/portfolios/blogs?
2
Ke Wang
Maybe It's a dumb question, but I'm having a hard time getting out of the brackets and quotes. For example, if you type the single "[", the studio will auto complete the "]", but once you finish typing the stuff inside, is there a easier way to get out of the bracket instead of hitting the right arrow? It makes my hand travels a lot. Thanks!
12
Zachary Russell Heineman
Is there a best-practice way to break up a Framer Studio project into multiple files to keep code organized (and each file a manageable length)?
2
Johnny Chen
Does anyone know why it may take a long time to load a Framer prototype from the http://share.framerjs... URL's? One of my projects takes 8 seconds to load, showing a white screen the entire time. The entire project is 5MB.
0
Ke Wang
Anybody played with Processing before? It'll be awesome if Framer Studio could implement some similar function of this mode: http://galsasson.com/tweakmode/ What do you guys think?
4
Don Polistico
Is there any way to disable the 'Share' feature? Framer is a very useful tool, but the project we're working on is top secret and we'd like to avoid any instance of our project being leaked out to the public.
2

February 28

Ke Wang
Hey all, I have a problem. In my prototype, the layer.z seems to perform differently in Chrome and Safari. Here's the link: http://share.framerjs.com/vga8yyowrkfe/ Basically I want to flip a card and reveal what's on the back side(Blue). The way I do it is by modifying the backside layer's "z", but it seems it only works in Safari. Is there a workaround ? Thanks!
2
Jérémy Jones
When I'm scaling my lawyer, the edges are a little bit blurry, is that normal? I uploaded a video. http://cl.ly/0j0C0N2e043Z
11

Monthly archives

2017

2016

2015

2014

2013