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

What is Framer? Join the Community
Return to index
Matthew Jones
Posted Feb 20 - Read on Facebook

Anyone out there mostly cut Sketch out of their prototyping? Any tips and tricks to share for a pure-code approach?


Jordan Robert Dobson

Yes. What do you want to know?

Marcelo Eduardo Oliveira

Me too. While I like the idea of having layout already in place .. It just get in my way when things are more than a simple feature.

For my approach I still use sketch but export pieces as I need them. I actually export the whole screen use as bglayer with low opacity than starting just dragging and dropping new assets as a prototype individual pieces.

I know I could save straight to the folder but I like the idea of not having to worry about name or dimensions.

Any other specific part you would be interested in hearing about ?

Jordan Robert Dobson

Yeah it's great to make fluid UI! Marcelo what's the drag and drop do for you? Is that to add layers?

Marcelo Eduardo Oliveira

Jordan Robert Dobson Exactly. Just that. (too lazy to drop on the folder, remember the name then dimensions )

Lately, I've been doing the following: I break down my prototype in pieces, doing one by one in Studio, then adding to a more massive prototype on sublime + with some live reload. So while on Studio I do everything as fast as possible to get the interaction right, then connect the pieces outside.

Daniel Fosco

Marcelo, so you're doing multiple-screen prototypes with Framer? Do you start by doing an "invision-like" prototype with Sublime and then add details overtime or the opposite?

Marcelo Eduardo Oliveira

Daniel Fosco yes. I link screens that are just images then starting replacing by real prototypes piece by piece /screen by screen.

Why like that way of working: multiple screen prototypes can be tested at any moment, even if some pieces are just simple images with transparent buttons linking to other screens / features.

Doing inside or outside studio is always about complexity: if I have multiple coffee files, / classes than I will move to sublime, but again with individual components being made mostly in studio ( faster, the code completion works better etc )

Daniel Fosco

Thanks for the reply! I feel a bit constrained by tools like InVision, partly because of their intrinsic limitations, but also because of the subscription/walled garden aspect... glad to hear someone is doing a massive workaround with Framer :)

Marcelo Eduardo Oliveira

Invisio is used only by project managers around here ;) they get the pngs and keep a flow of the product always updated.

Also, I love how flexible / creative you can get even with simple png transitions in framer ( 3d + opacity + curves = magic ) :)

Jordan Robert Dobson

Marcelo that's almost exactly like my process. Studio starts to bog down pretty quick for me on larger projects.

Marcelo Eduardo Oliveira

Jordan Robert Dobson great to hear!

I think the whole point is: I see a lot of usage (specially on the examples) of studio being great to explore / create quick animations an interactions ( almost like: motion interactive design : Google's example, etc) I still think it's the best for quick playground / experiments.

that said, I think Koen and team probably made the right call: if we are savvy enough to do bigger prototypes, we are going to be just fine outside studio as well.

Kevin Cannon

For me, that's the biggest plus of Framer. If I was going code first, I would probably use a diff tool.

Read the entire post on Facebook