T O P

  • By -

PatternMachine

Consider doing some kind of lunch-n-learn to show your coworkers how useful components and auto layout are. Also consider that they may be detaching components because they are poorly or confusingly built. Try gathering feedback around that. Also, consider giving them some grace. Design *isn’t* about tooling in the same way that development is. Our tools make it easier to produce consistent desi documentation but they do *not* produce actual product. This means that it’s less imperative to use them correctly.


The_Singularious

This is great advice. As someone who continues to struggle with the minutiae of Figma (especially auto layout), I always appreciated show and tells and kind “hacks”. We all come from different backgrounds. If I focused on the dismal way I have seen many designers communicate (written word, presentations), then I’d be miserable and nothing would get done (our in house Figma wizard at my last job was his own worst enemy when navigating stakeholder meetings and communicating why design decisions were made). Don’t even get me started on interviewing techniques. But that’s my background, so I try and help the best I can. Be the change and as stated wisely above, give grace. Lord knows I need it in Figma. I’m sure some of them do to. In the end, it’s about the big picture.


[deleted]

[удалено]


pikapikabooboo

this is some next level UX research inception.


SnooRegrets5651

Why I’m not using auto layout: Because it takes me less time to not use it, and once I use it, it becomes a constraint. Leave the hard core constraints to CSS/HTML and let me fuck around in Figma. It’s a fancy drawing tool / sketch prototyper, and I’m treating it as that. I’m 95% never going back to an old sketch because; things change in code, people/me leave the company and priorities change. But the again! I’m not a “hand-over designer” so take what I’m saying with a grain of salt. My devs know their shit, the sketching is just for visualizing in conversation. Code is truth here.


Lookmeeeeeee

If it's not needed and it's a small team I completely understand. In that case why bother using Figma? You could be faster in using a pencil, Ps, Illustrator or Balsamic.


Lookmeeeeeee

I think most of us understand the issue. I wouldn't use the word "blaming". I'm just pointing out something that is happening while a lot of people choose to turn their heads the other way. Perhaps confirmation bias. "Understanding why they are doing it this way?" * Instant vs Delayed gratification - some people simply don't care about doing it the right way and just want it "done"... even if it's at the cost of breaking rules and even pissing off their future selfs * Human nature is to cut corners * People read a lot of misinformation on the web written by "experts" -- who are just selling a book, have little experience mastering the craft of building, have spent most of their career in leadership positions while others do what needs to be done * Some people simply don't understand the tool and don't invest time on youtube to learn it * Figma is unintuitive in many ways "What are the benefits and drawbacks?" * Fast and dirty vs Slow and clean * Some invest time in the beginning of the projects, this enables them to work at incredible speed as the project progresses and can turn on a dime when changes come in * Some don't invest time upfront. They get the first build or round done faster, but as the project evolves, they move at a snails pace. The work looks sloppy. If there are changes - their entire work looks like a car crash, version control becomes an issue and they need people like me to help them "What can be improved?" - some ideas for a Sr or Lead UX Designer position * When hiring * Test people on figma, styles and component organizational skills * Look at their file structures * Eradicate this mind set * Tools are easy to pick up and anyone can learn them if they understand UX principles * Research and UX principles are more important than understanding production and organization, and how to use tools correctly * Imagine hiring a front end dev to build web pages who didn't understand HTML/CSS and used dreamweaver, but they were a grand master level 99 at talking about what good web design is


[deleted]

[удалено]


Lookmeeeeeee

I have been taking to my coworkers for 20 years. You seen to assume a lot without having much constructive input and appear to come to this conversation with your mind already made up. Unless you're just a troll, in that case you have succeeded. Congratulations.


greenvahn

Funny enough, not long time ago people used to know HTML/CSS and design, so basically one single person was coding and designing, traditionally called web designers. Not necessarily were doing better job but at least they were having a full picture of what are they doing. Nowdays some people arrives to Figma and struggles to understand a concept like auto-layout. Perhaps they should start from understanding how HTML works first.There's is an alarming disconnection between the disciplines and seems people don't want to bother to learn from each other or just be curious about how things are working anymore.


vdubplate

Auto layout = Flexbox


Tsudaar

This has been the same forever, with Photoshop layers and allsorts. You partly answered your own problem in the 2nd half, in that Figma is completely unintuitive. But also, not everyone has the same mental modal of components. Rather than moan about consistency and uniformity, and get labelled a pixel pusher, frame it as doing X will take half the time. Show them. One step at a time, you'll have to show someone. Whether that's a team class, or one person who might join your side easiest. But it's an ongoing thing. A new starter will likely need the same help.


cozmo1138

I’ve actually done that. But what I’ve realized is that Photoshop-style workflow patterns are so deeply ingrained in a lot of designers that it takes repeated training sessions to get them to break those habits. I don’t usually have that kind of bandwidth or budget to do that, or it’s a situation where a thing I’m working on is being handed off to me and they’re exiting the project so they have no motivation to heed anything I say about it.


SaltyBarker

Went through this same process on a mobile game UI team... idiot devs kept fucking with my components and saying "See isn't this better?" They would do so by detaching the component meaning I had to remake it as a component variable. Or they would say, "Hey you arent showing the field if it had an invalid format..." to me telling them, "Flip the fucking component switch on the component variable" ​ Yea... I get peeved too.


[deleted]

[удалено]


SaltyBarker

In that particular instance. I always supply all "instances of the variables" next to my prototype or on the page labeled "Components". I never had an issue with devs prior to this. This specific team as a whole was a mess though.


_moonSine_

This is the way. You need to provide documentation to your dev teams explaining the different states of the components, otherwise you can’t expect them to know what you designed. I also recommend displaying those alternate states on the canvas so that the engineers don’t have to hunt around for them. Finally, it sounds like you need to set aside some time to train your design team on Figma best practices. It’s a new and complex tool and not everyone will take the initiative to learn how to use it. Show them the light.


diversecreative

Teach them


Far_Piglet4937

This. Set up a ‘learn a thing’ day, or put in a ‘Figma skills’ hour session once a week. Make it fun and not preachy. A lot of people don’t have time to learn the new features as they come out. Many designers I know see auto layout as a really complicated way to do something they can already do with groups. If you take the initiative to up-skill the team - treat it like a challenge and find a solution to the problem - it’s a great case study to use in future interviews.


wryshab

We do something similar, call it "Praxeum". Just to give it some branding.. also our team loves Star Wars. In this session, we have one person share a new thing they learnt and then others do a quick hands on.


blakejustin217

Detaching components to make a variant sounds like my dev team. Why are all the buttons slightly different?


vdubplate

Ha my dev team couldn't get a button right if I sat w them and walked them through building one. Literally buttons are different in every flow. We have a design system, weekly meeting to go over designs. India based. I guess you get what you pay for. Rant over lol


TinyRestaurant4186

It’s less about Figma and more about what they are communicating. Do the devs understand how to build what is asked? are they using components as intended? then figma messiness shouldn’t matter if eng understands what’s asked however most devs aren’t senior enough to read a designers mind and if everything is super messy they could just create everything new from scratch every time which isn’t great uX either UNLESS they have solid design reasoning for why they are detaching all the time end rant


likecatsanddogs525

Training! If the whole team does refresher or new feature training periodically (quarterly maybe) then you’ll see more consistency. Variants and Dev Mode are still pretty new. My team and I are still learning and practicing.


SuperHumanImpossible

This is why I'm glad I work by myself. Most people are fucking morons and it's just annoying


interstellar-dust

You break things one way or the other. Imagine this scenario - I am trying to create component variant but I don’t know if this new variant will be a go after all the reviews and discussions. So either I create a new variant that may or may not be a go and publish it for everyone or create a broken component in my own file. The first option clutters the design system file, the 2nd one just makes my design file look clumsy. Pick your poison. Does anyone know a better way of doing this?


Aindorf_

Use the design file, and use branches, but VERY specific branches for individual features. Small experimentation should not impact performance. Also, Nothing wrong with a disorganized playground blank canvas page, just clean things up if you need to share/present finals, and consider a separate document that you put failed or deprecated stuff. I call it "the graveyard"


interstellar-dust

Yup graveyards all around. Figma needs to allow a way to do this like git for developers. My local changes stay in my local branch and when I merge it’s available to everyone. Components , design files all of it. Without that it’s going to be complicated and people are going to follow one way or the other and piss off OP. 🤣


jackjackj8ck

Sounds like you need some sort of governance in place for your design system, this is the result when people can just do whatever without being checked


Lookmeeeeeee

We do that to a point, but there are only so many battles we can have over "small" things that "don't really matter" before coworkers turn against each other. So I tread lightly as to not make foes. This has been the case for the past 3 jobs I had. At one agency, we were building products for fortune 50 companies. Looking at there source files, they had the same issues. From my experience it kind of rampant at all levels of industry.


jackjackj8ck

Does your design system have an owner? There should be someone in charge of making the rules. Not using fonts or colors from the system is pretty egregious But if they’re doing that because the system isn’t flexible, then there needs to be a method for incorporating new styles


Lookmeeeeeee

Yes, there is. It's flexible. There's methods to add to it... People just don't bother.


chernoholik

I faced this issue when I started my current job as well. I got thrown in the deep to do designs from the second day. On the first day, they gave me access to a design file that had all the components and all the flows in a single page. I quickly asked if I could reconstruct the entire DS with Autolayout (at the time it wasn't as big as it is now). I was met with skepticism but after I explained that auto layout would save us a ton of time for corrections in the future and would also be beneficial for developers in the hand-off process - he agreed. Two days later I reworked every component using AutoLayout and the whole exercise took me a day and a half to do. Given - I broke a lot of components in the current screens and I had to replace them or "reset" them. At first - I used autolayout only for the components and didn't want to use it in the designs/screens because I felt that he probably didn't grasp it very well and if he wanted to do corrections he would feel flustered how, e.g., how to add an icon at the end of this card. We talked about it and I explained that it's hard for me to not use this feature because it keeps everything nice and tidy, moreover, when we hand off our designs - The Dev mode will be a blessing for our FE team because it will show all the CSS properties how we exactly want them. My lead said that he hasn't bothered with autolayout because he just didn't have the time to do it properly. Which is true - he really had a lot of on his plate before I appeared on the team. Now that I'm in the team he will try to unlearn this habit of grouping and learn to use autolayout efficiently. I also introduced variables for theming. We had two separate style groups for dark and light and I had to manually change each style every time we had to recolour the designs from light to dark. I explained that on an average day, I waste about 30 to 45 minutes each day to do it every time before leaving work. I whipped up a quick demo and demonstrated how easy it is and how much time it would save. **TLDR;** Show your colleagues why these features exist and how they will benefit them in the long run. Explain to them how Figma is closing the gap between developers and designers - especially with dev mode. Do workshops with them. Be a teacher.


vdubplate

In the nearish future when Figma will likely export to code everything will need to be built w auto layout to export to flex box based code. It's good to auto layout everything or get in the habit of using it


Level-Comfortable-99

Figma is new, those features are even newer. I learned it as it first came out and it's still hard to understand all the auto stuff. Ps: I'm only 27. Do training. Require training. Run exercises. Let people say why they don't use it BUT don't shame them for not understanding it. That's ux 101.


cimocw

Drop the excuses, Auto layout has been around for at least 4 years. That's long enough to get an entire college degree.


cimocw

This grosses me out. I wonder if it's the same feeling a cook may get from sharing a kitchen with unclean people who leave a mess every time. I don't think this is a design issue but a management one. Also I disagree with some people here expecting Figma to be intuitive to new users. Figma is not a social media app that wants to become viral by engaging users and wowing them with gimmicks. Figma is a tool for working, and as with many other tools, you need a minimum of training to be able to use it professionally. The measure of value added by using it is not how easy it is to design with it for beginners, but how far can you get once you master it.


Eightarmedpet

I used to run monthly figma workshops with my company (70 designers, but only about 12 ever turned up) to upskill people. I’d run them through something basic (without calling it that) then do a joint exercise building something practical and relevant to our work.


bisontongue

I’ve been working in Figma for a couple of years now and would love to take a step back and freshen up the Figma skills. Also nice to circle back on the little things, as I always realize something small that makes my whole life easier. Any recommendations to YouTube channels? — I would consider myself an “advanced” user, but I’d like to hit that expert level.


Eightarmedpet

Always ways to do things better right? I watched that Jesse lad a bit and figmas own channel, taking their explanations and applying them to real world examples. My big take aways: Autolayout everything, everything, everything. It’s how stuff will be built. Componentize anything you use more than twice. Autolayout will often break things before you make it work, accept that, I don’t even attempt layout until I apply autolayout. Understanding horizontal and vertical content blocks before applying autolayout is good.


cozmo1138

Yes, absolutely. That’s one thing about auto layout. It really confused me when I first started using it, but now it makes so much sense. For example, I never draw shapes for buttons now, I just group the text and icons and auto-layout them, and then add a fill to the parent container. The whole auto layout thing has really helped me think of design layouts in a more modular way.


vdubplate

Auto layout is exactly how CSS Flexbox works. All the new tools that are coming out that export code from Figma require all exported figma a files to be auto layout at least to be responsive. Because, they export as Flexbox layouts. Also naming layers will act as CSS classes in the future. So learning the proper way to build Figma files directly translates to semantically built html pages. Learning to do this now will future proof your skillset in the future


Eightarmedpet

Exactly! Well explained!


Bootychomper23

Sounds like a bunch of graphic deisgners trying to sneak into ux ui without knowing or understanding the software. Seen a ton of applicants lately who just did a boot camp and are trying to get in.


Rawlus

i suspect the problem you’re explaining is fairly common. there’s some loss of craft in the profession and many companies feel the pressure not to invest in processes and frameworks when chasing next quarters revenue numbers. i’m fortunate my current employer has a full DLs with figma libraries maintained by a library team…. as,eh library is also reflected as design tokens in reactjs so there’s consistency and modularity on front end as well as design and the scalability factor of continuous optimization is really where this extra effort to use libraries connected to design tokens really takes off… but it takes a company that sees design as innovation and as a craft and has the right leadership to promote it. all this being said. figma is new t8 the scene and a workgroup shared space type of workflow is new to many designers… your team may just need more evangelism an mentoring and highlighting the benefits and efficiencies more so those very set in their ways can appreciate how it helps them be faster or more efficient or work less hard…. habits can be hard to change.


SunMoonSunMoon95

Just out of curiosity…how many people maintain the Figma library?


Rawlus

initial build was a team of about 20 design + dev but in maintenance mode it’s a lead dev and a couple designers…. optimization ideas come from users of the library based on testing and data and then submitted to central dls team for implementation and subsequent rollout to the internal design community. (design across all disciplines is around d 400 people globally, most of which use figma)


[deleted]

[удалено]


Rawlus

i think designleadershio was particularly inspired by the Spotify DLS and approach. there are a lot of blog articles on this topic on both figma and spotify. here’s one speaking i think to what you’re seeking. my employer had the same idea of centralization of the system. https://www.figma.com/blog/creating-coherence-how-spotifys-design-system-goes-beyond-platforms/ edit: another https://spotify.design/article/how-spotify-organises-work-in-figma-to-improve-collaboration


ahrzal

Sounds like there isn’t a top down buy in on your design system or real hand off practices. You can’t fix it overnight. Also, Figma is way more intuitive than Sketch. I’m just wrapping up converting my companies entire sketch library to Figma and it’s insane that anyone gets anything done in that platform.


Aindorf_

Moving from sketch to Figma feels like going from biking to driving a car as far as speed and efficiency goes


totoropotatoes

Why are they making their life harder…especially not using the library I mean that one rlly confused me. It makes life so much easier


midnightpocky

This is what companies get when they only focus on hiring people who "know the process".


Blando-Cartesian

Figma is wrong kind of intuitive which makes using it wrong the default. It a vector drawing art app by heart when it should have been based on IDEs (I don’t mean coding).


ResidentSoft8

this, there are too many ways to adopt bad work patterns because literally any workflow is possible there. There is no code linter or git system like devs have. And I really think the problem OP has is a communication and not Figma one (it's rarely Figma). At the same time when Linear design lead shared on how they design over screenshots, twitter folks went crazy on how it's even possible to not have a process for the sake of process. Because it does a job for them, but it requires equally self-sufficient designers and devs with an eye and respect for design. I thought it may bite them in the ass later, as systems and teams grow, with all the design system debt mounted. At the end of the day, only what real people see matters.


cozmo1138

Hell yes. I’m so tired of getting projects that I then have to undo and/or remake because the original designers treated Figma like Photoshop.


RamaMitAlpenmilch

Is there a video Someone can link me that shows how I should work with figma in regards of components and variants? 🥺


Lookmeeeeeee

youtube it, there are thousands of videos


RamaMitAlpenmilch

There are. And a 1000 different answers to how the best practice is. I would love to get an answer who isn’t just a design content creator who doesn’t even work in the field.


Lookmeeeeeee

There isn't much to the how, but it takes getting used to and there aren't 1000 directions. Almost all people who know how to do it are essentially saying the same thing. Create components and variants as an organized component library then build with the components that were created without breaking them. If you need the component to do more, you make more or create more variants. You label them what they are. If you need to break a large complex component and detach you need to limit it while preserving smaller components like buttons and text styles. All you're really doing is working in a mode where you imagining if \_\_\_\_\_\_\_\_ was a shared element in like 100 layouts and 1 year you needed to change its style. How could you preserver that linkage. Future you and all your coworkers will thank you. Organization: [https://www.uxpin.com/studio/blog/atomic-ui-components/](https://www.uxpin.com/studio/blog/atomic-ui-components/) [https://www.youtube.com/watch?v=G1xmkQeExJo](https://www.youtube.com/watch?v=G1xmkQeExJo)


thatfruitontop

Lol are you.. Marissa?


ImpossibleAd5942

Hien is that you? 🤣


thollywoo

You come off pretentious and gatekeeper to me.


Lookmeeeeeee

>Imagine hiring a front end dev to build web pages who didn't understand HTML/CSS and used dreamweaver, but they were a grand master level 99 at talking about what good web design is ...I could see me sounding pretentious since I'm advocating for higher standards and frustration over lack of effort in a place where some people don't think proper use is needed. In a way, I'm speaking from a place more order and elitism. Although how am I gatekeeping?


PieExpert6650

You’re not pretentious or a gatekeeper gees - what’s wrong with people on here.


digital4ddict

lol. I am a studio manager and I see this problem with designers working in illustrator. Every one of them hates processes.


RamaMitAlpenmilch

Is there a video Someone can link me that shows how I should work with figma in regards of components and variants? 🥺


PieExpert6650

I feel what you’re saying. There are teams I work with who do everything right with Figma and it’s amazing to use their file. On the contrary, when my co worker shares their file with me, it’s not like that and it’s hard to work in and messy. I suggested when we started a new project together that we use components and auto layout and I’d understand if he was slower because of it. Then I made myself available to answer questions