6 ms·
No, here’s the problem: Figma doesn’t go far enough. If you need a free form design tool to sketch, use one. There are hundreds of them. I need to implement m
by miiiiiike 1y ago
No, here’s the problem: Figma doesn’t go far enough.
If you need a free form design tool to sketch, use one. There are hundreds of them.
I need to implement my design system inside of a design tool so I can prototype designs with multiple breakpoints, container queries, modes, and variants. Figma isn’t up to the job. Ever tried opening the variables tab on the Material 3 Figma file? Stutter, stutter, stutter, “this tab is unresponsive”. You can barely view a long variable list, forget editing one with multiple modes. And, I hope your variable names aren’t too long, because you’re not going to be able to see them in most parts of the UI.
The problem with Figma isn’t that it’s too engineer-y for designers, the problem is that it’s too designer-y for engineers. I spent a month implementing my design system in Figma before giving up and just doing it in code. With Figma you run into all of the downsides of building the design system in code (deeply nested items breaking when you move/change something) but you get none of the advantages.
Figma is a mound of half-baked (vaguely web-like) ideas, poorly implemented. So many times I’ve had things just stop working with no way to figure out why. 99% of the time it’s just a bug and you have to reload the app.
If there’s something better than Figma out there, please, let me know. For now I’m sketching in Figma and building my design system with extensions to Style Dictionary.
- NewsaHackO 1y agoAre you saying thread product is laggy or your development process? If it's the latter, you sure youdont just need to update your computer?
- miiiiiike 1y agoNo. It's just not implemented in a way that would let it support a large design system, even on a 16-core machine with 128GB of RAM.
- PaulHoule 1y agoYep. Back in the 1990s there was a huge influx of people into web design who knew how to design for print at a "retail" level (design an ad or a poster) as opposed to a "wholesale" level (create a design system for a magazine) and as a dev I would frequently receive a PSD from a designer and figure out how to abuse the primitive HTML was had then to make something that looked like that. Today Figma has replaced PSD but the same pathologies remain. A new version of iOS comes out and the armchair quarterbacks want to go over the appearance pixel by pixel but they're not really interested in UX design in the sense of designing a sequence of interactions to attain a goal. As a dev, what I want from designers is design systems, guidance on what everything is supposed to look like that I can implement whatever I need to implement and have it look like a designer was involved. I blame the tools though less than I blame the designers who are just not inclined to think systematically. CSS was definitely designed to create design systems (css classes used in a disciplined way reflective of semantics) but tools like bootstrap, tailwind, Emotion, and the MUI theming system all represent regressions away from that ideal but I don't think those tools make bad designers, it's the other way around.
- bornfreddy 1y agoThis! It is bad enough that most designers think they are UX experts too (few of them are), but trying to micromanage devs so that every screen would be "pixel perfect" really takes the cake. Especially when the provided designs (that should be followed religiously) are missing core functionality and the whole flows. Just give me the guidelines please, and please please be consistent with them! Well, I'm sure they have their own set of gripes about the developers too. ;-)
- sfifs 1y agoSo one of my teams was struggling with Figma to work with users. Then someone had the bright idea to just prompt an LLM to generate code for the mock UI and made it happen in 2 days. Far better user experience.
- spookie 1y agoYeah... Just do pictures on the design phase and then code.
- miiiiiike 1y agoThere’s a lot that goes into creating the pictures. Consistent spacing, colors that change depending on platform, breakpoints, containers, and on and on and on. There’s no reason that a tool can’t model a design system and make producing consistent designs that use it trivial. I think the problem with Figma is that it tries to appeal to visual designers, UX designers, and programmers. Good for business, bad for users.
- immibis 1y agoDon't create every possible picture. Create a representative set. Draw each screen at least once. If you have dark mode, you don't have to fully redraw each screen in dark mode, just enough to show how dark mode should look. If it has to work on desktop, you probably do have a completely different desktop version of each screen (from the default mobile) so draw that - but don't redraw every detail of a widget that's identical to mobile. Testing every combination should be for the testing stage. It's good if you can foresee clashes (like the desktop version of this widget looks bad on this page in dark mode) in the design stage but it's not really an excuse to prolong the design so long that it lasts until you would have been finished with testing anyway. Having a computer generate all the combinations for you in the design stage isn't that great unless you can pay individual attention to them - there's no point producing artefacts that nobody looks at.
- brulard 1y agoI don't think you got the point. Instead of "pictures" we need a design system - defined sizes, paddings, margins, grids, font-sizes, colors, breakpoints, variants, components, behaviors, transitions, etc. and it should be consistent across the app. How many times have I worked with a design that didn't respect these consistently from page to page...
- danielvaughn 1y agoI’m actively working on an alternative right now. It’s a tool for designing in the browser, using HTML and CSS. Everything is parametric by design, including tokens. Eventually I’ll have a working end-to-end prototype together, but not yet unfortunately.
- desireco42 1y agoYeah we need that... and more HTML it is, the better.
- ThePatientTiger 1y agoThat would be awesome, Looking forward to it.
- danielvaughn 1y agoThanks, I can’t wait to showcase it on here. It’s frustrating because I can only work on it on nights and weekends, and my 15 month old daughter doesn’t make that any easier. I’m incredibly pumped for it, though. It’s almost entirely keyboard driven, kinda like Vim. I’m building this rich set of mnemonic commands to build/design UI components. It’s like Vim + Storybook + WebFlow.
- screye 1y agoIsn't this the problem with all no-code / low-code platforms ? Code is merely the leanest human-readable representation for loss-less specification of requirements. We're seeing this same pattern with 'K8s YAMLs' and 'prompt engineering'. There is an entire industry that's re-inventing new DSLs which inevitably converge to a scripting language as requirements get more complex. Instead of reinventing the abstraction, I'd like to see no-code UX patterns that losslessly map onto the underlying abstraction. That way you can use the UX pattern until it gets too tedious, and occasionally dip in-and-out of the code-view in a non-jarring manner. Graph UI for manipulating git trees (gitgraph) is a great example. Orchestration UI views (Airflow / Langraph) are another example that's getting there. At a higher level of abstraction, Notion (CRDT UIs) do a good job of representing collaboration-locks using blocks. At the highest view, I'm a big fan of how Gather-town represents remote collaboration. I'd like to see more of this.
- PaulHoule 1y agoFrom my viewpoint the benefit of low-code is that the average business application is a matter of people filling out forms. If you want to radically lower development time you have to solve all the problems https://worrydream.com/refs/Brooks_1986_-_No_Silver_Bullet.pdf https://worrydream.com/refs/Brooks_1986_-_No_Silver_Bullet.p... For instance, a 2025 no code platform is likely to have "one click" deployment of a cloud application. That's great if you can accept that but if you require "on prem" this is either disqualifying or requires you to build an environment on prem that can host whatever it is they generate, which could be more trouble than building an application the old fashioned way in an environment you already know how to run. A conventional analysis is that you should be able to generate a CRUD application out of a schema: you need a little bit more than something that looks at a SQL schema and creates a form to INSERT, UPDATE or DELETE, but that's a start. One problem is that people write schemas that suck despite there being a body of "commonsense knowledge" about how to the world works. I had a year when I fixed a tremendous number of broken applications and one insight I got out of that was that whether it was a student who went from being an applicant to being enrolled to being an alumni or a pallet that would live in a logistics network and then enter a "reverse logistics" network and be inspected and possibly repaired to be returned to the logistics network the same data model of an object going through a number of states with state transitions was general and much better than the 15+ date columns that were added haphazardly to those columns. Another example that kept turning up was that the ticket "1 phone number for a customer is not enough, support 2 phone numbers" is inevitably followed by "2 phone numbers is not enough, support 3 phone numbers" -- it saves time to work the proof by induction up front and just support N phone numbers up front. But talk that way and people think you're a lunatic like Doug Lenat. Deployment, code generation from schemas, and schema generation from meta-schemas are part of the solution but if you can't solve 100% now getting that last bit is ultra-hard mode because all the essential complexity hidden by the framework is suddenly in your face.
- smohare 1y ago[dead]
- raincole 1y ago> If you need a free form design tool to sketch, use one. There are hundreds of them. Before Figma, the norm of design tool was Photoshop, not the other "hundreds of them." So go back in time, if you had been Figma founder developing a tool that appeals to most designers, it should've looked more like Photoshop than like CSS/HTML.
- whywhywhywhy 1y agoFireworks also existed the whole time which had a lot of Figma's features but bizarrely was completely ignored by 95% of designers.
- Andrew_nenakhov 1y agoI used Fireworks a lot, and what amazed me at Sketch when I found it, is that they figured out every single thing that bothered me in Fireworks and did it right. At that period, Figma was mostly copying all the tiny clever innovations done by Sketch.
- silvershell 1y agoThere is the sketch app , which is older and more of a direct competitor to Figma. Figma won because of being web based/ multi platform among other advantages.
- cosmic_cheese 1y agoAs a dev that does a lot of his own design, I’ve never really understood the need to build a full fidelity reproduction of the layout systems a design is targeting. The limitations and considerations involved are deeply internalized and for the most part, I know exactly where designs tend to break and how to account for them. The layout system is effectively running in my head the entire time I’m mocking things up. So while it’s nice to have tools to help with menial bits like correct spacing, getting every little behavior right in the mockup feels a lot like unnecessary busywork. Naturally things are a bit different in a team setting, because it can’t be assumed that everybody involved has this level of knowledge/experience, but well… maybe it’s not crazy to expect designers to carry this set of skills, and it’s perhaps not a good thing for parties outside of design and engineering to be able to easily poke and prod at designs directly. Having the design team as a required intermediary helps sanity check changes.
- miiiiiike 1y agoI had my UX designer girlfriend read “CSS: The Definitive Guide” and it changed the way she looked at her job. She taught me Figma and it changed the way I look at my job, and hers. Learn as much as you can. Specialization is for insects.
- cosmic_cheese 1y agoI advocate for learning as much as possible as well. It comes naturally with being self-taught. That said I think it’s also worth zooming out and giving things a look through a critical eye to ensure that the things we’re learning are necessary and worthwhile. There are still a number of “old school” UI designers out there who’ve resisted trends and have staunchly stuck to a more traditional workflow, where they start out with a rough mockup made in e.g. Photoshop and then iterate the design alongside an engineer. It would be interesting to be in the room amidst a discussion between one of these traditionalists and a “new age” Figma-type UI designer.
- luckylion 1y agoWhat did you learn about Figma that changed how you think about your work?
- cryptozeus 1y agoI have totally opposite experience working on large ds at uber
- brulard 1y agoWould you elaborate?
- The5thElephant 1y agoExactly this. Thank you. We need a Blender-like design tool specifically for product design. Using HTML/CSS for rendering so it covers most web needs and that usually more than encompasses native app-layout emulation. Open source, technical, and not expected to be picked up in a day or fully understood top-to-bottom by everyone. The reason Figma is putting us into a design box is because it doesn't have all the CSS features that actually let you create incredible experiences.
- no_wizard 1y agoas much as folks hate electron, I think if Figma was electron, it would at least have the entire chromium web engine to work with
- The5thElephant 1y agoFigma on desktop is an Electron app I believe. Figma chose to build a custom webGL rendering engine for their design canvas, so the core issue is that technical decision early on (probably allowed for some better performance and multiplayer back then). Figma is stuck with wanting to control their rendering and allow for non-product stuff like Figjam or the new Draw tools, but it will inherently hold them back from providing a really good design/dev handoff and always will hold designers back because it doesn't use CSS web rendering.
- ThePatientTiger 1y ago"the problem is that it’s too designer-y for engineers" Exactly! Numerous times I have wanted to start a new personal project however got stuck in figma designing process. Had no other chance except writing in pure html/css - the only things that still "work" for me unlike those stupid frameworks.
- Vinnl 1y agoI haven't used it myself yet, from what I've heard, Penpot is closer to filling that gap? https://penpot.app https://penpot.app And it's free and open source.
- sghiassy 1y agoI think the authors point, is that, designers are incorrectly choosing the wrong tool. In my experience in FAANG, designers use Figma for everything. Like literally everything. So when you say, they should use a sketch tool when they need free form, they don’t
- carlosjobim 1y ago> If there’s something better than Figma out there, please, let me know. HTML+CSS works very nice for these mock-ups. Tried Figma and Sketch for a small project, never again.
- jason_plasmic 1y agoI'm late to reply, but check out Plasmic. We often get the complaint that we're too engineer-y instead of designer-y, so it might work for you.