When I say all of your content has given me better insight into ui/ux I truly mean it!!! Thank you for this!
@leonsholo
17 күн бұрын
THIS IS ONE OF THE BEST VIDEOS EXPLAINING HANDING OFF PROJECTS!!!! WOW!!! JUST WOWWWWWW!!! this has really helped me a lot!!
@femkedesign
11 күн бұрын
Thank you so much!!! I was worried it's getting a bit old but comments like this remind me it still helps people!
@emmanuelcadigwe
4 жыл бұрын
This is the first video I've watched on your channel and I am blown away. I can't even believe that I just stumbled on your KZitem channel. Please keep upload more contents like this. Thank you so much.
@_RafaelKr
3 жыл бұрын
As a developer who has built a lot of frontend designs I can say this is what every frontend engineer dreams of! Just awesome how well structured and detailed this is and how most (all?) edge cases are already defined beforehand. Usually when getting a design I have to spend hours of thinking on how the user flow should be and how everything fits together. Sometimes it even has to be reworked later as it's not working as expected. The least amount of time is the actual implementation of such a layout.
@chutikarncholsaipant2421
4 жыл бұрын
wow your figma is sooo organized, per usual. love how you remind us to show empty states + edge cases :)
@CoreyStewart91
3 жыл бұрын
"You're here because you care about your developers... I SWEAR YOU'RE ONE OF THE GOOD ONES" I needed to hear this today
@adebiyial
3 жыл бұрын
Your engineers must be really really happy. I say this because I wish I was one of your engineers.
@brocker8617
2 жыл бұрын
The most honest and straight to the point UX Design channel on youtube. :)
@femkedesign
2 жыл бұрын
So glad to hear that!
@ahmedeldemerdash1556
Жыл бұрын
This is the most useful video on the handoff process on the whole internet for paid and unpaid courses. it's above great work!
@mewra9700
9 ай бұрын
This is really helpful for someone who is new to handing off designs to developers, like me!! Thank you for this video!
@opeakinbo
4 жыл бұрын
Femke makes me smile 🙈😭. You’ve just got to love her
@khushipawar9109
2 жыл бұрын
THANK YOU!!! this is my first intership and my first time working with the developers , this video is giving me soo much info i didnt knew i needed!!!!
@femkedesign
2 жыл бұрын
Congrats on your internship!
@osherezra8460
4 жыл бұрын
One of the most in depth tutorials and real life cases tips on KZitem thanks happy I'v found this channel keep it up @Fem
@wawrzyniecstefanski6734
Жыл бұрын
Super cool! I like monospace-like font for description - looks "cody". Thanks for that film.
@funnzypink
3 жыл бұрын
I am the only designer on my team and I really appreciate your video! thank you.
@femkedesign
3 жыл бұрын
You're very welcome!
@jiamingfu9051
3 жыл бұрын
The quality of the content in your channel just blown my mind! Really love it! Please share more with us!
@femkedesign
3 жыл бұрын
Thanks so much! I constantly have videos in the works so stay tuned.
@jaceguden2726
2 жыл бұрын
You save my life daily no joke
@kwilderful
Жыл бұрын
Outstanding! Simply outstanding. It's one thing to want to be this detailed, but it's another to execute it so perfectly. But kudos to me, I was able to create a box in a frame.
@mychannel-lp9iq
4 жыл бұрын
You inspired me to finally find what I really want to di with my life.. thank you so much I love you and and please keep it up 🤗
@karenzurabyan4862
Жыл бұрын
Hey! Thank you for this amazing video!!! I was struggling two or three days to understand how to organize handoff. Non of my friends, who actually work already as designer, couldn't clue me in hahah ) So thank you very much!!!
@femkedesign
Жыл бұрын
You're welcome!!
@juliesz78
2 жыл бұрын
Wow, this video is really useful for me to understand how to manage figma files to handoff my engineering. Thanks a lot!
@femkedesign
2 жыл бұрын
You're welcome!
@naumankhokhar6471
3 жыл бұрын
Omg femke, it's like hand-off is an entire different game just like devops. Amazing. Please make a video on how to work collaboratively on one design. what's your process.. Godspeed.
@whelan0621
2 жыл бұрын
I recently need to do a handoff to programmer and I find your tutorial very helpful in giving me a big picture of what to handoff & also the detailed how-to. I also appreciate the part you explain your "thinking" behind those elements, that make me understand why you do what you do, which is important to me. I have learned a lot from your video. Thanks a lot for your time & effort :D
@femkedesign
Жыл бұрын
Glad it was helpful!
@hyberson
4 жыл бұрын
Congratulations on your product. It improves the quality of the software development process (and makes engineers' lives easier).
@heymcgowan
4 жыл бұрын
You laid out this video and explanation so nicely!
@rajapurva2012
4 жыл бұрын
Please keep on making such videos. This is highly helpful. You are like my unofficial mentor 🏆
@aqua123670
2 жыл бұрын
wow it's so neat ! i'm a frontend dev and i wish i worked with a designer like you.
@femkedesign
2 жыл бұрын
Wow, thank you!
@LindaAhn
4 жыл бұрын
Such an informative video. I'm always trying to find ways to make my design handoff not only easier for the devs but for myself as well. Super organized and so helpful. Thanks Femke!
@raulgaming1000
2 жыл бұрын
tq sis ! i learn alot how to handsoff design from you
@femkedesign
2 жыл бұрын
Great to hear!
@jacopocontin
3 жыл бұрын
I'm gonna steal your template 😊. Nicely done 👏👏👏
@femkedesign
3 жыл бұрын
Hope it helps!
2 жыл бұрын
its very deep detail, here i think i trained the devs to use figma too maybe i am doing wrong i dont know but here they use the file too and read the classes and know to inspect files...
@femkedesign
2 жыл бұрын
Makes sense! By process has changed a lot since this video and I also have been teaching devs how to use Figma to save this overhead.
@neha1299
4 жыл бұрын
This is helpful ..really shows how detailed your hand offs are. Thank you for sharing. I am a designer with few years of experience in graphic and retail designing. I took break from work and now I am looking to work im UX \ UI field. Your videos help me understand this field better. 🌸subscribed 😊🙏
@AbhimanyuSirothia
4 жыл бұрын
Thank you so much! This is superb! Have been having so many issues with engineers lately. This is going to be super helpful. Have already shared the video with my team, will have them start implementing a few of these things right away. I’m pretty sure sure I’m going to do that SuperPeer thing at some point. Sounds awesome! Keep making great vids! ✌️😊
@jasonwong7842
4 жыл бұрын
All the videos I've seen from you have been so helpful/inspiring, but this one is definitely a favorite. Thank you!
@maciejbalasinski2419
4 жыл бұрын
Really nice improvements!
@coiichen9894
4 жыл бұрын
Well organized Figma file, and you have a powerful design sense!
@munaalsoffi7702
3 жыл бұрын
You are an amazing scholar and designer. Thank you for all info you have provieded
@femkedesign
3 жыл бұрын
Thanks!
@mann8939
2 жыл бұрын
Wow something very useful. I was looking for a way to improve my work with dev team and I might apply some ideas from your video . Thanks
@femkedesign
2 жыл бұрын
Glad to hear it!!!
@founderkatelyn
2 жыл бұрын
delightful, thank you for taking the time to share this
@femkedesign
2 жыл бұрын
Glad you enjoyed it!
@guilhermeacardozo
3 жыл бұрын
I loved to know your process. I will apply this in my next projects for sure!
@femkedesign
3 жыл бұрын
You got this!
@CanOkyay
2 жыл бұрын
Thanks! Helped a lot.
@ph4Life12
3 жыл бұрын
this was so beyond helpful you're an amazing teacher!
@femkedesign
3 жыл бұрын
Thank you!
@Kazane828
4 жыл бұрын
And this is pretty handy, thanks Femke 👏🏻
@thiagoalmmeida
3 жыл бұрын
Excellent! Your process of work is very detailed and specific. Congratulations. I'm your new following. :)
@femkedesign
3 жыл бұрын
Thank you!
@tonys490
4 жыл бұрын
another great Video Femke..love to see your live design process of an app! so we can all follow along and learn form you.. cheers
@king_m
3 жыл бұрын
Thanks, femke!
@femkedesign
3 жыл бұрын
You're welcome!
@GadgetsGearCoffee
2 жыл бұрын
wow, your content is top notch, if I could do 5% of what you do and organize the way you do I'd be good! Where is that template you mention on Figma? I don't see a link in the description, thanks in advance
@paweenaha4120
4 жыл бұрын
Very useful content, thank you so much to make an effort doing this video, really appreciated Femke!
@sohanbhute7424
3 жыл бұрын
Wow. That was amazing. You worked on uber eats. That was pretty successful in India. Amazingly explained. More of these please..
@femkedesign
3 жыл бұрын
Thank you! Will do!
@ozenuaoluwatobi
2 жыл бұрын
This was really helpful, thanks
@femkedesign
2 жыл бұрын
Glad to hear it!
@saikatnextd
3 жыл бұрын
@femke this is wonderful. It would be great if you can explain the full design process you went through on this project, research, ideation, critique, user stories and various journeys and you already have the handoff..... I think that would set a wonderful example of how it should be done adding to already awes9me videos you post out there...... thanks for the hard work !!
@manuel_lebreault
3 жыл бұрын
Love the content, this shows me that I have a lot of work to do 😭😭
@femkedesign
3 жыл бұрын
One step at a time :)
@ryansriffs9112
4 жыл бұрын
Why has no one made a detailed handoff video like this? I just got my first UX job in design systems and documentation and this is really helping. Do you have any resources for learning more of this in depth? Subscribed.
@kevinchow5604
3 жыл бұрын
Where can i find the template please? Great video
@chaerulsutami3015
2 жыл бұрын
Really really great content! Can you share about how you do versioning in your design (also relate to handoff). So many thanks!
@femkedesign
2 жыл бұрын
Hey! These days I usually have a new page in my Figma for each week, so that old versions and explorations are preserved and folks can easily go back and see the history :)
@greatpixels
2 жыл бұрын
@@femkedesign Thank you very much for your sharing. When your component library is updated, how can you handle the pages you have created in this way? Also, you use the same screen frames in more than one place. Are you creating components from screen frames for this? Thanks.
@elingebring43
4 жыл бұрын
Thank you so much for sharing! Super interesting to see.
@Qbabxtra
3 жыл бұрын
This is so good that even I, as a _developer_ is watching it. El-o-el
@Penkej
4 жыл бұрын
hi Femke, this is super useful! I just moved to Figma from Sketch + Invision and the handoff experience is quite different. Just out of curiosity, why did you lay out all the specs in the file even though engineers can check specs using the editor? thanks!
@MukundJha
2 жыл бұрын
Thank you for the video.
@femkedesign
2 жыл бұрын
You're welcome
@tiansmusic
2 жыл бұрын
great videos! taught me so much :3
@femkedesign
2 жыл бұрын
Yay! Thank you!
@ferreiravinicius
2 жыл бұрын
I loved much to see it. Thanksssssssss!
@femkedesign
2 жыл бұрын
Glad you enjoyed it!
@whereisjeffrey
2 жыл бұрын
This is great thank you! :)
@rahullokhande5759
3 жыл бұрын
Very Informative. Loved it!
@nadaah9
2 жыл бұрын
i am so glad that i just watched your video because I was about to be roasted I wanted to give the design with actual detail but did not know how to make it look good thank you so much
@femkedesign
2 жыл бұрын
Glad I could help!
@xavhan
4 жыл бұрын
Thanks a lot, this was really insightful and inspiring!
@CalatzOps
4 жыл бұрын
Great video, thank you for the insight! Would love to hear you thoughts on building design systems using the Atom framework and the tools needed to allow collaboration across team members, for example Abstract if we’re using Sketch or just sticking to Figma.
@malemess
4 жыл бұрын
@@femkedesign I would be so interested in this!
@kartikdhaduk4024
4 жыл бұрын
Superb🙌👍 Thanks a lot for making this Video🙏
@lavendela9403
4 жыл бұрын
Hi Femke, Would you please make a video about how is product designer different from industrial designer & how to differentiate between all those design related educations. Wouldn’t a design engineer be able to get do the design as you do? Best regards Aria
@alystdesign
2 жыл бұрын
I wish I could organize my design file like this but I'm a solo designer working on a really large file
@b_dono
3 жыл бұрын
OMG Thank you so much for this. Im on a huge project right now and having total anxiety on it. Your layout here really sets a huge standard very nice!. Do you do any live streams or is there a way you interact with people if we have questions?
@femkedesign
3 жыл бұрын
I do! I host livestreams on Superpeer: www.superpeer.com/femke
@199rajesh
3 жыл бұрын
Thanks alot Femke for this video, Can you make more videos about your process in figma
@carolynec893
4 жыл бұрын
This is awesome femke! I am curious how or if you include responsive information for your devs when scaling down to mobile ?
@olababs2048
Жыл бұрын
this is awesome
@NyteMyre
Жыл бұрын
I feel that a lot of in the Specs section can be done by engineers themselves using the Figma Inspect option, and spelling it out like that seems like a lot of unnecessary work. Likewise with the states of the dropdown. Also with your "Status Indicator" example. Why exactly spell out the color or class when.. if you have a style defined in your library, the engineer can see it exactly in the Inspect window. I do like the organized workstreams and user flows though.
@femkedesign
Жыл бұрын
definitely! This video needs an update haha
@DAPH1918
3 жыл бұрын
Can we take a moment to appreciate how nice Femkes eyebrows are?
@ryanb2244
4 жыл бұрын
This was very insightful, thank you! I do have one question; I noticed you don't have any designs for tablet and mobile. Do you not hand those off as well?
@wetiot
4 жыл бұрын
Fantastic stuff. Thank you.
@noahstack375
4 жыл бұрын
Whoa I love that template and the handoff specs! Who created/designed it??
@azenza7366
4 жыл бұрын
This is so helpful!! Thank you so much :)
@alfredyeap8890
3 жыл бұрын
Hi Femka, thanks for sharing your valuable insights again as usual! Just wondering if the specs portion is really necessary as Figma already have the guideline provided for devs. When it comes to a more complex user flow with animation that could not convey via the static screens, do you mind give further insights into how's your approach in doing that, please?
@femkedesign
3 жыл бұрын
If you have engineers that know how to use Figma, then no the red lining is not necessary :) For those kinds of flows I'd include a prototype!
@RB-bq2rq
Жыл бұрын
Great work! Do you keep maintaining your "Latest Designs" page after you've transitioned to building the "Handoff page?"
@xxheyymallyy
3 жыл бұрын
Could I ask why you did red lines and showed such detailed specs when the figma file does that already? Wasn't sure if that's easier for dev or if there was another reasoning behind it, curious to learn!
@femkedesign
3 жыл бұрын
Hey! Our eng weren't familiar with how to use Figma. Since this video we've taught them how to so I don't red line as much :)
@xxheyymallyy
3 жыл бұрын
@@femkedesign thanks thats super helpful!
@kuanyangchen3033
4 жыл бұрын
Super clear! Really thank you for sharing this. Have one question tho, wondering how you handoff responsive layout spec?
@kuanyangchen3033
4 жыл бұрын
I see! Thank you so much 🥰
@janbeee1
4 жыл бұрын
Thanks for sharing your process. That helps me a lot. Now that you are done with this project: Do you update your master figma files with the latest designs from this particular project? (in this example the "campain Banner" or "how to pause an existing campaign" . I assume that you are having multiple figma master files with the overall "campaign manager" flows and files. (everything else the users are able to do that). I guess after each project you update your masterfiles, or how do you handle that?
@GadgetsGearCoffee
2 жыл бұрын
ya I'm wondering how to keep the whole thing tidy and up to date when there are the master files somewhere and then all these additional screenshots or copies (of various iterations) I feel things can get lost
@berdilaovidiu
2 жыл бұрын
I love your content, it is great seeing someone else's process and draw inspiration. I have some questions though. Being so much lazier, I try to get away with the bare minimum. Figma gives developers (viewers) some good ways of inspecting distances, colors, styles and even component names and variants. Do you still find it helpful to lay all that out in plain sight? And secondly, how do you deal with that amount of screen duplication when an inevitable change is needed? Thanks and looking forward to watching more of your content.
@femkedesign
2 жыл бұрын
Great points! This video is getting a little old now, though still very popular haha. I don't spell everything out in so much detail anymore. Instead I try to train my engineers on how to use Figma so they can get a lot of the info themselves.
@aleksandrajasinska9177
Жыл бұрын
Amazing content! I was looking for some info about documentation and you did the best job so far in my opinion. One question thou; could you please explain what Sandbox file is?
@femkedesign
Жыл бұрын
It's just your private workspace to explore :)
@cric46999
2 жыл бұрын
Nice informative video.....which plugin you use to annotate 6:30 ?
@femkedesign
2 жыл бұрын
No plugin - this was done manually!
@wge621
3 жыл бұрын
gah you're amazing! this is so so helpful
@femkedesign
3 жыл бұрын
Glad it was helpful!
@DarshanGajara
4 жыл бұрын
Great video, Femke. How much time do you usually spend while spec-ing the design for handoff?
@discoteo
Жыл бұрын
Hi! great work :) would you mind sharing your thoughts about how your process changed since you made this video?
@femkedesign
Жыл бұрын
Yes! Gonna save it for a future video :)
@leinie2317
3 жыл бұрын
thank you thank you thank you!
@anilyildiz77
3 жыл бұрын
Hi Femke, amazing video as always. Thanks a lot! I know so many people move to Figma but would you consider making a video for sketch/zeplin users?
@amberschen1124
Жыл бұрын
Great content! thank you for sharing this! Also, did you use any plug-in to connect the screen for the flow? thx : )
@mosopeadebowale
4 жыл бұрын
Hi Femke, thank you for creating this video and this shows your deep empathy for the developers. If you do not mind I would like to ask how this handoff process would apply in situations where you have tight deadlines. I can see this took a lot of effort and time to create. How would you speed up this workflow in that situation?
@mosopeadebowale
4 жыл бұрын
@@femkedesign thank you very much for the reply
@aerozg
3 жыл бұрын
Those UI screens look very neat and orderly. How do you construct your UI and layouts? I would love to learn about your process. My web application layouts always end up looking very simplistic and underwhelming, just a step above wireframes or semi hi-fi mockups, and then there is no more time and off they go into production, because i am so slow :( Most companies have an existing design system in place, but lets say you don't use an existing design system but have to do something from scratch, what's the first thing you do? How do you start thinking about the problem you need to solve? Do you for example use a typography grid (8pt) to set the horizontal visual rhythm? What about the vertical grid/columns (12 or 16 columns etc...)? How do you decide which one to use and why? Do you first address the information hierarchy and decide what emphasis to put on which element of the UI? How do you prioritize? How do you iterate? I have so many questions. I have been doing design for a long time but i am still not happy with my output, and i know i can do better. Cheers! Subscribed & following.
@urifried37
3 жыл бұрын
I noticed that the specs that you share are super clear. How did you create those pink margin and padding lines?
@ritambharasingh9788
2 жыл бұрын
Hi Femke this was great!!! Would also love to know how do you take notes and capture feedback during design sessions and with other team feedback sessions. Thank YOUUU
@femkedesign
Жыл бұрын
I usually have a note taker when i'm presenting who helps jot down feedback in a google doc. Other times I might leave myself Figma comments as the feedback comes in!
@dsep12345
5 ай бұрын
Are the arrows you use for the flow custom? Or can I find them somewhere on the web?
@michellezhu1559
2 жыл бұрын
Hi Femke, thanks so much for sharing the handoff with us using real examples! It is so valuable to peak into how big company does things! May I ask one question about the "core" or "spec" section? Do you also have a separate design system file in Figma that is regularly maintained and do you also add in there the newly custom made components you put in the "Core/spec"? Thank you!!!
@femkedesign
2 жыл бұрын
Hey! Yeah I would maintain this as a source of truth I guess for that part of the product in which I own, so would update it if need be :)
@madebyape
2 жыл бұрын
Thanks, very useful. One thing, so you have the same screen used multiple times throughout the different flows, what if you have to update one of those screens, would you need to update all of the other instances of that screen manually? I was thinking recently of turning screens into components so I can reuse a screen throughout a flow.
Пікірлер: 297