Figma
Sign up
Figma

The power of Figma Drafts

Josh Dunsterville
Josh Dunsterville, Community

When I first started using Figma with a team, I was unnerved by the fact that anyone could jump in my files and see my work in progress. Historically, I was taught to share designs when they’re done (or nearly there). Whether it's a deliverable for a client, or something I want to get feedback on from a colleague, I would only pass it on when it was practically flawless.

There's nothing inherently wrong with this (who doesn't want to share their best work?), but if I'm being honest with myself this tendency was driven in large part by fear.

I worried that I’d be judged by the neatness of the file, the pixel-perfection of the shapes, or the naming convention of the layer names, instead of the actual solution I presented. This fear was amplified in an open, collaborative environment.

What if they see I'm not using an 8px grid?
What if they notice I haven't named my layers?
What if they see how I create my icons?
What if...?

In Figma, I would focus my energy and time on making sure the file was "presentable" rather than exploring solutions. If that sounds familiar to you, you’re not alone. Open design is still relatively new, so we're all still figuring out the processes and techniques that work.

Over time I adapted, in large part by relying on one Figma feature: An unassuming icon in the File Browser called “drafts.” Drafts gave me a way to dip my toe in the pool of open design before jumping off the diving board. A lot of people don't know much about our drafts feature or how to use it, so I thought I'd share a little more about my approach in the hopes that it helps others.

The what and why of Figma Drafts

You may have noticed the “drafts” icon before, or even used it from time to time. We have very little documentation on it from a support perspective, and we rarely mention it in product launches, because truth be told, from a technical perspective, it's the same as other organizational structures in Figma. Like teams and projects, it’s a place to hold files.

Your personal folder

But there’s one key difference — it’s your personal folder. Your drafts aren’t beholden to the permissions/share settings of the larger team or project you’re operating in (the way you are in the rest of Figma). In fact, you can’t grant global access to your drafts to anyone else — you can only choose to share an individual file (or not). It’s inherently your own space, to do with what you will.

Aside from just making you more comfortable with open design, drafts can also help you move past your dreaded designer’s block. You may be full of caffeine, inspired, and want to put pen to paper...but where do you start? Do you first try and find colors or maybe typography? What about flow and organization?

None of that matters in “drafts,” which are — by their very definition — not the polished final product. They’re a place for experimentation.

There’s a lot of power in language, and for me, the word “drafts” evokes a carefree psychological association. When I hear it, I don't think of design systems, prototypes, colors, or grids. No, instead I imagine my notebook that sits next to my computer at my desk, packed with random ideas, sketches, and a few partially completed to-do lists. Some of the pages are full from top to bottom, while others have a single word or a little icon drawn on them. Some are neatly written in pen, while others are smeared with pencil markings and the faint remains of poorly erased ideas.

My notebook
A look into my notebook.

Early on in my time at Figma, drafts became my digital notebook, my space to test things out. It’s where I go when I want to skip planning and jump straight into creating. And, just like my notebook, it's completely private unless I decide to share it.

Using Drafts

So, with all that being said, what does a draft-based process actually look like?

Similar to the way I use my notebook, I rely on drafts when I want to quickly jot down my design ideas. This can be anything from a random concept I have for an iOS app to experimental riffs of a specific Figma feature.

A look at drafts
A look at a few of my drafts.

As you can see in the above screenshot, it doesn’t look all that pretty. You'll notice that most of my draft files are untitled and contain random shapes in that beautiful default grey. 😉 Over time, I've learned to embrace this mess for the sake of working through my ideas.

This is the key to making the most of your drafts space: Create first, organize second!

There will come a time that you'll want to move your drafts into a project for further organization or to share with the rest of your team. Figuring out when to do this is completely up to you and will probably vary depending on what the actual draft is. For example, if it was a wireframe that I wanted to start creating high fidelity screens from, it would make sense to move the entire file into a project.

To achieve this all you need to do is select the file you want to move then drag it into the desired project.

Moving files into a team project
Drag and drop a draft file into a team project.

You can also do this inside the file by clicking on “Drafts” just left of the name and then selecting the project you’d like to move it to.

Moving files to team project with the drop down
Move a draft file into a team project via the dropdown.

If the draft contains an idea that I want to iterate on (maybe across different pages and files), I'll actually duplicate the draft first and then move the file into a project via the steps above. This allows me to keep a snapshot of that idea in my drafts in case I ever want to go back to it.

In this transfer/organization process I try to keep my drafts as the messy source of truth, and then clean up the elements in the actual project files.

The last method I use to organize my drafts (or any space in the file browser) is the filter feature. Near the top right of the screen you'll find the dropdown to filter by File Name, Date Created, or Last Modified. Using these filters are a great way to help you find that one idea you had at the product milestone meeting on Thursday...or back during January's OKR brainstorm...or in 2017 😬. Everything that's old becomes new again right?

Filter files
Filter your files by name, date created, or when they were last modified.

Final thoughts

Overall, using drafts has encouraged me embrace Figma's open, collaborative environment. It warmed me up to the idea of bringing people into my design process early and often, without being so focused on the appearance of the file. And it helped me to roll up my sleeves, push back against creative block, and just start designing.

Do you use drafts? What's your approach to this personal space? Have you fully embraced open design? I'd love to hear from you. Follow and connect with me on Twitter. :)

Try Figma for free.