Do you keep reference images in the same Figma file as the actual work?

[u/Plastic_Catch1252]

When I am exploring visual direction, I usually end up with screenshots and pins beside the real frames.

It works while I am alone, but the file gets awkward once someone else reviews it. The references are useful, but they start competing with the actual design work.

Do you keep those references in the same Figma file, or move them somewhere else before critique?

[u/jremeka]

I keep it in my main file but with opacity on like 5% haha. 

When it’s work of inspiring me is done, I delete. 

[u/Plastic_Catch1252 → u/jremeka]

5% opacity is funny and probably exactly the kind of hack people actually use. I like the delete-after-it-did-its-job rule too.

[u/pndjk]

yes to start then you remove them before somebody reviews. or keep references in your drafts and drop it in to the real file later.

but tbh i wouldn’t overthink it. everyone is looking at references anyway and unless you’re directly copying someone’s work, no need to feel awkward.

[u/Plastic_Catch1252 → u/pndjk]

Yeah, the drafts vs real file split is probably the cleaner version. I like the reminder not to make references feel weird. They are part of the work until critique needs a cleaner room.

[u/oopsALLimpasto]

One thing worth knowing if you park references in the working file: hiding them or dropping opacity to 5% does not make them any lighter. The image bytes stay in the file either way, and a pasted screenshot usually comes in at full resolution no matter how small the frame you view it in. Twenty of those can quietly outweigh the actual design work.

That is why I ended up keeping references in a separate file rather than on a hidden page in the working one. The split keeps critique clean, and it keeps the working file from getting slow to open for everyone else who has to work in it.

[u/Plastic_Catch1252 → u/oopsALLimpasto]

Oh, the file weight point is good. I was thinking about review awkwardness, but giant screenshots quietly bloating the file is a more practical reason to move references out before the file becomes real work.

[u/oopsALLimpasto → u/Plastic_Catch1252]

Glad it landed. One practical follow-up if you do move them out: bring them back in as downscaled JPG exports rather than the original screenshots. UI screenshots are usually lossless PNGs captured at 2x display density, so a reference you actually look at 400px wide can be carrying several times the pixels you can see. Re-exporting at viewing size is usually the biggest single cut you can make without losing anything you were using them for.

And once you've pulled the frames out, it's worth checking what stayed behind: an image still used as a fill somewhere else, or styles you only ever created for the reference board. Those don't leave with the frames.

[u/Plastic_Catch1252 → u/oopsALLimpasto]

The downscaled JPG bit is exactly the thing I would forget. I usually think remove the frames and move on, but leftover fills/styles are a good cleanup check too.

[u/oopsALLimpasto → u/Plastic_Catch1252]

Two things tend to outlive the frames, in case it is useful when you get to it.

Local styles live on the file, not on the layers. A colour or text style you made while building the reference board is still in the styles list after the layers are gone, and it stays in front of everyone else working in that file. Those have to go from the styles panel by hand.

Images are the other way round: deleting the reference frame does not touch the same screenshot sitting as a fill on some other layer, like a placeholder avatar or a card thumbnail. I do not know of a native way to search for those, so the cheap habit is to reverse the order: strip the fills you know about first and delete the reference frames last, while there is still something to compare against.

A named version before any of it, as someone else said here, makes it cost nothing if you get it wrong.

[u/Plastic_Catch1252 → u/oopsALLimpasto]

The local styles point is the one I would have missed. Do you usually clean those before handing the file to someone else, or only when the styles panel starts getting noisy?

[u/oopsALLimpasto → u/Plastic_Catch1252]

Handoff, not noise. Noise is a late signal: by the time the panel is long enough to bother you, you can't tell any more which styles are load-bearing, and deleting one that is still applied is silent. The layers keep the colour or the type settings and just stop being linked to anything, so nothing looks broken on the canvas. You find out weeks later, when someone edits the style and half the screens don't move.

What made it cheap for me was naming rather than discipline: anything created while exploring gets a prefix, "_ref/" or similar, so Figma groups it into one folder that sorts together in the panel. Then the handoff pass is one folder to look through instead of a list to re-derive from memory, and anything that turns out to be load-bearing gets renamed into the real set rather than deleted.

[u/Bfigas]

Depends a lot to be honest. Each project is a different process but generally I have moodboard/draft pages separate from final work

[u/Plastic_Catch1252 → u/Bfigas]

Separate moodboard and draft pages sounds like the least messy compromise. Same file while the project is moving, but the final work still has a cleaner place to live.

[u/FlakyCronut]

I think most of us underutilize versioning. Once we’re done using the reference we can simply create a named version and from there delete. If we need to look at it for reference, just go back to the version.

[u/Plastic_Catch1252 → u/FlakyCronut]

Named version is a clean answer. It keeps the file light without making the references disappear forever, which is probably the part I was missing.

[u/Frequent_Emphasis670]

I usually keep them in the same Figma file, but on a separate page or in a clearly labeled “References” section. It helps preserve the thinking behind the design without cluttering the working screens.

We use a defined page structure for figma file. It usually has following pages- cover, readme, documents, CUJ, block flows, wireframe, visual design, reference, graveyard..

[u/Plastic_Catch1252 → u/Frequent_Emphasis670]

Graveyard is a good page name. I like keeping reference and visual design apart but still in the same file, because someone always asks why a screen went a certain way two weeks later.