Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Making Figma better for developers with Dev Mode

figma.com

Post reply on HN
Print view View original

191–200 of 238 posts

Re: Making Figma better for developers with Dev Mode

#191

Post by jjcm »

spacebacon wrote: post #182

A designer using Figma is equivalent to a developer using no code solutions. The design is compromised and potential to do something great is capped. I prefer an illustrator art board over Fisher Price my first UI apps. Wire-framing UX is best done with the freedom of a large art board to play in. Extra points if you design UI completely with vector. God mode if you build your own components.

Do you have an example of something you can’t do in Figma that you’d like to do for web design?

This is a strong statement, and I get the sense that you haven’t used the tool much, but I’m curious on your take here. For context, I’m the PM who owns component creation in Figma.

Re: Making Figma better for developers with Dev Mode

#192

Post by pbarnes_1 »

bgribble wrote: post #103

As a developer, the "one big bulletin board" visual model that Figma promotes is one of the worst steps backwards in UX I have ever had to deal with. I am constantly zooming in and out and scrolling around trying to find anything. I hate it so much.

Yup, it's absolutely horrible to use as a developer.

Re: Making Figma better for developers with Dev Mode

#193

Post by bunga-bunga »

zarzavat wrote: post #188
nateroling wrote: post #170

The problem with these kind of pixel-perfect, inspectable design tools, is that there's no distinction between important details and unimportant details. For example, if our app uses a letter-spacing of 1.2 for all the body text, and your Figma design uses a letter-spacing of 1.25, is that important? Or is that a mistake? In something like Figma, being consistent is difficult for designers. But in code, being consist…

When writing CSS for a Figma design, I first try to match the Figma as exactly as is reasonable, then I do a visual diff to make sure I haven’t missed any important details, then I clean up the CSS and relax some of the constraints until the (S)CSS is maintainable e.g. if I have padding of 19 and 21, lifting that out into a $padding: 20px constant.

Mockups are mockups, they’re suggestions. More often than not, sizes and spacing don’t match across views and it’s a waste of time to be “pixel perfect.”

Re: Making Figma better for developers with Dev Mode

#194

Post by jsncbt »

Hypothetically speaking, if all designers could code at the level of a Snr Front End Engineer, would Figma exist?

Just pretend that magically everybody knew how to code. Wouldn't designs just be done in the browser? No longer do you have to maintain these design artifacts post handover. There would be no unrealistic designs that do not consider the constraints of a browser window.

I know this is unrealistic but I often think about this.

Re: Making Figma better for developers with Dev Mode

#195

Post by seer »

nateroling wrote: post #170

The problem with these kind of pixel-perfect, inspectable design tools, is that there's no distinction between important details and unimportant details. For example, if our app uses a letter-spacing of 1.2 for all the body text, and your Figma design uses a letter-spacing of 1.25, is that important? Or is that a mistake? In something like Figma, being consistent is difficult for designers. But in code, being consist…

To be honest Figma gives plenty of tools to solve this problem. With various reusable components, font/color/sizing templates etc. Its reasonably easy to be extremely consistent with your measurements in figma, as long as designers spend the time to learn the tool, and not just use it like photoshop / illustrator.

Even resizability can be done quite well, allowing the designers to create reusable bits that stretch and squeeze to fit the needed space, and the way they deformed can be easily read (and verified!)

Re: Making Figma better for developers with Dev Mode

#196

Post by view »

theultdev wrote: post #112
theultdev wrote: post #110

Earlier quoted context omitted.

Just added support for the inspect panel and codegen to my React Native -> Figma plugin. You should see it in the From Community list or you can find it here: https://www.figma.com/community/plugin/821138713091291738

Figma -> React Native* Can't seem to edit my post. Feedback welcome btw.

That's awesome! Thanks for sharing. I'll definitely use that from now on, great work.

One thing I noticed after creating a simple button component was that it does not export the font family of the text within but that might be a Figma limitation.

Re: Making Figma better for developers with Dev Mode

#197

Post by novok »

nateroling wrote: post #170

The problem with these kind of pixel-perfect, inspectable design tools, is that there's no distinction between important details and unimportant details. For example, if our app uses a letter-spacing of 1.2 for all the body text, and your Figma design uses a letter-spacing of 1.25, is that important? Or is that a mistake? In something like Figma, being consistent is difficult for designers. But in code, being consist…

This is what a design system is about, you set up the standards of essentially an enum, give them names and say that if the designers want to change it or add something new, they need to add it to the design system. 14 point fonts becomes 'caption' size and so on.

Re: Making Figma better for developers with Dev Mode

#198

Post by sebazzz »

Akronymus wrote: post #125
bgribble wrote: post #103

As a developer, the "one big bulletin board" visual model that Figma promotes is one of the worst steps backwards in UX I have ever had to deal with. I am constantly zooming in and out and scrolling around trying to find anything. I hate it so much.

We use figma quite extensively as a reference for our current project. The disgners constantly move stuff around, so the links to them, in tasks, break and point to nothing. Which is a major pain in the ass indeed. So yeah, 100% agree that the "big bulletin approach" is a negative.

For this reason we use Zeplin, where designs are easily shared and versioned. For both developers and clients.

Re: Making Figma better for developers with Dev Mode

#199

Post by mejutoco »

the_mar wrote: post #162
drewbeck wrote: post #151

Earlier quoted context omitted.

I can for sure see how the 'big board' approach isn't good (and it looks like they're attending to this to some degree with the new Dev Mode features). I'm curious what handoff experience you had before that was better. Prior to Figma (as a designer) my workflows were always "send a PDF with designs, export some assets", which I imagine was non-standard, and not great, so I'm wondering what was improved for you befor…

I had a brief and horrific period of my life when I had to export assets for android at the weird android resolutions. I really don't understand why there isn't a better designer>developer hand off experience. It seems like Figma is trying with the CSS stuff and the layouts, but I don't think it quite works

In figma you set the export options for different layers (say png of x resolution, and svg), and you can export them all at once. Unless I am missing something, this should solve your problem.

Re: Making Figma better for developers with Dev Mode

#200

Post by mejutoco »

zackmorris wrote: post #114
bgribble wrote: post #103

As a developer, the "one big bulletin board" visual model that Figma promotes is one of the worst steps backwards in UX I have ever had to deal with. I am constantly zooming in and out and scrolling around trying to find anything. I hate it so much.

I rarely use Figma but wanted to add that your experience isn't universal. I maintain one giant notes.txt file which I treat as my mental palace, finding sections within it by searching for "# keyword". This allows me to work as a 10x or 100x developer by avoiding bookkeeping chores like categorizing my notes, so more like a search engine. Figma might be targeted at designers who want to work fast also. But I do agre…

You might like Obsidian. It fits this mental model very well, and is all local. I used to do exactly what you mention, and having a better interface now, but without lock in to a company has worked very well for me.
Post reply on HN