menu
announcement

Spectrum is now read-only. Learn more about the decision in our official announcement.

Figma

Figma is the first collaborative UI design tool built in the browser. Join our growing community and kick off a conversation!

Channels
Team

Project Thumbnails

May 22, 2018 at 2:12pm
The Figma community has a new home. This thread is preserved for historical purposes. The content of this conversation may be innaccurrate or out of date. Go to new community home →

Project Thumbnails

May 22, 2018 at 2:12pm
I tweeted about this and it got a fair amount of traction, so I thought I'd share it here too!
Are you tired of your project feed looking like a small screenshot of a bunch of screenshots? Follow these simple steps and you can make your project thumbnails look great!
Step 1: First page in your project only has one frame at 620x320
Step 2: Create a cool design in it with fairly large text.
Step 3: Set the canvas color but leave the frame transparent.
Step 4: Bask in the glory of your opulence.
See attachment for before and after!

May 22, 2018 at 2:46pm
Ben, great tip!
like-fill
3
Another tip I've seen is to color code these preview to indicate status. That would make it really easy for people outside the Design team to know whats going on.
yeah, that reminds me Abstract. it helps a lot
like-fill
1
Been doing this as well, nice tip to change the page's background color to match!
like-fill
1
just curious, what do you call this first page?
I just call it Intro or cover, and move it to the the page 1 position.
like-fill
2
I named it "Library Thumbnail", but that feels a bit verbose.
like-fill
1
this is making me irrationally happy today thanks
like-fill
2

September 18, 2018 at 7:48am
I can't do it. Frame color to 0%, 620x320 and first position before every other frame. :/

September 18, 2018 at 3:12pm
I think you need to put it in a page as the only frame. Make sure it's the first page as well. :)

September 21, 2018 at 4:53pm
Did something happen with these? Looks like Figma is ignoring canvas background colors for project thumbnails now :(

September 25, 2018 at 8:09pm
Some of mine are glitched as well. Not all. Just some.

November 1, 2018 at 2:17pm
Love this Paul - such a simple but versatile system thanks for sharing!
like-fill
3

November 5, 2018 at 7:31pm
Thank you soooooo much! ❤️
like-fill
2

April 4, 2019 at 5:43pm
I can't get this to work for me consistently. I am following instructions posted here. sometimes it works, sometimes not. anyone else have this experience?

April 8, 2019 at 2:37pm
I've had my thumbnails disappear or struggle to update once a file became too big. What kind of issues are you having?

April 14, 2019 at 10:46pm
— biggest thing is making sure there's else on the first page — interested to learn about what other problems ppl are running into! We haven't had any issues...but we do keep our filesizes fairly small.

April 15, 2019 at 11:36am
Here is our setup. Did this awhile ago, and rely heavily on color coding. I highly recommend color to help make things glanceable. And limit words as much as possible. Color is used for status. I like the resource, and archive versions I might have to incorporate that.
like-fill
5

April 19, 2019 at 5:08am
Show more messages