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

What is Framer? Join the Community
Return to index

July 2016

July 01

Mike Kotsch
I made a master vs. slave volume control. The premise is the following: I have three individual audio sources, which I can adjust independently. In addition, there is a master control, that overrides the slave controls – defining their maximum and minimum. Does the concept work for you?
6
Marc Krenn
tracking.js allows for color-, feature- and face-tracking on static images, videos or webcam streams. Here's a simple color tracking example which should help you getting started: http://share.framerjs.com/8uungnvqries/ (please excuse the rather obscure example :P )
3
Derek Kapa
Is there a way to change the default interaction cursor (the orb) to a regular mouse cursor?
4
Márcio Ribeiro
hey framers, how can i listen the wheel direction inside an onMouseWheel event? it seems scroll.direction doesn't work with mouseWheelEnabled Thanks again!
1
Jon Arnold
Thank you Josh Puckett for this: Create Classes for reusable elements like buttons https://twitter.com/joshpuckett/status/748650798586859520 #timesaver I created a snipped for this. Enjoy
1
Jiaxin Chen
I hope one project can have many tabs in it. So that I can compare my prototypes very quickly, and don't need to duplicate project. This is very hard to manage.
2
Hugo des Gayets
Hello Experts! Quick question about PageComponent: I have pages, each one has an object that starts animating infinitely when "page.currentPage == intendedPage". Everything works well, but once you’re done swiping every pages, every object are now animating in an unstoppable loop :( Is there a way to stop animating on every "page.change"? Objects would restart animating only when page.currentPage == intendedPage. Thanks!
5
Jiaxin Chen
Hey Framers, How can we get the time interval value between twice events?
4
Junhyuk Jang
mix blend mode experiment just for fun :) Is there any parts that can be use this interaction ?? http://share.framerjs.com/tr2kfw8r5wom/
2
Jiaxin Chen
It seems like there's a bug about audio in the latest version. When I click fast the sound will weaken and die away.
1
Edward Sanchez
Has anyone successfully wrapped a Framer prototype into an Xcode app? I can do it but then it tells me about local file restrictions on the browser. I do "try anyway" and it seems to run, but my Framer as a MOV and then the mov goes full screen overtaking the app and the app crashes. Another issue is that when I load my prototypes in apps like Frame and Frameless, my video appears gray while it's being dragged into view. Maybe it's a caching issue that wouldn't happen if I could load the video through a wrapper app. Koen Bok I imagine it would be fairly simple for you to make a wrapper app and provide as a resource. Would be great for demoing your prototypes anywhere, and switch between them as easily as switching apps. Thanks!
6
Lachezar Petkov Petkov
Hello. I am new to coding/FramerJS, please forgive me if the question is silly. I am designing a simple rating dialog where I want to draw five stars - the user would tap on them, they will animate, an image would show up depending on which star is pressed, etc. So far I have: for i in [1..5] star = new Layer image: "img/star-inactive" width: 89, height: 87, x: 180 * i, y: 20 stars.push(star) Now I want to kind of work with each star individually, set events, animate it. I tried to select a star from the array, but to no avail: stars[0].on Events.Click, -> Is this the right approach? What am I missing? Thanks a lot!
2
Jeff Lin
Hi Framers, Can anyone shoot me an invite to Dribbble? I would really appreciate it! :) Dribbble account : dribbble.com/yenhunglin My works: behance.net/yenhunglin
9
Carlos David
Hi guys, I'm looking for a Dribbble invitation, here is my portfolio http://carlos.mestizen.com/. I'm a Product Designer and I hope that someone liked my work and send me an invitation ;). In any case have a nice day guys! here is my Dribble account https://dribbble.com/cd_mestizen
1

July 02

Amrit Mazumder
Question about jQuery and Framer: Can I use jQuery to listen for events within Framer? Can I use jQuery at all within Framer? — I'm trying get a click event from a HTML element with a specific class. I'm trying to use jQuery to listen to this click, and I'm not sure which part of my approach is not working. I know there are better, more Framer-y ways to do this. I'm trying to use jQuery and classes so it can neatly connect with another project of mine. Any help at all is really appreciated, and I'm happy to explain more (at 2% battery now!) http://share.framerjs.com/c56gexkbz1y3/
1

July 03

Unbong Kang
hello! everyone :) this prototype is my first framerjs project. > Facebook Paper app - Fold interaction recently framerjs seem hot prototyping tool. code is still not perfect. But it was fun. See you again. Good day~ Share : http://share.framerjs.com/ujodgn8qtw72/ Tutorial : http://lain.kr/framerjs/facebook-paper-fold-interaction/ Dribbble : https://dribbble.com/shots/2806340-Paper-Fold-Interaction-by-Framerjs
9
Fran Pérez
How do you guys call an animation (layer.animate) from within an event that is constantly firing, but just once, when certain condition is met for the first time? I've noticed that when you call an animation repeatedly it behaves oddly :(
7
Marc Krenn
The 'colorThief' module allows you to easily extract the dominant color(s) of images. Example (incl. module): https://tr.im/colorThief
6
Min Shin
Hello everyone! Happy to share my first work in this group😊 I’ve practiced to make a vertical video navigation prototype referring to pry app. Hope you guys enjoy it 😄 http://share.framerjs.com/6xdh3ewx2fg3/
1
Daniel Maniés
Today I just played around with the MIDI component and this came out: http://share.framerjs.com/p4puenw1tyl7/ It's a visualization of pressing the keys on my MIDI keyboard. For every key a bubble appears and moves to the top. To keep it performant I destroy every single bubble after the animation. To try it out with music just open Garageband, choose an instrument and keep it in the background. And sometimes multiple bubbles per key appear, in this case just reload the prototype. I hope you like it :)
1

July 04

Jai Mitchell
Random question: Is anyone here from Brisbane, Australia (or nearby) who considers themselves to be pretty solid with Framer? I'm looking for a Framer rep for a panel on prototyping methods/tools at an event we're holding here next week ;)
0
Joelle Peters
Very new to Framer. How do you handle changing the fill color of an imported Sketch graphic / group in different states (for example, changing the fill of a button on click)? Is there a way to change the color of the fill, do people make duplicate layers in Sketch for the 'active' state or is this usually better to handle as a Framer layer (and just change the BG color) rather than an imported Sketch graphic / group? Thanks!
2
Tamim Swaid
This is my second very simple prototype with Framer. http://share.framerjs.com/0lvor7qsf44b/ Made the slider myself to learn it better. Maybe helpful for starters like me. The Framer gallery was helpful as I was able to read other peoples code and learn from it. Thx for those who are sharing. If somebody has a tip to make the showing and hiding of the sound layers more efficient, please let me know.
1
Carlos David
Well guys here is my debut on Dribbble, is a very quick interactive animation that I made using framerJs, you can have a look and if you like it, feel free to give a like and comment. best to all and happy Monday to everyone :D.
1
Samarth Bahuguna
What is the best way to animate style properties such as font weight or color in Framer? I considered the following options: 1. Using style as one of the properties being animated. But only numeric properties seem to be animatable and style isn't one of them. 2. Creating different states for bold and regular text and switching between them. But I can't seem to use style or style.font-weight as one of the state properties. 3. Creating two different layers for bold and regular text, and fading in and out between them using opacity. Is there a better way to do this? Thanks!
2
Wouter Walmink
I'm dealing with a mysterious issue: I have a scroll component with 5 layers inside. When I add a layer (even just an empty one) before the scroll component, the 3rd layer inside the scroll component disappears. If I place the layer after the scroll component, the 3rd layer is back again. May this be a Framer bug, or am I just missing something glaringly obvious here?
4

July 05

Peter Gr
Hey everyone :) I wanted to share this media player prototype I just finished. Has some fun 3d transitions between songs :) I included audio clips for each song, so it may take a moment to load: http://share.framerjs.com/jv2jdks49jnn/ Also, the volume control won't work in iOS. Thanks for all the help you've offered!
2
Shivani Dixit
Hi, I'am facing a problem in my prototype. The sketch file that I'am importing in framer studio imports unwanted symbols along with the artboards. I have checked this problem on a website which says that this problem was solved in Version 62, but I'am using Version 66 still I'am facing this problem. Is anybody else facing the similar issue?
2
Fritz Frizzante
COLOR! Another quick Framer Exploration, this time a Color App concept for children. This concept aims to change the way children learn and think about colors. Instead of using color names, the app provides an interactive “equation” showing which primary colors, and what proportions of these you need in order to create a secondary color (the one that shows above). Above all, it also teaches color theory. Even though my algorithm is not refined, nor is the conversion to RGB, the concept is based on mixing real physical colors, therefore CMY(K). The equations help children understand some of the basic concepts behind color theory and how to mix and create new colors. This is no code-wizardry. Happy to hear thoughts and tips. Try it here (best in safari or framer) http://share.framerjs.com/bi7cdret21l1/
2
Koen Bok
The latest Sketch Beta's changed a lot and cause some importing issues. We're working with the Sketch team on fixes.
4
Ralph DeMars Gnonlonfoun
Hey here ! Do anyone knows how I can get an text selected event ? I want to execute some script when the user select a text
3
Junhyuk Jang
Google Material Motion with Framerjs. I really enjoyed myself making this animation, but please use right tools for the right purpose. It's very hard to make animation without timeline feature :)
9
Marcel Hadorn
I think DRY is not really pushed in FramerJS?
2

July 06

Poojan Jhaveri
Can someone tell me how can I loop pages around using Page Component like Snapchat ?
4
Tianhua Yang
Hi everyone, as a beginner I'm hoping you guys can help me out with this very basic prototype What I want: Swipe right on the cells to collpase the right column but also move the scroll point of the cells to the 3rd cell column. I currently achieved this by tapping the top right box, but it seems the "scrolltopoint" doesn't work when swipping... Thanks in advance for your help! http://share.framerjs.com/fxkp9nsr350l/ Eric
2
Hee Won Min
Hi everyone :3 ! Can I export my framer file (000.framer) on my computer to Client and they can use it without Internet and Framer Studio? I'm looking for preview html solution (like Atom edit preview html , but no install program) I tried to open the index.html but keep getting script Error Message :0
0
Georgemaine Lourens
Hello community, I could use your help and I apologize if this has been asked before. I've made this file: http://share.framerjs.com/p4vqq6j5bq08/ it has 7 pages that I want to scroll through, and the current page has an indicator dot that is slightly bigger in scale. But the indicator dots aren't behaving like i'd like them to. the current page indicator should always be centered on the screen, and the previous/next indicator dots should move accordingly on the X-axis. Anyone around that could help me solve this puzzle?
1
Alex Venus
Berliners, come watch a movie with us :)
0
Blaine Billingsley
Maybe I am not understanding this correctly, but shouldn't the draggable.isDragging value be false immediately after the DragEnd event? According to the documentation: "Whether the layer is currently being dragged (returns false when animating). (Read-only)" Which leads to expect that if I print that value on DragEnd, it would return false, but it returns true.
5
Kai Oliver Reuter
Hello guys, i want to manipulate a point within a svg path with framer. I have used paper.js and created the following code. I want to drag a layer and assign its position to a point within a svg path. http://stackoverflow.com/questions/26958753/paper-js-and-framer-js-manipulate-a-point-within-a-svg-path Hope you can help me. Thanks!
9
Danny White
Framer Sessions NYC #6. We're trying a few new things this time. Definitely drop by if you're in the city! Confirmed speakers: Atif Azam, MongoDB Scaling prototyping workflow with Framer Lily Zhang, lilyxl8 and TransPerfect Leveled interactivity for browsing Ermal Turkesi TBA Framer NYC group: https://www.facebook.com/groups/1478561485785968/
1
Fran Pérez
Is it possible to modify the duration of the LongPress?
5
Noam Elbaz
FEATURE REQUEST: Would love to create a template (I reuse add-on Modules for different projects ) Would be great to just click on "New from template ..." with modules already in the correct folder and "require" in the main framer file! Thanks to Framer Team for consideration. You guys are awesome.
1
Noam Elbaz
The handles dont follow the square during drag. Any ideas. What am I doing wrong? I would think they would take the updated position, right?
1
Aaron James
Struggling a bit. I'm working with mix-blend-mode on a layer. Many of the modes work on the layer, like "screen", "overlay", etc. But the some modes that I need are not working, like "color", "luminosity", "hue", etc. Does anyone have any insight as to why luminosity is not working? CC:Koen Bok
4
Ryan Morrison
Has anyone here encountered problems with importing text layers from Sketch Beta to Framer? I have tried putting the text in its own group and even flattening the layer before importing, but for some reason the text layers don't appear in my Framer file. Any tips or troubleshooting would be greatly appreciated. Thanks.
2
Marty Laurita
Hey All, I saw a quick video on the Framer site that I wanted to push further (It appears after about a minute on the landing page): http://framer.com/ I was inspired to just try and recreate the video, and [of course] it snowballed a bit into something a little more fun. I learned so much on this one, mostly about nesting arrays within functions. This one utilizes all native elements within Framer (as opposed to imported elements from Sketch) which makes it way more flexible. Try out the prototype here: http://share.framerjs.com/5dokbxvto92a/ Would love to hear your guys' thoughts. Thanks!
3

July 07

John Lee
Hello Framer'roos – I'm thinking of making a speed reading proto and wanted some quick recommendo's of how to pull in each word from a long array containing a story (think about 300 words). The design constraints: 1. 70% of screen shows the speed-read area, 2. words flow at around 0.4 seconds before fading/scaling down, down the screen and get added to the sentence that its forming below 3. Once we hit a key word from the article like "Banana" we show an image of a Banana (not the word Banana). 4. The user taps the image of the Banana and it reveals the word "Banana". 5. Some makeshift interaction happens now where the user uses a mic icon or a input field to submit a word related to Banana. 6. The user types "Yellow" and this is correct (bananas are yellow – didn't you know..) and continues with the speed reading exercise. OR if the user submits something not related like "Trump is an muffin hole" then... the experience is over, weep, weep. Hope someone can help me figure this out. You've been super do-per in the past and I'd get you all Christmas presents if Santa comes to my Thanks Giving party this year. Thanks!
2
Samarth Bahuguna
I'm trying to detect a click outside a modal window to close it. Following other posts, I created a transparent layer just below the modal window and listened for click events on it. However, the bottom layer receives events even on clicking the window. How can I make the top layer of a stack stop events from reaching layers below it? modalWindow and outsideClicks are the two layers I'm talking about. Both are children of the clientPage layer.
2
Jeroen Bennink
Hi everyone, I'm relatively new to the world of Framer but I'm learning new stuff everyday. http://share.framerjs.com/u3og16dq5eb9/ I want to make a "this or that" style picker where the user has a choice between 2 photos. He taps on one and then I want the chosen photo to push the other one away. After that I want the next 2 photos to come in view. I'm currently having some issues with the pressing the other photos away (it works on the right but not the left) after that I want 2 new photos to load. I have the feeling that i'm close but I can't get it to work
2
盛碧星
Hey,Everyone,I'm working on my new project called "LIVING".I used FramerJS to make some animation for it. Loading animation: http://share.framerjs.com/r9if35apid3z/ list animation: http://share.framerjs.com/cdwco75yph1l/ popup animation: http://share.framerjs.com/nnzgl3veq6ez/
1
Daniel Specht
I just begun to work with framer+sketch with my iphone 6 and couldn't find an aswer for this. In my Framer copy there is no "iphone 6" device anymore to choose as template but there was once the option for this device (see attached image) Any suggestion which artboard in sketch i should take to work with in framer and test it on my iphone 6? until now, i took the iphone 6 artboard in sketch but when imported into framer, the size was too big or all the content was shifted.
19
Nadja Weber
Hi, I'm trying to include the node.js socket.io module following this link http://framer.com/docs/#modules.npm . However when I add the line "socket = require("npm").socket" to my framer script I get some errors, e.g. [Error] Error: Module npm can't be found require (FramerStudioViewer.js, line 3127) I followed the doc above so I don't understand what's going on here.
2
Devin MacDonald
I've finished my prototype, and it launches fine on desktop, but for some reason it won't load in the Frameless or the Frames app. The Framer folder is 13.9MB. It shouldn't be the images which only come in at 1.3MB. I'm guessing the amount of code I wrote is what's slowing this down. There is a ton of code involved in this (8,000 lines). I've tried to strip it down as much as I can, but it still won't load. Does anyone have any advice? Unfortunately I can't share a link as it's for a company project.
6
Hendrik Kleine
Not sure if anybody did this already, but I couldn't find it. Opening an app from the homescreen on an iPhone. http://share.framerjs.com/g0xzhscq80zw/ I've done this based on sight only, so the timings may be off. Would love to get feedback if you're making an improvement. Enjoy :)
0
Ron Sparks
Wondering if anyone else has had this issue. The short. I've been animating just fine using something like LayerA.states.switch() for Y position and now it's acting like it's switchInstant() The y position is no longer animating when I call the states.switch() and instead the Layer is just appearing at the location it should animate to. Wondering if anyone else has seen this happen with a larger/processor intense prototype?
3
Rahul Tyagi
what is #CollectioninJava ? javatportal Developed a #JavaCollectionframeworkTutorial for beginners and professional. http://goo.gl/mIAM0s #IntroductiontoCollectionFramework #javaCollection
1

July 08

Patryk Adaś
Thanks to you and framer I have finally managed to finish my article about Google Chrome History. I'd be more than happy if you could read it.
6
Josh Ackerman
I haven't posted anything in a while but I recently made a prototype that required the use of the iPhone home button (in Framer), and I couldn't find any similar projects in this group. So, even though it is a very simple project I figured I would share it anyway in case someone else wants similar functionality. Download here: http://share.framerjs.com/gxjw1gwnqht1/
0
Martin Halík
How do you convert FramerJS presentation into GIF for Dribbble? :)
1
Kyungsik Yoon
Hi, Framers. I am trying to build a prototype that simulates a instant messenger. Is there a way to have framer prototypes on 2 devices talk to each other via BT or WiFi or other means? Thanks in advance
11
Lachezar Petkov Petkov
Hello! Trying to use FramerJS/3rd party editor/Android Framer with this boilerplate: https://github.com/jchavarri/framer-boilerplate The only thing I modify is I change iphone-6-silver to google-nexus-5x. Behaves perfectly in Chrome: Framer.Device.screen.width returns "1080" as it should. But in the Framer browser (running on an actual Nexus 5x) it returns a weird "824" and crops the content. I can't figure out why for the life of me... Please help! :D
2
Jordan Robert Dobson
MODULE: InputField Class **UPDATE** Use this module now: http://jrdn.io/fcG1 OLD Demo & Module Post: http://jrdn.io/eLin This module allows you to easily add text & date inputs to your prototypes. You can also easily listen for onFocus, onBlur and onInput events by providing a function for the input to call to get the values and the input field involved. Valid input types with keyboard support are: text, email, number, url, tel, password, search, time, month, date and datetime-local You’re also able to set the placeholder and placeholderFocus values, a default value, maxLength, fontSize, indent and autoCapitalize properties. Here’s a quick usage example: searchField = new InputField  width: Screen.width  height: 132  fontSize: 48  indent: 48  color: “black”  backgroundColor: “white”  placeHolder: “Search…”  onInputFunction: myOnInputFunction Here’s a more advanced usage example: ageField = new InputField  name: “ageField”  width: Screen.width  type: “number”  height: 132  fontSize: 48  indent: 48  color: “black”  backgroundColor: “white”  placeHolder: “Enter Your Age Please”  placeHolderFocus: “Your Age”  maxLength: 2  onInputFunction: myOnInputFunction  onFocusFunction: onInputFocus  onBlurFunction: onInputBlur I hope this helps you in your prototyping! Framer Studio Source - Simple:  http://jrdn.io/2R0P2P0L3n3B Framer Studio Source - Advanced:  http://jrdn.io/2f0w0o0m3u0h Module Code:  NEW: http://jrdn.io/422q45143f18  OLD: http://jrdn.io/3K2K451a1m1h Happy New Year all! #framercode
26
Koen Bok
If you have ever tried to do a card-flip animation, you probably saw a weird cutoff when the rotating layer "cut-through" the layer behind it. Much like you saw in old video games walking through a wall. It is a Safari only bug and pretty easy to work around by adding a transparent wrapping layer. Here is an example: http://cl.ly/2d1w3t0a083l/download/Rotation.framer%202.zip
11
Judah Guttmann
I feel like this should be pretty simple, but I can't figure it out. I am using a bunch of layerA.state.next() but I want the state.next to be on a delay like this sketch.layer.states.next(delay: 0.7) but obviously that doesn't work. So any solutions?
2
Chris Camargo
That feeling when Framer throws you a real head scratcher.
5
Poojan Jhaveri
How do I disable back Layer when I bring any layer to front by bringToFront(). For eg. I want to disable the view when I bring alert to front.
3
Rob Byrd
Hello, I'm working on a prototype that has a sticky navigation bar past a certain point on the y axis. I currently am listening for an event to occur on my scroll components onScroll property, and setting it's equal to the scrollY value. This works great, with one exception. If the user scrolls quickly, releases the mouse, the event no longer fires and the navigation sits in the same place while the inertia of the scroll moves the page up. This also occurs when I trigger a scrollTo() from a click event. Is there another event that I could be listening for which would fire when the screen moves regardless of whether triggered by scroll, clickEvent, screen inertia, etc.
2
Justin Farrugia
Quick question, how viable would it be to build banner ads of different sizes on Framer and export them for use?
2
Aaron James
Feature Request: While in a code fold, press ESC key to exit the fold. I would love this keyboard shortcut. Thanks. CC: Koen Bok
2
Bimma Bimma
Has anyone attempted Mixpanel JavaScript API integration in Framer yet? If so, I would love to hear if you had any success or what your strategy was.
1
Nathan J. Crowther
Hey all, pretty new here, but I'm looking for a way to select text in my prototype. I'm using the textLayer module, but now I need to figure out how to select text and Google isn't helping me out. Any pointers? Thanks in advance!
8
Aaron James
Brain teaser time. Why are the colors/data from my two-dimensional array not cycling through when tapping the button. When I tap the button, I expect the background color to change, but it's not updating. Any clues? Here is my file. http://share.framerjs.com/hkjnvmb1zuk8/
5
Blaine Billingsley
I am trying to make this horizontally dragging thing, and you can swipe up on items in the horizontal dragging thing to trigger another event. I am having a hard time figuring out how to get it to work without jankiness. Where I'm at now you have to like, try to swipe twice to get it to register sometimes. I can't figure out why. Any help doing this better? Ideally I'd like to lock the horizontal scrolling when swiping the page itself as well. Thanks for any tips!
8
Dhruv Saxena
Unable to open any exercise file by Jay Stakelon. Can someone help - Link -
3
Krijn Rijshouwer
Hey all! Today we’re introducing Framer Meetups. A new page on the site that showcases all upcoming meetups hosted by amazing community members all around the world. Browse through previous events and get a glimpse of the great atmosphere. Interested in hosting one? Definitely let us know about it so we can help. http://framer.com/meetups/
5
Tyrale Bloomfield
Trying to target a layer with a specific id. I have no idea what the right syntax should be. Card.id == "1".style = { "backgroundColor": "#ff0" }
13
Jordan Robert Dobson
Join us at Substantial this coming Tuesday, July 12th @ 6:30PM in Seattle for our 14th monthly prototyping meetup. 30 people confirmed so far! We'd love to see you there.
0
Daniel Maniés
Hey guys, just the "onkeydown" event gets triggered. Does anybody know why "onkeyup" isn't working? :/
2

July 09

Dhruv Saxena
Is it possible to write your own functions in framer, just like in coffeescript?
5
Marco Santonocito
Experimenting with FramesJS
1
Agisilaos Tsaraboulidis
The prototype of the secret conversations feature on messenger is probably made with framer! I'm so happy to see that this prototyping tool is being chosen by big companies for their work more & more 😁
2

July 10

Brent Riddell
Hey, I'm having problems parsing JSON from Apple's iTunes Search API into framer ... if I use this example I found on the facebook group: data = JSON.parse Utils.domLoadDataSync "https://api.github.com/repos/koenbok/Framer" it works just fine :) but if I use one of Apple's URLs it always throws an error :( "https://itunes.apple.com/search?term=frameless&entity=software" Anyone got an ideas? something i'm doing wrong? or something wrong with Apples results? https://affiliate.itunes.apple.com/resources/documentation/itunes-store-web-service-search-api/
1
Monika Litzinger
hello together! i have a problem with a video layer… its working but if we add the parent it doesn't work anymore. (the code below is working without the parent-part) does somebody has any idea? thanks in advance! :)
4

July 11

Hidde van der Ploeg
It has been a while since I really prototyped something with Framer again, but pretty happy with the result. Feedback is appreciated.
2
Vedran Arnautovic
Has anyone been able to implement an example of the 'splash' effect on tap, or 'touch ripple' as defined in Google's material design (http://www.google.com/design/spec/animation/responsive-interaction.html#responsive-interaction-user-input)? I'm having two problems 1. getting the true tap coordinates Bubble.on Events.Click, (event)-> tapSplash(event.x, event.y) # do other things after the splash 2. tapSplash is the function which creates the splash effect, however it doesn't seam to return control back to the Bubble click event handler, so the stuff below it never runs
16
Fausto Pérez
Hi! I'm having some trouble finishing a material design exercise from the fantastic Jay Stakelon Framer course: http://share.framerjs.com/g8qc3xq7yv0w/ Why my ripple layer doesn't stay within the button even though I've set ripple = new Layer superLayer: button ?? Thanks a lot in advance!
1
Blaine Billingsley
Hello! A stakeholder I have is using Windows 10, latest Chrome version. It looks like Click events don't trigger for him. Is this a known issue?
7
Ran Duan
Dear Framer Team~ Do you have plan to implement Framer Studio for Windows? I really enjoy the workflow on Framer Studio for mac, but I have a lot of friends on Windows. They are desperately looking forward to the Windows version.
2
Aaron Paterson
hey everyone, I'm trying to create a swipe prototype from gathering pieces from previous projects. Now it's look kinda like a Frankenstein and I can't seem to get the 'home' into the array page to function with the drinks 1,2,3 like the wireframe? see attached wireframe for concept I'm trying to accomplish... http://share.framerjs.com/z0hj0irs8m2t/
2

July 12

Nitish Hooda
Hello everyone! New to framer! Is it possible to animate one layer's(Layer A) properties on tap on another layer(Layer B), am not being able to get it to work, no error on the console either.
2
Josh Puckett
One of my favorite and most useful patterns is to create classes for commonly used elements in and across prototypes, such as for buttons. You can add behaviors in classes as well, meaning anytime I need an interactive button I just need one line instead of fully creating a new layer + behaviors each time:
3
Greg Becker
Wondering if there are any Framer peeps in Portland who might want to start a meetup. I just purchased my license and would totally come to learn.
3
Ross Fenrick
I've seen people ask if Framer is a viable option for web/desktop so I wrote about how I've been using it to prototype for the web
4
Jorn van Dijk
Hey all, we just started a Framer Amsterdam group here on Facebook to share, plan and discuss the quarterly meetups we're organizing here. Join if you're nearby and want to keep track of our meetup. https://www.facebook.com/groups/1815715125315374/
0
Danny White
In NYC tomorrow night? We're still on the hunt for people to demo or present what they're working on
0
Jordan Robert Dobson
Help me test my presentation for my talk at Framer JS Seattle meetup tomorrow. Make my light blink please. :D *This is disabled now that testing has ended* http://jrdn.io/1G0T1O2O442v Module credits go to Marc Krenn.
6
Giovanni Caruso
Hi! I'm trying to recreate the drag to resize interaction for a prototype I'm working on (just to be clear: the same interaction pattern to adjust HD partitions for Mac OS). I've taken inspiration from the prototype made by Marc Krenn (drag to resize a mask layer) but I can't recreate the proper behavior. Any example? :/
3
Youssef Eid
Hey guys, I'm having some problems with coffeescript if statements. The executable line intrepid.Header.opacity = 0 works by itself, but when I add the if statement, nothing happens. Any tips? https://jsfiddle.net/29zg868h/1/
6
Lisa Sy
Hey there! Has anyone here yet dynamically created a togglable set of tags using Framer Studio yet? I'm trying to create tags with a default/selected state by running a for loop through a data object. Wondering if anyone has done this already because I'm getting a bit stuck!
7

July 13

Peter Gr
Has anyone used Josh Puckett's SVG module? I'm getting an error when trying to input the 'path' info that I got from Sketch, not sure why.
46
Øyvind Nordbø
Hey, Frameristas! I wrote a little thing about prototyping. More to follow soon!
1
Jason Tiernan
Has something changed in Framer to not support device orientation events? I'm using code from Josh Tucker now, (https://github.com/joshmtucker/OrientationEvents). I swear I didn't have reference errors (motion / orientation) the last time I ran the project in frameless.
4
Brian Byle
Got a quickie here: Best way to return an items array index value and pass to a function? myFunction = (buttonIndex) -> do something with buttonIndex here myButtons = [ buttonOne buttonTwo buttonThree ] for layer in myButtons myFunction(buttonIndex) Just trying to determine the index of a button that was clicked last and pass to myFunction. Thx in advance!
4
Jon Arnold
I want to build an interface that has a sticky bar at the bottom that scrolls away when moving down the scrollview (in the speed / scrolling distance) and comes back wherever I am scrolling up again (same scrolling speed/distance). Can someone help me with that?
3
Christian Hagel
Is there a way to keep one sharing link when I share from Studio? I'm building a prototype and would like to share a single link with my team and keep updating the prototype without having to send them new links.
3
Jorn van Dijk
We’re going live today! Watch the first 30 minutes of our Amsterdam Meetup in the group at 7PM.
1
Youssef Eid
Is there a Framer Toronto Facebook group?
2
Jorn van Dijk
There's still people dropping in so the live feed is slightly delayed. Stay tuned!
1
Felippo Teixeira
Hey guys! Quick help here... I'm creating a "reveal image" effect with a mask, but when scaling the mask the image also scales. How can I scale the mask and keep the image static?
2
Calvin Teoh
It seems like the '#{var}' way to concatenate variables into strings doesn't work anymore. The old '+' way works, but was wondering why the hash way was deprecated?
5

July 14

Marco Paglia
Hi, is it possible to grab and change values inside an animation? i.e. animationA = new Animation layer: layerA properties: x:10 curve:'linear' time:1 animationA.time=3 ---- Basically in this example I would like to dynamically change the time value, but it doesn't seem to work the way I tried in the example above.
3
Jitendra Vyas
Thoughts?
2
Peter Gr
I had set some transitions to happen once a scroll component scrolls past a certain point. It would work when I manually dragged the layer, but not when the layer would move past the point through momentum (after I'd lifted my finger). Figured out that using "X.onMove ->" instead of "onScroll" made it listen during the momentum as well. Just sharing in case anyone else has this issue :)
1
Bryan Sebesta
I have a prototype I'm building that has a slider, that flashes pages of a book as you move up and down the slider. The slider works fine, and I have the thumbnail images flashing correctly. But the images don't start loading (I think) until you move the slider up and down. SO: my question is two-fold. -Is there a way to tell when images are loading (i.e. when the event fires or before?) -Is there a way to force load the images as soon as the browser window opens, so the images are ready?
1
Karan Ganesan
Hey hi every one out here is their anyone who about Framer JS from Chennai India ???
1
Chris Keith
So i've been working on framer to prototype and design a website that im working on and i was wondering if there would be a future release where when you selected the "no device" or web browser options, the cursor would act like normal and not be the dot.
4
Lukas Imrich
Hi All, I am learning to work with Framer.js, and definitely not experienced in Javascript, thats why I hope someone will help me here. My problem: I have overlapping layers, and I am listening to the touch events which are fired on the back layer. However I want to take action only, if visible part of the back layer is touched. How can achieve that? Thanks!
4
Rad Kalaf
Hi! Does anyone have any links to desktop prototypes with Framer? I just started out and my current issue is native scrolling by the desktop (not dragging to scroll like on mobile devices). I've imported from Sketch and I'm not using an Artboard. Any help will be much appreciated!
1
Eli Beitzuri
stopPropagation() + scroll = problems Nested clickable elements require using event.stopPropagation() to mitigate a click on the child triggering a click event on the parent. This seems to mess up scrolling interaction. Is this a bug, or is there a different way that I should be coding this? Click on the blue card with the button, then click on the button inside the card:
3
Giel Cobben
Hey Guys, We've recently been working on bringing the Mollie experience to iOS. The Mollie app will be a lightweight app, focused on giving you insights into your transactions. We used Framer during the prototyping stage, to easily turn ideas into an interactive demo. Feel free to check out the code or give feedback. Hope you like it. Dribbble — https://dribbble.com/shots/2837308-Mollie-for-iOS-prototype Prototype — http://share.framerjs.com/accl71zza0jm/
2
Chandan Manohar Raikar
How can i make the prototype appear properly in all the device.like for ex. i have created the prototype on google nexus frame. when i view in devices its looking pretty small on the screen. and i am using it in windows(framer.js). and some parts have been cutoff on the mobile screen. how can i solve this? also is there something like auto height and auto width? or inherit height and width from super layer?
1

July 15

Christian Hagel
I've built a prototype using the built in device "Google Nexus 9". However, when viewed on a real device, a similar Android tablet with the same resolution, in the Framer Android browser, my prototype is scaled down. Ideas for what might be wrong or how to debug?
10
Brian Byle
Another quickie: I saw a pice of code online: for i in [0...5] Inbox["face#{i + 1}"].scale = initialScale I get WHAT it does, it iterates 5 times to set each face.scale layer to the value of initialScale. My question is, what is that ["face#{i + 1}"] part? Is that shorthand for something? Googling this was very difficult. Thx in advance!
2
Paolo Castillo
#SnapSVG #grouping #getBBox Hello my friends, I have a situation that I can't figure out. p1 = s.path("#{myModule.crazyPath}") g1 = s.group(p1) print p1.getBBox() # » {x:14, y:288, width:720, w:720, height:106, h:106, ... print g1.getBBox() # » {x:-0.8079986572265625, y:288, width:734.8079833984375, w:734.8079833984375, height:106, ... Anybody could give me a clue on what's going on? I've tried doing the same thing with other paths and in both cases it prints out the same, as expected, but there's this one path that just won't! I wanna group several svgs and keep track of the bounding box but this one path is ruining everything :( Cheers, pablo PS. It would be great to move this forum to a platform that could support threats, I would post this in the Framer/SnapSVG threat.
1
Danny White
Some snaps from last night's Framer Sessions at ustwo New York. Let me know if you're down to speak at a future one! fb.com/groups/framernyc/
1
Nic von Dort
HI guys, Im new to framer...and Ive 2 problems atm. 1. Is is possible to place a link? OnTap event on a button for example... 2. I want to build a sticky Navigation (mobile) - not the whole Header should be sticky - just the Tap Navigation... Any help would be really awesome :) PS: Why are the pictures that blurry on Desktop? Any way to fix this?
7
Rob Byrd
Hi everyone, I've been doing user testing with a desktop multi-screen prototype and have run into a common holdup with users. Almost all of the users have been thrown off by the smaller browser window that framer generates. Is there any way to create a full browser height and width prototype instead of the smaller browser window inside of the actual browser?
3
Martin Halík
How do you hand Framer project to developers? I don't think they should have FramerJS app as well.
2
Charlie Sneath
I'm putting a number of horizontally scrollable rows within a screen-height vertically scrollable column. This works with attached code, but the rows require a click before they can be dragged left or right after scrolling the screen up and down. How do I remove the need for this additional click? Project is here: http://share.framerjs.com/f294kvby1jt0/
4
Mike Stężycki
Hey guys, quick question. I'm using the new Slider Component, but I want it to move to fixed intervals (10 in total). Is there a property I can use to achieve this without hacking a paging component? link:
1
Aaron Paterson
Hi, everyone is familiar with the Twitter 'like' heart shape button right? I'm trying to create a prototype of this on framer, but having trouble? I would like to see the code for a project...
5

July 16

Stephen Crowley
FramerJS Seattle 14
14
Donald Pinkus
What are the main benefits to using FramerJS if you are already really fluent in javascript / css?
3
Jimmz Zhang
Hi, everyone! I am new here. I am a 3D and interactive designer while I don't have too much programming knowledge. Now I am trying to create a page with two different speeds scrolling layers. And the front layer is a picture while the back layer is a video. However, I found only front layer could be scrolled. Could anyone help me figure this problem? Thank you in advance.
2
Samarth Bahuguna
What's the difference between onDragEnd and onDragAnimationEnd? I want a way to detect when a layer bounces back to it's original position after being dragged and released. I want the instant when all the momentum, bouncing etc. has finished. What's the best way to achieve this?
2
Blaine Billingsley
Hey everyone, I am having a hard time getting mapbox to work in framer. I’ve got the basic map going no prob, and I’m trying to add a set of coordinates that will cluster depending on your zoom level (which mapbox apparently does easily). I started by just trying to recreate their example in Framer: My (not working) prototype: http://share.framerjs.com/8btz3g3ezqzd/ Their example: https://www.mapbox.com/mapbox-gl-js/example/cluster/ I took out some of the color coding stuff in their example, because I couldn’t figure out how to format it in coffeescript, so maybe something is messed up there? Really not sure, I’m in over my head. Any help appreciated!
0

July 17

Samarth Bahuguna
I want to trigger something at the end of this animation, but the onAnimationEnd gets called as soon as the animation starts. Is this the right way to detect an animation end? I don't want to use benefitsTopBar.onAnimationEnd -> because I'm calling several different animations on this layer and want to detect the end of this particular one. Thanks!
1
Dhruv Saxena
Is there a way to add collision detection between layers? For example, if there are 2 circle layers which are draggable within the canvas, can we do something that they do not intersect each other, but instead bounce off when they collide?
11
Jason Nelson
General performance question. I have a rather large prototype that I am working on and I am looking for ways to increase performance. Is there any performance difference between rendering SVGs vs. PNGs with transparency? TIA!
7
Terry Tien
Hi guys. Is it possible if I want to trigger a state switching after an animation end like this? timerBackground.states.add ________red: ____________backgroundColor: "rgb(247,73,55)" ________green: ____________backgroundColor: "rgb(46,194,172)" timerBackground.onTap -> ____this.states.switch("red") timerBackground.states.animationOptions = ____time: 2 timerBackground.onAnimationEnd -> ____this.onTap -> ________this.states.switchInstant("green") If not, how can I reset the layer to where it started? Thanks you in advance!
2

July 18

Isaac Weinhausen
Anyone having luck with layer states and style? Can't get styles to update. See example:
1
Trevor Phillippi
Happy Friday, Framers. I wanted to share a class I've made to help when working with numbers within prototypes. I find myself needing to create/update and animate labels that contain formatted numbers (which can be quite tedious), so I made this module which is a simple subclass of Layer to help. Enjoy! https://github.com/tjphilli/Framer-ValueLayer
6
Daniel Alvarez
I got the following problem. I'm working on Windows + Atom. I downloaded the most recent version from the Github repository. My layers are not centering using layer.center(), also tried to give x and y value of 0. I can't get to center the layer (it is not even showing) :(
6
Joshua Crowley
Looking for feedback on a small function I wrote to toggle a button and it's siblings, for use in a simple menu component.
2
Brent Riddell
So I followed this guide to using mapbox with framer: https://www.mapbox.com/help/mobile-framer/ the first problem when testing it on mobile is the package is over 50mb so mobile safari freaks out ... altered the prototype a little to use the minified JS library instead of this approach and works again ... but the next problem is whenever you rotate or interact with the map mobile safari throws these script errors at you ... not sure what to do about it ... only happens on the phone
4
Giovanni Caruso
Hi! I've spent a couple of hours prototyping a comment drawer (vertical list of accordion inside a scroll component) for a desktop app. Everything works like expected except for the fact that expanding one of the item, the scroll component doesn't update itself (?) and it is impossible to scroll all the way down to the end of the list. Here an example ( quick edit of Josh Puckett accordions list ). Any hint?
5
Ralph DeMars Gnonlonfoun
Hey there, Please Jordan Robert Dobson, do your InputField module support file input...?
3
Agisilaos Tsaraboulidis
Hey framer community, one quick question: How I can change the color of a Utils.LabelLayer? By default the color is set to white.
1
Bud Sigur
Hello everybody! I was hoping that you could help me with a small problem in my prototype. There is a "add new" button in the first section of my prototype. When you click/tap it a small menu pops up. If i click/tap again on the big blue button the small menu dissapears, but I would also like the menu to dissapear when I click anywhere else on the "My Samples" section. Can anyone tell me how can this be done? Thank you!
3

July 19

Noam Elbaz
Working with a video layer. I want to detect the end of the video in an Event... to trigger something else... cant find anything on group or in Docs.... thanks
3
Weston Thayer
Does anyone have an official-looking "Open Framer" image asset for a button? Clicking it would open a share.framerjs.com link. Something like http://share.framerjs.com/static/badgeA.png, but bigger.
3
Greg Jang
Hi, I'm having some issues with Framer and Frameless. First of all it doesn't connect properly. I need to manually input the address for Frameless to connect and after a "Import again" from Sketch Frameless doesn't update the designs(images). For example if I change my design to all black from white, Framer updates properly but Frameless keeps showing the white design. As if it's cached. I know this question is about Frameless but I'm starting to think it might be a Framer issue? anyone else have this problem? any help would be great. I'm using El captian 10.11.15 and iOS 9.3.2 thank you.
1
Hendrik Kleine
Hi Guys, does anyone know how to return the current page in a PageComponent? For example, I have 4 pages in my PageComponent. And I want a text layer to change depending on which page is currently being displayed, something like; if page.verticalPageIndex(page.currentPage) = 0 then layerA.html "Cool Page" if page.verticalPageIndex(page.currentPage) = 1 then layerA.html "Even better Page" But the index always returns zero 😖
1
Ralph DeMars Gnonlonfoun
Hey ! Please frameros, how can I make the browser scroll bar active when I am making a web app prototype....
2
Andreas Wahlström
Hi! Just wrote a module that makes it easier to work with text inside Framer.js. Let me know what you think! https://github.com/awt2542/textLayer-for-Framer
22
Trevor Phillippi
In the process of helping someone in the group last week, the question came up whether it was possible to create a realistic looking all-Framer-code version of the Twitter like button's animation. Here's the example I made, all in code! 😎😎😎 http://share.framerjs.com/9salyai60dl3/
5
Mayank Sagar
Noob question, but I am suddenly getting this error in my project. What exactly is this? Any help would be appreciated.
4
Chris Wang
Could someone help me? Not sure why I'm getting an undefined error using scrollComponent wrapper.
1
Chris Wang
Could anyone explain the logic behind "scrolling up" resulting in positive scrollY values and vice versa? I'm a little confused. When I "scroll up", the layer being scrolled is moving in negative direction in the coordinate system, right?
0
Salvar Þór Sigurðarson
Hi! I'm looking for the biggest and deepest Framer prototype out there. Something that uses real data, complex interactions, and generally moves closer to feeling like the product. Do you know anything like that out there?
3
James Ryan
Teaching 15 kids to code this weekend in Sydney using our web app built using FramerJS! Future generation right here :)
6
Nic von Dort
HI Framers, Im trying to figure out how to trigger different events while clicking on the same button (in this prototype named "Hab ich"). http://share.framerjs.com/a2ancyoiczdd/ psd.btnyes.onTapStart -> event1 second time click on the button event 2 Any ideas how to resolve it? Thinking about states atm....
1
Chi Wai Li
Here's my first attempt at using Framerjs (and coffeescript) the code is bit of a mess, but is there anything I should be paying attention to for the performance? it's pretty bad online (it's fine locally) Thanks all
2
Ricardo Sato
Hi! Anyone here based in São Paulo, Brazil? I am looking for people using Framer in the area to understand what topics/formats would be nice for a meetup.
4
Calvin Teoh
Is there a way to stop any animation delays on a layer from firing after they have been created? .animateStop() doesn't work if an animation isn't currently running. layer.animations() only returns currently running animations on the object. http://share.framerjs.com/qda58mc4xfgy/ You can see in this file that the last loop stops the first layer from performing it's animation because it has no delay, but others still fire. So is there anyway to stop them?
0

July 20

Grace Varga
I was looking for an animation similar to the mac dock bouncing notification... Something where a layer animates in, then bounces on a loop with a delay. I couldn't find one, so here's my take on it in case anyone needs something like that!
3
Caitlin Charniga
How can I trigger a layer animation to begin on scroll? Would it be easier to try and trigger an animation at a certain point on screen?
1
Steven Ren
Hey guys, 3 month ago I have began to learn Framer, and here are some of prototype designed by me recently. Check this 2 http://share.framerjs.com/t3x2hgvejgjk/ http://share.framerjs.com/1uwy92x7ddpi/ Behance: https://www.behance.net/gallery/40772163/The-Smart-Card-App Hope you like it~
2
Nipurn Doshi
Is it possible to remove a layer out of the previously added layers from scroll.content?
2
David Louie
When I try to use "@" or "this" to refer to scroll component it doesn't seem to work. I want to store a bunch of scroll components in an array and bind events to each one using the "@" method. Any ideas? Hopefully this is clear. myscroll.onMove -> print myscroll.scrollY # this works print @.scrollY # this doesn't work
5
Luis Ricardo La Torre
If any of you guys are in the 305, make sure you stop by! #MiamiFramer
1
Salvar Þór Sigurðarson
Hi Framers, I'm looking to build a desktop prototype where some layers present and visualize live data using libraries like D3 and Crossfilter. I have two questions for you: 1. Is this stretching the limits of a prototyping tool too far? This seems to go beyond most examples and instructions I've found for Framer so far, and I might well be heading down a painful path if this becomes way too cumbersome to work with. 2. Do you know of any examples with a similar complexity? Any tips, warnings, recommendations or other feedback very welcome.
1
Mark Frederik Meyer
Anyone else experiencing problems with "originX" and "originY" ? Can't seem to figure out why this simple code isn't working...Thanks!
4
Nora Leco
Hey All, wondering how to do the upgrade to get the latest updates. We received a couple of the updates but not all and our project work is on hold. Any ideas?
4
Jorn van Dijk
⚡ Welcome Ashanya to the Framer team! ⚡️
4
Nic von Dort
Any Framers here based in Germany (Muenich)?
0
Nicolas Tilly
Hi all, is there a simple way to put a website on an iframe in an Framer prorotype ? I want to showcase a responsive website and i think it's a cool idea to show it with Framer :D
3
Олексій Цеслюк
Hi everyone! I can't find an example of swiping and scrolling in the one page. For example: 1. I have group in Sketch with mask. 2. The group is imported to FramerJS from sketch 3. This group is wrapped and vertical scrolling is added. Is it posible to use layers with wrapped group on the pages with horizontal swipe?
2
Nic von Dort
Please. How to add different actions dependable of the times clicked? psd.btnyes.on Events.Click, (event, layer) -> if psd.btnyes.onClick = 1 psd.gkv.states.switch("stateA") psd.bu.states.switch("stateA") psd.phv.states.switch("stateA") psd.hr.states.switch("stateA") psd.r.states.switch("stateA") psd.un.states.switch("stateA") if psd.btnyes.onClick = 2 psd.phv.states.switch("stateB") psd.hr.states.switch("stateB") psd.r.states.switch("stateB") psd.un.states.switch("stateB") This doesnt work.... :/
6
Giovanni Caruso
Interesting article on visual perception.
0
Dezideriu Raita-Beeckman
Hmmmmmmmmmmmmm guys what ever you do you have still to code it the prototype you do it make sure that write Clear code otherwise it create a lots of conflicts and errors in The Browsers,so guys please ..........
1
Jules Cheung
Hi everyone, Framer noob here. Care to chime in on why you prefer Framer over other prototyping tools? Pros / Cons? Thanks!
13
Brian Byle
Hello again. Another quickie... -Creating an array, from layers in Sketch -Sketch layer structured is: myFolder child1 child2 child3 -I create a blank array with: myArray = [Sketch.myFolder.children] -print myArray instanceof Array returns true -print myArray.length returns "1" I would think myArray.length should return "3", the total number of child layers. Ideas? Thx in advance, stuck here.
4
Matt O'Donnell
Starting to learn JS and some friends suggested learning Elm instead. Thoughts? Think I'll run into any issues compiling it to JS for Framer?
3

July 21

Andi Galpern
Anyone in San Francisco interested in giving a 15-20 minute demo on Framer next week at our prototyping series? It would be either on July 26 or 28. designanapp.eventbrite.com
7
Rafael T Balbi Jr.
Hey frameristas! I've been trying to create a countdown timer and after having tried a variety of loops and searching for modules, am officially declaring myself as stuck! Does anyone have tips on getting a simple timer going? Something a bit like this live timer:
1
Toby Silverman
Hey friends, I'm trying to test out an early idea for a new feature here and would love to create a prototype that has the following screen with a live front facing camera in the place of the current photo, it's critical that the "flip" and "add sticker" layers can go over the camera layer. any idea if this is possible in framer? Thanks so much!
2
Adam Noffsinger
Has anyone explored resizing and moving a parent layer being used as a circular mask while keeping the child layer, a much larger image, in a static position? I'm trying to figure out how to move the circular mask around the image to highlight different areas, but can't figure out a hack to keep the child layer in place. I swear I saw something along the lines of "ignore parent x and y positions" before in the docs, but can't find it now. I appreciate any suggestions!
5
Ganesh Murugan
Hello Everyone, i tried FramerJS for 7 hours, fall in love with app, bought license and on my learning curve, my first basic prototype.
1
Kim Does
I have a question about using modules, maybe someone has a trick / way of doing this. I have a module which I use in several prototypes (reusing yay!), and I was wondering if there a way I can have the module in one central location and have all the prototypes point to this central module. Instead of having to include in every prototypes module folder and keep them manually synced. Looking forward to hearing from you!
1
ByPeople JP
Hey there Fellas We want to let you know that there are few hours left on this huge deal, 50 HTML5 and Bootstrap Templates for only $39!! Get your pack right away before it's too late!
0
Daniel Alvarez
While listening to a click event on a layer, is it possible to trigger an state on another layer and reset (take into default state) a third layer?
1
Chris Wang
Anyone had experience with embedding videos in framer? I tried it and tapping on it won't play the video. however if I enter layer editing mode, the video can be played.
1

July 22

Ondrej Rohoň
Hey guys, when having two layers on top of each other, first one with lower index is listening to touch events, the second one is on top of the first one, covering it and not listening to any touch event. When I tap the second layer, I still get touch event of the first layer. Is this bug? How do I prevent this behaviour? Do I have to set ignoreEvent of the first layer to true? Hope I made my self clear. Thanks for help. Here is an example:
10
Ethan Miller
When I went to make a website for a book project recently, I wished I could just do it in my favorite prototyping tool. So I did! A micro site with a miniature, 3D book: http://upland.world
4
John Marstall
I've never been able to find a good introduction to writing modules for Framer -- the official docs just include a paragraph or two and don't touch the important stuff. So I wrote one. Feedback is welcome; I don't want to spread bad info.
5
Lasifu Ta
Hi guys, I am using ' input module in my framer prototype. I am using the focus() function to let the input box gets focused automatically when the "write something" button is clicked. The focus() function works on framer studio or desktop browser, but does not work on iOS, does any one can help? Here is the link: http://share.framerjs.com/p3w61n89h6tx/ Thanks!
1
Mohsin Amjed
What is the best way to organize your design layers in a Framer project to make a ui repo to reuse for rapid prototyping? Anyone have a good sample file for their workflow? Context - I use Illustrator to design so I don't really import designs, I build them out as layers in Framer.
3
Stephen Boak
When I import from Sketch, I'm having trouble making symbols clickable. My workaround has been detaching from the symbol, but it'd be awesome to not have to do that. Is there a better way?
1
Lachezar Petkov Petkov
Hi all! Quick question - I'm currently trying to create a tabbed interface, and I would like to have each tab page content in a separate module, just for comfort. My failed approach is to export a layer and add sublayers to it, but it doesn't work. exports.ScreenBrowse = new Layer width: Screen.width test = new Layer backgroundColor: "red" y: 800 superLayer: ScreenBrowse I get ScreenBrowse is undefined. Any suggestions on how to approach this problem? Thanks!
2
Josh Ackerman
I started playing around with more VR/AR based stuff, and one thing I think would be cool is if windows would blend in with reality. That is, react to light sources, to determine stuff like shadows and gradient angles. Ideally, I would use real data from either a camera or some other sensor to calculate the position of the light source(s) in the screen, but being a prototype, this was just to see if I liked the idea in a simple scenario. Any feedback or criticism is appreciated. And of course, I will release the prototype if people are interested. Like on Dribbble: https://goo.gl/6cnfnw
7
Laürici Dumitru
Hello framers! I've got a question for you: Do you get any issues with previewing your prototypes on devices? I've got the case where I'm trying to to test a prototype on a Nexus5x and it is working really slow compared to the browser preview. Also tap and swipe work but not all the time. Is there any way to fix this?
1
Andy Jakubowski
Hey Friends! Playing around with the new MIDI Component — really cool stuff. Do you know if there’s a way to access a MIDIComponent’s value outside of onValueChange()? I would like to access it to set the initial state of the UI, based on wherever the knobs and sliders are on my nanoKontrol. I inspected it in the console and can’t really find my way in right now, but maybe you have any suggestions Eelco? Thanks a lot!
0
Joseph Kim
I was inspired by the circular interface of Samsung Gear S2 and realized that It is such a clever way to navigate things like newsfeed. So I decided to make conceptual Instagram in that way(I am not big fan of Samsung though) Thank you for watching :) Share: http://share.framerjs.com/18qtvrl7be5t/
3
Krijn Rijshouwer
Hey All! Here's an example prototype of the Apple Watch Activity app. It animates the charts on the screens you browse through with an SVG animation and displays the actual time. You can also easily add another chart if you want by adding it to the configuration of the prototype. On Dribbble —https://dribbble.com/shots/2687457-Activity-App-Prototype See Prototype —http://share.framerjs.com/z4rm8c5y9d6u/ Hope it helps people when working with SVGs and in adding structure to your prototype. Let me know what you think — or if there's other things you'd like to see some examples of.
3
Guus Baggermans
Is there any way to monitor change of the Screen.width? I've tried Screen.on "change:width" but that doesn't work...
3
Jon Madison
Framer.Device.contentScale doesn't seem to work when viewing on actual iOS device (neither Safari nor Chrome seems to honor it). my code: artboardWidth = 640 Framer.Device.contentScale = (Screen.width / artboardWidth) print Framer.Device.contentScale Swimmingly in browser on desktop, but no go on my iOS device
1
O'Ryan McEntire
So I am building a prototype that pulls in data via json object and constructs a series of layers based on that content. I'm using HTML to build out some "templates" that gets used for the different types of content sourced from the json. The difficulty that I am running into is how the get the HTML to interact with framer on user input. For example: If I am constructing a layer that contains HTML which might look like: <p>Do you like doges?</p> <button>yes</button> <button>no</button> Each of those buttons would have a value that tells me what I need to know to move forward in the prototype in a dynamic way. Getting onClick info from a layer is straightforward, but How would I listen for the click on a specific HTML element inside a layer? In javascript I would assign a data attribute to the clickable element and just read that off the element. <button data-whatever="yes">yes</button> this.getAttribute('data-whatever')
7
Ban Nguyen
Hi everyone! Is there a FramerJS meetup in Phoenix AZ?
1
Richard Whitner
Feature Request: Built-in infinite-loop/wrap functionality on the PageComponent.
3
Daniel Alvarez
Hi guys! Another newbie question here. I'm using Framer JS, without Framer Studio (on Windows). I want use a custom module. Which is the best way to implement that module? (This question is because all modules instructions uses a scenario where Framer Studio is being used)
1
Jon Madison
i had to jump back on facebook just so i can ask a question in this group, ugh. well, two. the first is: why is it that my framerJS prototypes do *not* cause safari address bar to disappear on scroll in portrait orientation (like every other website on at least iOS9+)? and how do i make it so? lord knows i've tried
2
Samarth Bahuguna
I've created a custom device for a browser. How do I set my screen origin relative to the device image so that my prototype sits in the browser window below the toolbar? Currently, my screen is being centered vertically with the device image, so it's partially overlapping with the toolbar. I tried setting Framer.Device.screen.y but it's not working. Thanks!
4
Aaron Paterson
Scroll component issue ~ sabotage?! Hey Framers, I'm having an issue with my swipe function. When I started to add the 'more info' click button command for 'card 2' {which pops up an ingredients list} the swipe stopped? see attached: http://share.framerjs.com/abcz9264de4g/
0

July 23

Mea Ningless
I am just getting started with Framer and CoffeeScript. I know that you use tabs in the code, so I get that. But I saw that in some cases people also (can) write declarations in a single line. So just for the heck of it, I was trying to write a new animation in a single line, but obviously there is a problem with "properties: opacity" and the "time, delay" params. I need to somehow specify that "time" and "delay" belong to animation and not to "properties". Is there a way to write this on a single line? Thanks! fadeIn = new Animation layer: block, properties: opacity: 1, time: 2, delay: 5
2
Simarjeet Singh
Hi As I import a sketch version 39 file into framer 1.14.14, getting this error repeatedly:
6
Kyle Hinze
Question for the experts :) I'm trying to recreate this 3D hover effect with a simple shape. To learn how it's done. http://framer.com/gallery/preview/#apple-tv-icon.framer I've made it this far but I can't figure out why the layers move to the upper left corner when I hover. Also, the clipping on the shadow layer doesn't happen in my Framer preview so I need to try and figure out what's up with that next. http://share.framerjs.com/g79uyfy7o561/ Thanks for any help with that. Also, I think I understand how the new x,y coordinates are calculated but don't completely understand how Utils.modulate works. Thanks!
3
Vlad Tyschuk
Hi everybody. Is there a way to change the background color of an icon imported from Sketch? When I'm doing ic_favorites.style.backgroundColor = "red" It changes only background and not the icon itself. Any ideas?
4
Terry Tien
Hello again guys! Is there a way to reference a variable and make it the dynamic content of a text layer? And also how to get a dynamic textlayer? Basically I mean making the dynamic dayNum show on the screen. http://share.framerjs.com/4i3kyfzbeygp/
5

July 24

Marina Lev
Hi guys! I was following Kenny's Framer tutorial (http://www.prototypingwithframer.com/material-design-with-framer/). But I cannot understand why I cannot see my second artboard? Please take a look here http://share.framerjs.com/cw3khii7xfl8/, and let me know what I am not doing right. Thank you so much!
2
Rolando Pdl
I came across this course on the O'Rilley website http://shop.oreilly.com/product/0636920042716.do does anyone had used it? I'm wondering if it's worth buying it. Any feedback will be appreciated. Thanks
3
Isa Bison
Is there a way to hide the layers panel?
5
Alex Venus
Hey guys quick question here - is there a easy way to get a text layer (imported from sketch) to mask a colored block layer and then animate the block to move?
1
Elliot Nolten
Hey all! I just published a Medium article on how we use Framer in our design process. Would love to hear your thoughts about it!
5

July 25

Isa Bison
A module for drag and drop, and other things. https://github.com/IanBellomy/Pair
4
Philip Madeley
Sorry to disturb your Sunday bliss..., However, I shall. Is it possible to loop through an array which already contains arrays and set the default state for each layer? Any help most appreciated :)
4
Jimmz Zhang
Hi!Anyone knows how to explore the final html file with the iPhone6 frame?Just like picture2. I can't solve the problem and only explore like picture3.
0
Ganesh Murugan
Hello Framers, since i started framer recently feel tough to work with multi screen prototype using sketch layer. I would really appreciate if someone could share some reference project which is more than 4 artboards. I would learn proper way of organizing stuff. Thanks in Advance, Ganesh
3
Sigurd Tapio Mannsåker
Hey guys, sorry if this has been mentioned before, but are there any plans to add text layers, or improve the handling of text for normal layers, at any point? I've been using the excellent TextLayer module, but the more I build stuff from scratch in Framer, the more I would love a built-in, elegant, and maybe even autocode-supported way to add, style and align text. Maybe it's just my workflow, but I use a lot of real data in my prototypes, so it's an area that would make a huge difference for me at least.
3
Terry Tien
Happy the rest of the Sunday(or maybe nothing left for some of you) guys! Just wondering, is Framer able to make a mock up of ios message, which supports typing and the animation of sending out including the text you typed? Has anybody seen one like that?
2
Daniel Alvarez
Hi guys! I'm still learning about about Framer. I'm using the module Input Framer (https://github.com/ajimix/Input-Framer). Is it possible to trigger an event when an you've interacted with an input layer? I want to show a layer after an input has been registered in that field. inputA,onClick > if inputA.value.length > 0 btnA.switch("appear") I'm not sure if "onClick" is correct for this interaction.
1
Sergey Voronov
any idea why this is happening? adding new layers in scroll component while scrolling
2
John Lee
Fade in out question! (share.framer demos very welcome – and get browny points! :) I have two images, imgA and imgB. I want to fade out imgA and see imgB for like 2 seconds, then fade in img A again. This needs to repeat itself until I click a confirm button. There are two issues: – The Animation is jerky (it fades imgA out slowly but pops it back in like an unwanted snotty clingy to your inner nasal passage). – Some errors when trying to stop the animation... Any help most appreciated!
4
Terry Tien
Hi everybody! See you again. For my project, I'm looking for a way to make the coffeeContent layer in the coffeeGlass layer, tiltable, like when you tilt your coffee cup. I just have no idea how to make it. Can we manipulate the left x or right y separately? Or some other ways? How do you think? Attached below: http://share.framerjs.com/zcgmwaoapqlg/
2
이정익
I prototype a timeline of Facebook app. You can watch movie previews while you are doing scroll action. http://share.framerjs.com/svdegk7fzq4r/
1
Blaine Billingsley
Been working through how to make dragging, dropping, and sorting work. Nothing crazy but thought I'd share here for any future drag/droppers! EDIT: Here's a more well-commented version: http://share.framerjs.com/5f5u8xen3xov/
11
Mea Ningless
Sorry for the unrelated question, but if there are any Facebook-Pro users here, is there a better way to look/read/answer this board other then in the browser? I'm not a FB user but joined this group so I can read/ask support for Framer. Since it's not a "traditional forum-like" page, I find it hard to wade through the questions, let alone searching for it, since for example, there is not even a title for a post to at least know what the post is all about. I was told the group does not support RSS feeds. Any better reading/writing experience other than the FB page in the browser? Thanks.
4

July 26

Saurabh Soni
Q: How to reset a FramerJS prototype programatically (through code)? I have defined a layer on clicking of which I want the prototype to reset to its initial state. I have tried using location.reload() but that reloads from network. How to reset without reloading the prototype from network? http://stackoverflow.com/questions/38157457/framerjs-how-to-reset-or-refresh-prototype-from-code-without-reloading
2
Jiaxin Chen
Made this Grid Interaction with Framer this afternoon. dirbbble: https://dribbble.com/shots/2855958-Funny-Grid-System Have fun: http://share.framerjs.com/9872g336kio4/
2
John Lee
Attention – Material design fans: Does anyone have a good MD touch effect? I'm using this ripple, but it's not looking authentic IMHO. Cheers n' gud on ya ;)
1
Spencer James
Has anyone ever had their framer documentation module stuck in the mozilla developer tools? Hit ⌘ + D, was looking at layer.style and clicked a link to a list of CSS properties on the Mozilla Dev tools site... After I was done looking at the list, I couldn't get it back to the Framer Docs. Kept opening and closing by x'ing out the window, back to the same page. Had to eventually just restart Framer.
1
Jonas Treub
Hey all! Here is an all-new PageComponent example. It allows you to swipe between a set of pages in 3D. The subLayer of each page gets rotated around a vertical axis. I’m using Utils.modulate to grab the scrolling offset, and mapping it to adjust the rotation and opacity of each layer. Hope this helps! http://share.framerjs.com/66wuztj2qq8b/
6
Stavan Himal
Hey Guys, May you please guide me for getting some tutorials on Framer? I'm very beginner in this and I want to learn. May you please help me out with some tutorials?
2
Jerry Lin
Hi, I'm learning official tutorial 2 https://youtu.be/3zaxrXK7Nac?t=510 And I can't call my image out like video, but if I use picture like green underline, it work.(maybe it need to match size? I tried too, but seem not right answer) This is my framerjs http://share.framerjs.com/k7exxffhvzhb/ Thanks for any suggestion!
1
Γιώργος Αγγέλου
Im sure im not the first who asks this question and I apologize for that...Im a beginner and I would like to know if there is a way a windows user could use the "framer generator" in windows....if this is not possible, is there any other way i can import photoshop files in framer...I currently use atom editor Pardon my bad English...
4
Jorge Alvarez
Is it possible to listen to the volume button of the iPhone as an event to trigger an interaction? Thanks! :)
1
Philip Belov
Hi everyone. I've ran into the following problem while importing a project from Sketch 39.1: Framer Studio doesn't import some of the layers (see the screenshots: the 'Selected1' layer is missing from the Framer Studio hierarchy, while it's present in Sketch). I need to operate on the missing layer for my prototype, but the thing is I can't actually do it. Does anyone know how to solve the issue? Thanks in advance for your help.
1
Ray Yip
I made a Spring Visualizer you might need. http://share.framerjs.com/7v2ygzramh4o/
16
Mea Ningless
Hi, I was wondering how long an uploaded project to share.framerjs.com stays on the server? Is there a way for me to "manage" it? As in, when I upload something but later making changes, I'd prefer to delete the older version(s). Thanks.
2
Ban Nguyen
Hi everyone, I am trying to do this prototype where you can drag/sort the codes from left to right one by one or click the copy icon to copy them all. Do you have any idea? Could you help? http://share.framerjs.com/h6q14vq3v1tn/
3
Rob Nero
Is anyone else having problems connecting the Framer for iOS app, to the Framer for Mac app? I'm on the same wifi network and no projects get listed. Compared to Sketch, the mirroring for Framer is too complicated to be useful.
4
Mea Ningless
I was watching this video on code folds: http://blog.framerjs.com/posts/code-folds.html I realized that at around 1:00 they show a little popup at the bottom right of the code pane that pops up the already created cold folds. I don't have that (using v67). Was that just for demo purposes and was pulled, or something is not working for me? TX
2
Eddie Ecker
Just came across this framer prototype and noticed it didn't have the link to framer.js or the other functionality that comes when sharing a project. It's also not being hosted by framer. How is this done? Is this frowned upon by the devs?
4
Kai Daniels
Hey Frameristas, I need some help with come coffescript logic. Essentially what I'm trying to do is trigger some magic when the y value of a layer falls between a range. What am I doing wrong?
5
Brian Byle
Hello all. Just wanted to shed light on an issue that gave me trouble when I was first introduced to Framer Studio. When I wanted to animate an item on screen, it seemed I had to make a choice between using: 1. someLayer.animate ..... 2. myAnimation = new Animation ..... 3. someLayer.states.switch(...) Anybody have opinions on which approach is best when? Reminds me of Photoshop when there was 10 ways to do the same thing....which is best??? Thx in advance!
3

July 27

Keyur Jain
Hello All! I got into framer a couple of days ago, and its been super fun to work with. Stumbled up an issue with functions and if condition today and wondering if anyone had some advice. Here's some description: the goal of this prototype are two things: a. the circular button 'changes state' when the alignment pointers are under the light square b. on pressing the button, the light square should light up the issue I am having is to have the button press event happen only when the previous conditions are met, and ignore clicks other wise. any thoughts how to solve them. and I'd really appreciate some tips, if other improvements can be done other wise! Danke! http://share.framerjs.com/o2m8vmytnsif/
5
Peter Gr
Hey! I have a game where I need to detect if a falling rock "hits" a draggable ship. I have it working, but wanted to know how I could minimize the number of calculations / event listeners going on in the background. Current structure (rock is always falling): rock.on "change:y" - if ship.x and y overlap with the rock's x and y -- stuff happens Would it help to throw in a "Math.round" at some point here?
0
Ban Nguyen
Hi everyone, I am trying to create circular flip for body (left, right, front, back and so on). I have all the images. Is there any sample on how to create this? Thank you!
0
Rob Byrd
I'm creating a simple hover effect on two list item buttons. For some reason the mouseOut event fires every time the cursor is moved which results in the hover state rapidly toggling on and off. Any ideas why this might be happening? http://giphy.com/gifs/l46Cm19XiQckBTS4o
2
Cory M Burnett
Hi all, trying to find out if it's possible to drop an iFrame somewhere in my prototype, that embeds a chatbot I've built. Anyone have any ideas?
3
Chris Keith
Hey All, So i've been messing with the color thief module and i want to take the dominant color that is returned and use it as part of a gradient. The issue im running into is the format in which the color prints out in isnt something i can store as a string and use when making my gradient. In the print out, the value is formatted with < > around it. I dont think it's a string or an array so i dont really know how to easily use the value outside of the simple layer.backgroundColor = color implementation. Any help in translating the value to a more usable format would be awesome. I've included a link to a project i set up to illustrate what im trying to do.
2
Agisilaos Tsaraboulidis
Hey Framers, I'm so excited to show you my first Apple Watch prototype for SoundMemory Rush. I was 50%-50% about if I want to show my prototype because I saw incredible things made by this community and mine is kind of simple. One month ago I made SoundMemoryRush for iPhone, iPad. A fast paced game with colors sounds etc. You need to follow the color or sound patterns to go up in rounds. I want to mention here that for 3 days was the most up-voted game on Product Hunt. After the launch and of course after fixing some bugs etc I thought that it would be a good idea to transform this experience to the watch. I started with the design, after a lot of changes, I decided how I wanted the design to be. (When you design for the watch you don't have so much freedom) The prototype phase was the interesting part for me. I learned a lot more about Framer and I changed a lot of things like sizes, values quickly. I would love to get your feedback on this prototype and of course how to improve the code that I wrote. Thanks go to Benjamin Den Boer for the audio module and of course to Andreas Wahlström for the textLayer module. Have an awesome Tuesday everyone Product Hunt link: https://www.producthunt.com/games/soundmemory-rush Prototype link: http://share.framerjs.com/1vjctlgybuj9/
2
Mea Ningless
Hi all, Unless I am doing something wrong, it seems Framer doesn't import images correctly from Sketch that has overlay which has a background blur applied to it (to mimic the iOS frosted glass FX). Example: 1. In Sketch, import an image into an artboard. 2. Create a rectangle with the same size as the image and place it over the image. 3. Apply your fav fill color to the rectangle with less than 100% opacity (eg 50%). (Make sure this is the color opacity and not the image opacity you applying.) 4. Apply a Background Blur filter to the rectangle with 10-20px blur. Now the image resembles the iOS frosted glass FX. 5. You may wrap the image + rectangle into a group (tried it with and without grouping). 6. Now import this into Framer. The imported image will not show the blur. Is this an issue or something I'm missing here? Thanks.
4
Scott Savarie
I saw a Medium post recently giving a breakdown of how to make a custom class, but can't seem to find it anymore. Anyone have a link to it (or something similar)?
2
Keyur Jain
Hello folks! I've been exploring the VRComponent lately. Thanks much to Jonas for providing this amazing module! I have a query regarding layer hierarchies in vr, and I've made a small mock up to explain it: http://share.framerjs.com/93bqhn94w17j/ There's circle as a VR layer and two more 'ordinary' layers as its children (a red and a blue square). The the issue is, when my elevation passes a certain point(center of the circle layer), the sublayer hierarchy switches, and the bottom layer jumps to the top. Any clues why that may happen? is it something related to vr perspective? ** Update : curiously,this issue only seems to be appearing only in the Framer preview, and in Safari.
1
Marty Laurita
If you live in Boston/are annoyed by the subway, you should try this: http://share.framerjs.com/5ywu2iafkule/ Works great on iOS! Check it out on dribbble as well: https://dribbble.com/shots/2862537-Where-s-the-Tee (doesn't work in Chrome since they removed geolocation support (thx, google), use Safari)
0
Koen Bok
Heads up. If you are using the latest Framer.js (by choosing File → Update Framer…) you'll notice that all the gesture events (like onTap, onSwipe, etc) now use screen coordinates instead of window coordinates. This might impact behavior of existing prototypes. Simply said {x:0, y:0} is now the top left of your device rather then the top left of the window. This makes a lot more sense. Example: http://share.framerjs.com/5iku9d8u27bh/ Gesture events: http://framer.com/docs/#events.properties This will land in the stable Framer soon. Thanks Jordan for the suggestion.
4
Terry Tien
Hi guys! Just a quick question. Is it possible to make the most right page cannot be dragged to left?
3
Danny Nathan
Hey there fellow Framers. I've noticed one or two others posting about this and figured I'd join the fray. I somehow never managed to get "drafted" on Dribbble and I'd like to start sharing some of my work there. Would anyone be willing to draft me? I'm "amongmany" on there. Thanks!
3
Mohsin Amjed
What is the best way to make events like .mouseOver for layers produced by a loop? I essentially want to do something like: this.MouseOver -> tab.states.switch("active")
2

July 28

George Otsubo
Hi, silly question...I'm using states and Utils.interval to repeat an animation but how can I stop it after a delay? I tried using Utils.delay but I'm definitely not doing it right.. or maybe there is an easier way to do this.
3
Chris Keith
hey all, so im not sure if this is a bug or im missing something but i have a scroll component with the horizontal scroll disabled, and it works fine with the click and drag scroll method. However, when i enable mouse scrolling, the "no horizontal scroll" constraint is ignored when i scroll with a mouse. if i click and scroll though it still works as intended. Am i missing something in my code? or is this just a bug? I've tried setting the parameter in different parts of the code just to see if it was an issue of order but that has made no difference.
2
Shane Brown
Has anyone integrated Framer with three.js /babylon.js / Verold / webgl stuff? How would that work? I'd love to have the 3D model for my prototype as somewhat interactive and live (rather than image) within Framer but I'm not sure how I would go about that (I've only tinkered with 3D / WebGL stuff).
6
Brian Byle
Hello. I create a class with 2 properties, create an instance of the class, but 2nd is returned at "undefined". Why? class Beer constructor: (@name, @type) -> myBeer = new Beer ("Epiphany", "DIPA") print myBeer.name (returns "Epiphany") print myBeer.type (returns "UNDEFINED") Thx in advance, I'm new to classes!
10
Mark Mattione
I'm seeing an odd error in Framer Studio that doesn't show up in browser or on device... Example: http://share.framerjs.com/u9b3u4kkukiq/ Framer Studio displays the following error: [.temp.html] Script error. I see this error whenever I try to reference the states of a SliderComponent. Is anyone else seeing this? I'm running Framer Studio v66.
6
Neeta Khanuja
Hello people, Here is our ( me and Sepideh Shahi , Inclusive Design Research Centre, OCAD University ), first prototype of My Lifelong Learning Lab in Framer JS. Some of all the things we loved about Framer were dynamic text input reflected in tooltips and sliding menus, easy animation features and specially the coffee-script, that makes framer one of the best tools for coders and non-coders. Online resources and code snippets proved a great help in implementing small details we needed. We are extremely happy to get our prototype as close as the final interface. This prototype will be further used by the developer to understand interactions and for user testing to gather insights for next iterations. Few things that we found challenging were, the framework got slightly buggy , time to import sketch file increased a lot with the final sketch files that had all components and lack of metadata for the selected component from prototype preview. Though these things were easily manageable, if fixed can make a huge difference in the overall experience of working with framer. Link to June 10th Prototype: http://share.framerjs.com/ugvlulyuuqge/ Link to May 25th prototype: http://share.framerjs.com/8i44fw5y9xfa/
1
Terry Tien
Hi guys! It's me again. I'm trying to make the animation like below and here's how I think about it: take the darker area in the dripper as an example, I use the mask in the Sketch and try to low down the top of the upper coffee, keeping the bottom y unchanged. Am I doing right? I cannot make it coz the darker area just keeps scaling instead being shorter. How can it happen? Thank you in advance. http://share.framerjs.com/poh5e6iq8pee/
3
Davey Heuser
I wrote a little something for the Awkward blog about the benefits prototyping brings to our workflow.
1
Baisampayan Saha
Hi Guys...need a help! Can I define states inside a function? eg: someFunction = -> layer = new Layer layer.states.add 1: scale : 20 2: scale: 1 button.onTap -> someFunction() I was trying something similar to this. But it was not working out! What can do to toggle between states that is defined inside a function?
3
Krijn Rijshouwer
Hey there! Have you been to a Framer Meetup yet? We’ve been having a blast attending as many as we can! This August and September, events are being hosted as far East as Tokyo and Seoul! Learn more about the new meetups and check the list to see if there’s one happening near you → http://framer.com/meetups/ If you don’t see your city listed, we’re happy to help you host one. Find out how here → http://framer.com/meetups/#host
4
Giovanni Caruso
Hi! Any reason why dragging a layer on Framer / Safari should work as expected while the same does not happen on Chrome? (desktop prototype)
1
Chris Wang
Can someone help me understand the difference between "parent" and "superLayer", I'm not sure what the differences are and don't know which one to use.
1
Elliot Nolten
I've been trying to create an accordion interaction in Framer for a while. But I think I finally made one that I like. So I thought why don't I share this with you guys. Have fun! http://share.framerjs.com/h960po4l1ojk/
2
Ee Venn Soh
I have just updated Sketch to v39 and it seems that it is causing some issues with Framer Generator (Open source). It says "Import Failed" now. Will there be an update to the generator? Koen Bok on builds.framerjs.com Thanks.
1
Rob Byrd
I've been doing similar animations in several cases where a layer displays on a click event and then switches states to hide a second or two later. I have been doing this through a set timeout that calls the change state. I noticed in the docs that you can pass additional parameters into the switch call. It doesn't seem to take into account my additional delay parameter though. psd.Flash_Message.states.switch("show") psd.Flash_Message.states.switch("hidden", delay: 5) The hidden state is called instantly
3
Charlie Sneath
My screen is flashing purple when clicking certain elements in my prototype, almost as if the prototype is acknowledging that it has detected a click event. I haven't seen this happen before; can anyone explain why it's happening, and what I might be doing differently? Thanks!
6
Lisa Kristinardottir
Framer and Ionic? Can anyone give me a case study?
2
John Johnson
Very new to Framer, I’ve slowly been surfing here and thru the interwebs in search of a solution to what I believe to be something someone has no doubt already done in Framer, I just haven’t found it yet. I’m not sure of the best way to do this in Framer but my thinking is as follows: using a PageComponent to allow easy left/right swiping from page to page, then define each page as a ScrollComponent for swiping up/down to scroll through content of each page. The issue is that the proto allows for movement in all directions (though I’ve limited the ScrollComponent to vertical only) as the user interacts and I need it to “lock” into horizontal or vertical depending on the intent. I imagine I need something that evaluates within a very short time whether there is more movement in the X direction vs Y (and then lock to horizontal for a page swipe) or more for Y vs X (thus a vertical lock for scroll). Hope that makes sense. Thank you!
3

July 29

Chris Wang
Hey guys, can someone show me how to duplicate a layer imported from sketch in framer?
5
Benjamin E Saravia
Practicing on prototyping faster, and inspired by Ed Chao work () I re did his exercise, with simpler code (I find). http://share.framerjs.com/kmxpcti73ent/ * Here's Ed's: https://dribbble.com/shots/2029636-Orbital
1
Sergey Voronov
love the new project info feature)
1
Chris Camargo
I have several buttons inside of a ScrollComponent that are nested within panels. On click, I'm printing both this.screenFrame.y and this.y, and I'm getting wildly different numbers, when they should only be around 200 pixels apart. Can someone shed some light on where this difference is coming from?
5
Kasper Andersen
Hey there. I'm creating a grid using the snippet from Framer, a 3x3 grid. Now I want to have an image, in each of the layers in the grid, from an array. If it was a list i would do image:array[rowIndex] and get different pictures, but what do I do when i have both a "rowIndex" and a "colIndex"? I tried to do [rowIndex*colIndex] but that doesn't give me the right order of pictures.
4
Kirill Pochivalov
Hello, everyone! Please tell me, how I can set .centerX .centerY position for object in different screen sizes? I need to prototype looks the same on the screens of all devices. Thanks in advance :)
1
Dhruv Saxena
I have been programming in open frameworks (c++) and processing (java) for quite some time. However, I am struggling with learning Coffee Script because any tutorial/book on the subject assumes a knowledge JS (which I don't have). Is there a way I can learn Coffee Script without having to learn JS? I just want to be able to learn Coffee Script so that I can understand complex modules in Framer better, and in the future be able to write my own.
3
Lionel Cordier
is there a way to get the clipboard data from a prototype? (capture the 'paste' event). Thanks!
4
Jon Arnold
Hi guys, currently I am trying to build an @mention prototype. I want to test it on my iphone. I use a textarea that should be focused with the loading of the prototype including showing the device keyboard. All the focus() functions don't work on the device. On the browser it works like a charm. Any ideas?
3
Kai Daniels
After scaling a layer, is there anyway to update that layer such that it returns to 0,0? When importing an image it's first rendered at 0,0 but any scaling manipulation places the layer at an arbitrary point dependent on what the layer's dimensions were and the scale.
1
Mohsin Amjed
How an I disable scroll in a scroll component if the content is all in view? I have a loop iterating through a user defined array to construct the child elements.
4
Kai Daniels
Is there any way to define the dimensions of the content of a scroll component? My prototype is creating some arbitrary figures and I want to force it to a specific size.
1
Agisilaos Tsaraboulidis
Hey guys, quick question: How I can reproduce the quick actions/3D Touch feature? Any framer project already implemented this feature or something like this? :D
1

July 30

Chris Wang
Will Frames and Frameless still be supported in the future? I start to have problems on both apps with access code. Framer Preview is great but thought it would be good to have those fall back options.
2
Laürici Dumitru
Hello Framer Community! What do you use to save your prototypes recordings as .GIFs for showcase? I normally screen record with Quicktime and then save it as a .GIF with Photoshop but I do get some compression problems sometimes, I was wondering it there is a simpler method out there. Thanks!
4
Peter Gr
I find myself squinting all the time to read the titles of my code folds, and to see where my cursor is when I'm moving it over the code in Framer. Is there any way I can adjust fold / comment color and cursor color? Dark gray on black is hard to see.
2
Dave Crow
Feature request: An option to turn off the Access Code functionality or have it be opt-in. I share links to prototypes running locally quite a bit as I'm in the process of building. The Access Code is an annoying extra step for me that doesn't solve any problem since I'm the only one in the office running Framer. Thanks! :-)
1
Gregory J. Orton
If any of you thinking about prototyping a video player / including video in your prototypes I found this tutorial which is very useful: http://toddham.com/blog/prototype-a-video-player-in-framer/ However, there's one problem, at the end of the article it recommends that you can use this piece of code: videoLayer.player.on "ended", -> print "video ended" to listen to events when the video ends. This will NOT work. In the current version of framer, the way to listen to this event that works is: videoLayer.player.addEventListener "ended", -> print "video ended" Anyway, it was a fun tutorial and it's quite cool to be able to use HTML5 video on the phone so easily...
3

July 31

Katherine Martinez
Hi, I am trying to get the height for a ScrollComponent's content when it is not explicitly defined. I initially created a scroll component and set it's height to use Screen.height. Within that scroll component I added a bunch of thumbnail images and set parent to scroll.content. After enough images were added to the scroll content, the height exceeded past the scroll component height and was masked properly. However, when I try to get the scroll content height it returns the height of the scroll component even though I can see the height of the content is taller. How can I get the height of the content and not just the actual scroll component/mask height?
4
Peter Gr
Using the new app has been great. Now that I can save multiple prototypes, I've been using it to compare versions of a single project. Makes me really wish I could save "states" of a single project in Framer, like can be done with the recent Sketch plugin http://states.design/?ref=hackingui Would be amazing if this could be incorporated at some point!
3
Lukas Max
hey, is there a list for the keyboard shortcuts like switch between windows and so on? Would be helpful.
2
Edwrd Han
Hey Guys, when I try to use the whole "layer.states.switch("name")" it can't all fit on one line and won't compile under the conditional statement or loop I have it in. So I tried to work around it by making a function which just takes an input and switches its state as you can see. They're called 'stck' and 'lst' But now when I run it, it always gives me an error for the line above where I call the function 'stck'. Funny thing is it seems to take the 'lst' function fine. Anyone have any advice or ideas what's going on here?
3
Jordan Robert Dobson
SVG clipping http://jrdn.io/2G1V1D2l3J2B Do you need a more complex clipping mask? I'm still working out how we can manipulate this in Framer but this is a solid start.
2

Monthly archives

2017

2016

2015

2014

2013