Sketch Tutorials

“Blockframing” and 31 Free Sketch-Ready Layouts Using Auto Layout by Anima App

Yeah, you can download them. Yes, for free.

Note from Jon: There’s a free file you can download near the bottom of this post, but if you can spare 7 minutes (according to Medium), I think you’ll learn a thing or two! Enjoy!

Real Talk

The only time I ever create “real” wireframes is when I’m trying to show a cool process shot on Dribbble…

…and I never show cool process shots on Dribbble.

You guys, I’m just not good at wireframes!

I always get excited and end up adding way too much detail, and what was supposed to be a quick wireframe ends up being six hours of nitpixeling™ for perfect padding, magnificent margins, and textbook typography.

So no…I’m not really that good at wireframes.

But what I AM good at is blockframing.

Honestly though, this gets better every loop.

Block…framing?

My design mentor told me a story about a professor he had in school who used to take his glasses off when he assessed their designs. He said it helped him get a better sense of the layout and visual harmony of their designs.