How to setup your Figma file for product design
Vložit
- čas přidán 3. 07. 2024
- You can get your own copy of the Figma template I show in this video by going here: femke.ck.page/figma-setup
✨ Join the waitlist for my course on Product Strategy for Designers - cohorts run multiple times a year and space is limited maven.com/femke/product-strat...
How do I setup my Figma projects? In this video I take you through my regular file setup which includes several different pages.
Looking for 1:1 mentorship or feedback on your portfolio? Book a session with me on Superpeer: superpeer.com/femke
----------------------------------------------
//LINKS
Get the Figma template here: femke.ck.page/figma-setup
//TIMESTAMPS
0:00 - Intro
0:35 - Quick walkthrough of Pages
3:24 - About Page
6:34 - Latest Designs Page
7:22 - Handoff Page
8:22 - Reviews and Crits Page
9:00 - Sandbox Page
9:16 - Extra pages
10:35 - Get the Figma template!
//GET STARTED IN UX
UX Design Validation course: uxforfreelancers.thinkific.co...
UX Research and Strategy course: uxforfreelancers.thinkific.co...
// MORE
Portfolio: www.femke.co.nz/
Blog: www.femke.co.nz/articles
Podcast: www.designlife.fm/
// SOCIAL
Twitter: / femkesvs
Instagram: / femkedotdesign
//TOOLS (referral links)
Music: www.epidemicsound.com/referra...
Webflow: webflow.com/?rfsn=1125819.b1c...
MailerLite: www.mailerlite.com/a/ktugp8ucmm
love the layout and especially the statusing to help others see where certain designs are at!
Thank you so much for this video!!! This is great and has perfect timing because at work we just moved to Figma, our files are a mess and I was just coming up with some organization propositions so your video and file come in hand perfectly! Looking forward to the handoff video!
Wow, this is super Plus Ultra of you! Just what I was searching for last night. Thank you!
Thanks so much Femke! The information you’re sharing is so incredibly useful. I can’t wait to try your template and way of working :-) I also really enjoyed watching your day in the life at Uber and how you got the job! Congrats and keep doing what you're doing because you're incredible, and so generous with your knowledge and time - you're an inspiration to other designers!
Femke thanks for showing your process, it makes so much sense to document the process and thinking as we design rather than throwing the presentation together at the end.
Just started a new role and making the transition from Sketch to Figma. I needed this! Thanks a mill Femke, great video as always :D
Thank you a lot for this video. The best recommendation of CZcams for this week.!
Greeeeaaat stuff, thanks! Really looking forward to that handoff deep dive episode!
Thank you, Femke! I'm excited to try this!
I just signed up for Figma to start my first real UX project and thought I'd ask CZcams for a start... and this is perfect, thank you! Signing up for that template r'now!
Thank you so much, Femke! You are my favorite favorite product designer
As someone who is considering switching from Sketch to Figma, this was super interesting and insightful. I can already see how Figma can improve and speed up several aspects of our workflow. And thanks for sharing the template file - would have loved to see an example from a project you've worked on to see it in use.
Great video, very helpful!
thank you so much for your time and dedication and generosity of sharing with the world. many many many thanks!
Uauu Femka!I'm glad to see your video. Your content is always so useful for my daily job. Thank you so much!
Hey Femke, thank you so much for your videos!
Hi Femke! I'm new to Figma and this is very helpful information/template for a beginner like me!
After working with Google slides for decks, I always wanted a sophisticated way to organize my research, so this template is perfect.
Thank you for sharing :)
Thank you for sharing and showing your process! This helps a lot :)
Thanks Femke, it was very helpful for me!
What I really like is you have a built in presentation piece with the slide screens. Communicating my progress is something I'm working on and this will definitely help~ Thanks!
You're welcome!
Hello, Femke!) Thank you a lot for your videos and inspiration how to organize design processes) Your videos have a perfect duration and timeline)
Super helpful, thank you!
Thank you for sharing this! I requested your template and still waiting... Would love to see it! Thank you again for making our life easy!
thank you so much for this video! i was stressing abt how to talk abt past projects
Hi, this is amazing. Thank you!
This is quite useful! Thanks for sharing :)
I loved your organization! Thanks for sharing!
Thank you!
Awesome! thanks for sharing!
Thanks for sharing how you organize your files Femke!! I feel that if there's something I'm learning from how everyone does their own is that Figma needs to add actual way to section off pages :D
Thanks for the really interesting video!
This content is very helpful and useful! Thanks for sharing
Glad it was helpful!
Quality content. Thanks!
Thank you for all your work. You're amazing!
Wow, thank you!
I saw this video in Aug 2020 and I am watching this again today, just to revise - because there are so many things to learn and revisit in this tutorial!
Yay so glad to hear that :)
@@femkedesign you should come on Superpeer!!
I wish I knew this earlier, this really helps! thanks
Wow, that's great instruction for the new designer. Thanks for sharing.
Glad it was helpful!
This was really helpful 😀 Thank You
Love your videos Femke especially your case study on how you got into Uber
Thank you for the tips and the template! Super useful, as always. I am really looking forward to the handoff video! (Have never done that yet, would love to learn how to do it properly)
I would love to see that, as well!
Thanks you very much for sharing it with us
Such a helpful video. The way you explain makes it very easy to understand. Cheers from Brazil
Glad it was helpful!
Thank you for making the template available via email! This is SO helpful for my team.
You're welcome!
I've just been adding my own design process in Figma, yours seem to be much more streamlined than mine haha! Instead of one sandbox page I broke them up into, lo-fi, mid-fi, hi-fi wireframes. As well as broken the design crit page, into multiple feedback round pages. This is to capture and keep track of ongoing feedback that I receive as the project progresses. I'm also a sucker for emojis so every page has a little emoji in the name 😁. Love the presentation in the about section, will definitely take that one away, cheers!
Thank you Femke for such an informative video from someone who's looking for best practices as a visual designer! Don't know if you have other videos that are related, but I would love to see how you organize your wireframe frames & other assets within your handoff page. Thanks for your awesome content!
Hiya! I do have a video where I talk about design handoff, you can find it here: czcams.com/video/PK8dLpwSqbw/video.html
Great video!
Thanks!
Damn! this is so good. My Figma workspaces are so messy, thank you for this.
Thanks 1 zillion! My "sandbox" is usually overweighted with designed versions, components, screens, shared prototypes...ugh it's messy spaghetti. I'm new to Figma and UI/UX, so your content is a lifeline for a newbie like me.
New subscriber and I am loving your videos since I am new to Figma
Thank you! Welcome :)
awesome! thank you
Brilliant!
I am a Web Developer just starting to get friendly with Figma. I have no Design training, therefore it is great to get to know your Thought Process. I love your system for keeping things organised to support collaborative teamwork. And TQVM for the template file.
Philip @LinkedIN
I am kinda new to organizing the files because I was always working in a single file but this is great. Thank you so much
Glad it was helpful!
@@femkedesign your content is super awesome, could you please make a masterclass or mini series of the complete UX process that Sr Designers like you follows. that would be amazing for many of us 🖤
Thanks!
You bet!
This is really useful thanks Femke.
My design files get really messy, especially during the exploration phase. It really does make a big difference when you handover a clean well structured design file.
Thanks so much for sharing how your actual files are structured. That is super helpful. I am curious how the file structure looks like in Figma. When you are finished designing a new feature, how do you update your master files. Do you have one Figma file with all the master layouts of the whole app? Or separate Files for each section of the app? Would love to know more how you structure the rest of the workflow.
Thanks so much for sharing this! Could you give more examples of how to use the workstreams page? As a brand new designer, I'm not sure what I would put here to use it productively.
Thanks for sharing how you organize your files Femke!! Do you have a process you follow for documenting/presenting your work?
Because, most times, product requirement changes during design reviews/feedbacks or in 1:1 meetings with a product manager/owner and keeping track of why a design decision was made is a challenge for me.
Gracias!
cool to see how you do things, so thanks! im curious to know how this works when you're juggling multiple features at once from the same project without having a load of different pages in the panel? (which is my current approach). be good to hear yours or anyone else's thoughts. sole designer at 5 person startup, you see!
Please make an series on Notion. From scratch to end. Means how to use notion. How to make own portfolio on Notion. Etc etc.
Any tool for documenting design process.
Epic stuff Miss Femke. Perfect for presentations. Do you use Miro as well? Some content on it would be awesome.
@@femkedesign It's great when you're working remotely. It's like having your own virtual whiteboard with almost unlimited space.
Thanks for sharing! It is really helpful! I have a question about formal
Design review presentation with cross -functional stakeholders, what information would you include in your design review presentation? For example : Problem statement? User story?
🔥
Hi Femke! Thank you so much for this video. Question: how do you approach the UX/UI-Testing? Are the ready-to-test screens/prototypes in the "Latest Designs"? Or do you use the "Reviews" page for that? Thank you for your work!
+1
Thanks for sharing your process! Regarding your archiving. When you move Figma screens to a new place all links are for Slack, Trello etc are broken. Do you have any suggestion to share if I want to archive but keep links related to older concept ideas and related discussions.
I like how the word critique has been shortened to crit. We "crit" each other's work.
What do you do with all of the explorations and rough work when you hand of the files to dev but want to keep it for reference for yourself?
Hi Femke! Do you use the screens from "Latest Designs" to create the prototype?
Cool cool, really liked the approach, but still didn't get an idea about Latest design section. From my experience, when I handed over my files to engineers, the less section you have, better for them to understand what they need to focus on. I am afraid they might be confused about Latest design and handoff. It's just my opinion, I might be wrong. Thanks for your efforts, please continue 👍🏼
@@femkedesign Make sense, thanks 🙏
👍
This is the best explanation for how to organize pages. Thank you! Quick question: in your example here you show one design review and one design critique. In a real-case scenario, would that list get pretty long? Or do you only keep the most recent review?
Hmm I could end up with maybe 5? So not too long.
@@femkedesign Oh wow! I'd love to learn more about your product development process. Projects I work on usually go through several rounds of iteration. I have projects that could have dozens on that list. I'm thinking there must be a way to improve my process.
Great video. Very informative.
I suppose you won't have all your design in this file. So this is for a new feature, where do you store the rest of the design. Do you have a big file with all the latest design and screens. And a component library?
@@femkedesign ahhh okay .. I thought it was this separate new feature of the product.. Cool :)
Could you make something for a design system?
Hey! Can you elaborate? Are you looking for a figma template?
Hi Femke! I had a question about your workflow regarding the project milestones, objectives, and workstreams. Do you work with the PM to set these up and document them in your Figma file, or do you find that you're primarily responsible for organizing all of this?
I definitely lean on my PM for this! I find they're helpful to have in the Figma to help give context to folks when I'm showing my work for design review, to get everyone on the same page and aligned with the project.
what are you using to record your screen?
Hi femke
I have a question about figma. If I have made a change, how can I undo it? I cannot find a "back" button.
Hi did you do a second video on this?
i didn't yet - what would you like to see?
Did you came up with this system of organizing? :O It's super informative and super helpful!
It was pretty common at Uber to organise files this way at the time I made this video :)
What is a workstream?
In this context think of it like a feature of a bigger project or product.
Hey Femke, Thank you for the video What If I use Adobe XD for my designs is it possible I can get a design job easily are companies rely on tools or creativity let me know
@@femkedesign Thankyou so much for your help
what about design crit?
What about it? Can you elaborate? :)
I am not receiving the template when I sign for the newsletter. :(
Please reach out to me via email and I can look into this for ya :)
Can someone share Femke's File for the template ? Couldn't get the File when I subscribe.
Hey! Please reach out to me at hi@femke.design and i'll help you out!
nice video but it could have been way better to have some actual designs on the latest design and Handoff section to see how you actually organize your designs
@@femkedesign great! Thank you!
I did't get the copy of the figma file
How can i get it?
It can take up to 24 hours to come through. If you still haven't received it, reach out to me via email :)
How did you transitioned to another country?
Hey! I share a bit about that journey in this video here: czcams.com/video/IngLVKGEHGg/video.html
So this more for presenting really? Sharing info, the finished concept and a more tidied up design file? This isn't the working file with the design system etc?
This is my working file! Not for presentation exclusively. At Uber we have such a large design system that it lives in it's own file.
@@femkedesign Ah great! Yeah, we do the same, we keep the DS separate from the working files and review and publish changes to the DS from branding to feature level. Great videos, by the way!
This is for cheap freelancers. I have 1 designer doing this, I was about to kick his ass after seeing this setup.
is it just me or does the idea of letting anyone have access to 'sandbox' comps seem bothersome? I really don't like knowing that anyone can just look around in my discarded ideas. It's like they'd be poking around in my head and almost feels like an invasion of privacy.
Totally fair! Often I will move work from the sandbox into a separate "archive" file when i'm finished the project so that the final file is nice and clean.
Figma is a fart
ok ??