Framer Studio: A new interaction design tool. (framerjs.com)
almost 9 years ago from Jonathan Levy, Product Developer @revealparis
almost 9 years ago from Jonathan Levy, Product Developer @revealparis
I wish the Framer community lived outside of Facebook :/
Build some great groups software and I'll happily move over.
Is the group public? If so - why does facebook require a log in to view the content?
What about establishing a Slack community for Framer folks? Lots of communities are moving to Slack as it is more real-time and is a great platform for collaboration.
I know!!! Every time I try get some help in Framer, I end up looking up pictures of exes on fb.
This looks rather nice, but I'm afraid CoffeeScript is a deal breaker for me.
I went looking for an option that would let me use JavaScript, but I couldn't find one. I could see myself using this if such an option existed.
Are you sure you can't use javascript? I've done tons of framer work in pure js. The examples page lets you toggle between CoffeeScript and JavaScript also.
The examples page has that option, but I couldn't find anything equivalent in the app. At least not anything obvious.
I see - strange that they wouldn't offer it as an option in the app when it's on the examples page.
Can confirm... no option for vanilla JS in-app.
Coffeescript doesn't long to figure out. Don't let it stop you.
I have a very strong aversion to CoffeeScript. I know it's often advertised as a simple syntax for JavaScript and something that lets you avoid the "bad parts" of JavaScript.
The thing is, if you really know JavaScript well, CoffeeScript is a barrier. For example, it forces you to think about classes when there are no such things in JavaScript. Prototype-based programming simply doesn't work that way. There's no real inheritance, just object cloning.
CoffeeScript was a deal breaker for me with GitHub's Atom, as well. For simple tasks, sure, I can tolerate it if I really have to. But anything advanced and it's getting in my way instead of letting me get things done. All of my understanding of JavaScript goes out through the window because I keep having to check what it is that my code gets compiled to.
I know there are people who love it, and that's okay. What works for some people doesn't work for others. If CoffeeScript enables you to write your code more efficiently, that's terrific.
I've devoted a lot of time to JavaScript and I know its quirks and behaviours rather well by now. As I'd never really use CoffeeScript anywhere else, I just can't be bothered to learn a new programming language for a tool that works just as well with normal JavaScript. Is that silly?
exactly. I would not have hesitated to pick up coffeescript while I was newish to js but my velocity is fast enough now to where it's a hindrance
You indeed cannot use JavaScript -- https://twitter.com/jornvandijk/status/481118703053209600
I hope it lands soon though, all of our projects are in JavaScript. Having to switch to CoffeeScript just to use Studio won't work for us.
This is going to be interesting. Most developers don't know much about animation so designers are going to start pumping out projects that developers have no way of creating. I welcome these tools because unless you're sitting down with a designer, it's very hard for me to get the animations they want just right.
I guess that since CS is compiled to JS, then you could pull the output JS.
You can achieve same results using LiveReload + Sublime Text + SublimeCompletionFramerjs + Safari and dedicating half of screen to Sublime Text and other half to Safari. And it costs less than $49.
Indeed. But a Framer Studio license puts some food on the table of the team that brought you the very awesome (and very free : ) Framer.js
And that's worth more than $49 : )
I would support Framer.js team but $49 is too much for me for a tool like that which is basically a text editor with a browser. Nothing extra. Plus it is missing JavaScript support that I can have with the setup that I have described.
...but it's a bore to set up.""@"
Didn't work with my sketch beta to do anything. Worried that I'm going to spend money on a command line app that has a front end that is just as buggy as when you had to set it up from command line…
Could you file a github issue? We're working closely with the Bohemian team to have bugs squashed asap.
Indeed, please file issues here https://github.com/bomberstudios/sketch-framer-3 and we'll do our best to fix them : )
Anyone figure out how to change the device orientation? Can't find an answer anywhere.
If you find out then please post it here, it looks interesting and I want to try it out but without landscape orientation it's useless to me.
While running "generate" from inside Framer Studio, Sketch Beta will force close. No real error, no idea what's wrong, just a crash.
Any ideas? Is there a certain document setup scheme I need to be using?
That happens with complex documents, and we're trying to find a fix for it (though it's being very hard to track the exact cause)
Here are some tips to work around it (taken from here):
*
to the end of the layer name, or by converting them to bitmaps-
to the layer name)Eeesh, that's pretty bad news, as this is a pretty simple file with only 4 screens total (all in a single page). Would splitting them into different pages help?
On adding the "*" to complex layers— what does that actually do? Save all the marked layers flattened? Or flatten the marked layers and keep them separate?
Could you share that file privately with me? ale AT bohemiancoding.com
About the "*" bit: it will simply tell Framer that it shouldn't try to export sublayers below that layer (i.e: it will flatten that layer and all it sublayers into a single PNG) but it won't change anything in your Sketch document.
Let me double-check with the client, but sure, once I get it cleared, I'll ship it out your way.
You need to group the layers that you want to see in Framer Studio. Individual layers won't be exported. Also, Set the base layer's position coordinates to 0/0. Still crash? There's some known bugs, but nothing show stopping like you're describing.
My layers are grouped, unless there is some special grouping method I'm missing.
Example: all the layers making up the header (icon, title, menu button, etc) are inside a group called "header".
OK, did you save your document?
Yep, the document was that way before I started (with Framer).
Jeez I guess it's almost time for me to learn coffeescript. I know the results will be worth it, but I simply can't imagine anything being any quicker than InVision.
Apples and oranges, friend. Invision is an excellent prototyping tool, while Framer is an interaction design tool that allows you to create custom animations and interactions after you've already prototyped your application.
I wouldn't say apples and oranges, I'd say apples and ripe apples.
Also, framer.js says "Prototyping" in their main page title.
I understand how different the output of these two tools could be, but I also see a huge slice of users using them for basically the same thing: showing a "working" prototype to a person who isn't technical enough to "picture it".
Apples and pears? :S
While they're definitely both for prototyping, Framer is more aimed at prototyping animation and not the overall flow of the application.
I don't personally use Framer (anymore), but the way it fit into my workflow was more of a designer-shows-the-developer kind of thing. I typically used Invision to show a client how their website or app will function, and get sign off on completed designs. To me, they are very different.
If you've got a designer that's using Framer with success, I'd love to hire him/her. Seriously, designers are using CoffeeScript to show a developer how they want things coded?
I guess that's why Framer doesn't seem to fit into the flow for me— no designer I know would be able to use it unassisted.
(unless that designer wears all the hats)
I guess some would consider me one of those rare "unicorn" designers who codes, hand letters, produces icon sets, and can wireframe with the best of them, so I'm definitely not above learning CoffeeScript if it will help improve my finished product. At some point or another, I've used Framer, After Effects, Quartz, Origami with Quartz and Keynote to animate. I personally prefer After Effects but it has its drawbacks.
Lately I've been fortunate enough to worth with a developer in which all I have to do is provide him an AE interaction prototype and he can bang out the animation without much further input from me.
As far as those who wear all the hats, we're everywhere. We just mostly freelance (though I opt not to. I can't find a bizdev hat that fits me well enough).
I wear all the above hats and still find it hard to believe there is a large section of designers using this tool properly.
I guess it all depends on what you consider a "large section of designers", and what you think that means in relation to the tool. Example: a "large section of designers" don't even know HTML, and that doesn't make it a bad tool, does it?
Anyway, this is from Framer's site:
(The list is far from complete, judging from the amount of designers from other big companies that we've interacted with during the last months while working on the Sketch integration : )
This vs. the original that was free?
Framer Studio is built on top of Framer.js, which is still free and open source.
This is not a 'vs' thing: Studio is a very nice tool that will make your life easier, but you can keep on using Framer.js as you've been doing already : )
Whoa. So it's like Codekit or Transmission. I can still roll my own, but this makes it nicer and compact kinda thing.
Designer News
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Have feedback?
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now