6 ms·

No Figma, I won't fit in your little box

deleted 1y ago
[deleted]
Arainach 1y ago
This is just an ad that doesn't even describe what their proposed solution is. "We don't like Figma. We don't like designers and developers being split. So we built and are selling.... Another tool for mocking UI designs"?
- dmix 1y ago
  Having worked with Figmas from pure UI-designers that translation to HTML/CSS is not at all as straightforward as they like to pretend. I don't know about this startup's product but based on their homepage having (real) HTML/CSS output as a core part of the creation process would have helped me many times. Designers need to be constrained. Expecting designers to know how to build production websites in html/css/js before designing is apparently a step people skip over these days. It creates meaningless design and dev cycles + tons of extra approval meetings by marketing/execs.
  - marcosdumay 1y ago
    It always bothered me that people got in the trouble of making a web-app, that generates designs, and those designs are not plain web pages. I guess one could create a really good tool where UI designers make a real web reusable pattern language, and UX designers specialize them into a set of templates the software developers can actually apply.
    - robenkleene 1y ago
      > It always bothered me that people got in the trouble of making a web-app, that generates designs, and those designs are not plain web pages. Figma isn't a web app in the traditional sense of the word, it's a C++ app with a WebAssembly compile target. https://www.figma.com/blog/webassembly-cut-figmas-load-time-by-3x/ https://www.figma.com/blog/webassembly-cut-figmas-load-time-... E.g., it's more similar to how Adobe Illustrator and other C++ graphics programs render content than it is how a web browser engine renders HTML and CSS.
      - fragmede 1y ago
        That's an implementation details and doesn't answer the higher level product incongruency. Tool A, used to design for technology B, doesn't output files in technology B format. It's fine to point out that Tool a uses technology C under the hood, but that's the tail wagging the dog, and doesn't make sense, even if there's an explanation for it.
        robenkleene 1y ago
        Sure, but I was interpreting the parent comment as implying the underlying technology was important to the output format: > people got in the trouble of making a web-app [...] and those designs are not plain web pages.
        robenkleene 1y ago
        To address your point specifically though, Webflow is (at least from my perspective) the inevitable result of the line of thinking you're pursuing. So I'd be curious what you think of Figma vs. Webflow, and why those two products have their relative market positions. I.e., "Tool A, used to design for technology B, doesn't output files in technology B format. [...] doesn't make much sense". E.g., why not just use Webflow then? From my understanding, that's what it does, that's what it's made for.
        fragmede 1y ago
        Figma got where they are because their collaboration features are Google docs level. They also got enterprise buy-in, and target design more broadly than simply website building. (As far I understand. I'm not a professional designer.)
        robenkleene 1y ago
        > Figma got where they are because their collaboration features are Google docs level. I’d argue Figma got where they are mainly by streamlining the handoff process, not because of their live editing collaboration features per se. But there isn’t really an empirical way to validate this. But my point is really if you want to export natively to the web, just use, promote, etc... WebFlow that's the tool designed for that job. > [Figma targets] design more broadly than simply website building. This is absolutely true, but I’d argue it’s impossible to be able to both target many platforms, and simultaneously be able to export to all those platforms natively. I.e., you have to build the constraints of a specific platform into your tool in order to export to that format. This is what WebFlow is (and using it for just 5 minutes makes clear the trade-offs of designing a tool like that).
- ludicrousdispla 1y ago
  My first and last experience with Figma was that it required a user to import existing designs in order to do anything useful, such as 'share them with the team' . I was surprised at that given its hype as a design tool but then realized the name must have been carefully chosen. I will definitely be checking Nordcraft out.
  - AndreasMoeller 1y ago
    Thanks! It is a very different tool than Figma. In Nordcraft designers and developers work together in the same tool.
- AndreasMoeller 1y ago
  https://nordcraft.com https://nordcraft.com
bippihippi1 1y ago
can you use css in the design tool? a designer needs to learn some way of specifying layout and interactivity so it might as well be css
- AndreasMoeller 1y ago
  Yes. Nordcraft is based on HTML and CSS. You can either use the style panel or switch to css view if you prefer.
agedclock 1y ago
> Once upon a time, design and code worked as one. Web designers would imagine beautiful designs and turn them into beautiful websites with HTML and CSS. This was never the case and in fact a rewriting of history. My first "proper" job in web development was taking a PSD from a designer and turning that into a XHTML template. Quite a lot of the time the designs looked nice in Photoshop but were almost impossible to implement (at least in CSS 2). I've worked in several since then and most were using Photoshop to create designs or design guidelines to pass over the developers. I used to "cut up the design" and then implement into XHTML template and controls. This was pretty much the norm everywhere if the company cared about how the website / webapp looked. There were some frontend designer types that would write code, but I've met actually two of them during my career as a dev that was heavily front-end focused until 2023.
- XenophileJKO 1y ago
  Well it was certainly true in many places. I was doing both roles designing and coding. I even had the title of "Webmaster" at the time. I had to do work in Photoshop (or usually Macromedia Fireworks), and then code it up in Cold Fusion.
- mcny 1y ago
  You are a better person than me. I would have taken the PSD, export as jpeg, add some alt text and slap that as the web page
  - thehappypm 1y ago
    And don’t forget to stretch the aspect ratio while you’re at it
  - pavlov 1y ago
    That's how we used to do it with the <map> element back in 1995 and the Netscape 2.0 days... And of course that abomination of a HTML tag still works: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/map https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/...
etchalon 1y ago
What the hell is this article talking about? Designers used to hand development teams PSD files. Or Illustrator files. Or, in the golden times, Fireworks files. Designers rarely handed us CSS and markup. ... did this person just start in the industry like three years ago?
- AndreasMoeller 1y ago
  No quite the opposite. I have been around for a long time :) It used to be completely normal for companies to have developers who worked in php or ruby on rails and have designers take care of the css. You are absolutely right that in the early days many UI designers came from graphic design and worked in photoshop. But the fact that they also existed in some companies isn't really relevant.
makeitdouble 1y ago
The problem as described: > Designers would go into a design team and draw user interfaces. Developers would go into a dev team and write code. And thus, the hand-off was born. Which is exactly what Figma solves and why it's so valuable. Figma is the place where the UX team and dev team meet and discuss, specify design and behavior together through back and forth, and helps the dev team move from there with exactly what they need. Nordcraft might want to be the next Figma, as it's apparently a lucrative position provided you execute incredibly and capture most of the market. But how they describe it they're not properly assessing or representing any of the current reality. I kinda wonder what it would need to achieve to be significantly different from Figma. Perhaps if it was actually a whole production runtime where designers define front layers and the dev team codes binds them to a backend ? Basically a WordPress competitor ?
- dmix 1y ago
  The Figma as a design space works better when the designers understand that constraints of HTML/CSS/JS animations. That's not often the case in reality (unless you hire around that idea). I find many Figma designs basically force you to use fancy JS to assemble their UI designs. I know everyone uses React these days but you really shouldn't have to constantly write JS just to reproduce what's in a UI design. It creates so much needless dev and browser overhead.
  - makeitdouble 1y ago
    Reading the other threads as well, I got the feeling it's more a culture or process problem than tooling per se. The excessively fancy UI issue can be avoided if the devs enter the process at the prototyping phase. And Figma can be used for that: start with a wirefame and get everyone's input, comments, or even let the devs make counterpropositions (basically MRs?) by tweaking a copy of whatever screens are worked on. And as the design gets closer to reality the back and forth can continue in Figma. That requires team collaboration and the willingness to build decent HTML/CSS in the first place, none of which are a given, but for teams working at that level it's a boon.
    - 1y ago
Hexigonz 1y ago
As others have pointed out, this should have been a showHN, but the article is vague enough that it wouldn't have garnered attention as a showHN. Furthermore, the post inflates the problems of design handoff to try and sell a no code editor environment. Yes, I'm aware that the platform enables coding capabilities, but plenty of no code tools can. If you want to get into the shortcomings of Figma when it comes to hand off, I'm more than happy to have that conversation. Units that aren't valid in the CSS spec? Sure. Vector tools leading to things that are only achievable through clip path and masking? You bet. But claiming that designers and developers should have the same job when they're completely different skill sets and claiming that both roles are using the wrong tools to get the job done is no way to sell your product.
- AndreasMoeller 1y ago
  It literally says in the showHN rules that blog posts are off topic. I don't think they can be more clear than that.
croisillon 1y ago
i wonder why it's so hard to find that they are based in Denmark if half their name is based on that ; sounds like an interesting project!
- AndreasMoeller 1y ago
  It didn't feel like it was the most important information for the website, but maybe it should be It is on our LinkedIn profile
zenethian 1y ago
How does this compare to something like Storybook?
- AndreasMoeller 1y ago
  Nordcraft is for building the whole frontend. Instead of trying to fix the handoff, designers and developers work in the same tool.
exodust 1y ago
I didn't notice at first but it's one of those "blog post ads", concluding with "it's time". Time for what? To click the "open app" button? Okay, so I clicked. It doesn't open app. A button labelled "open app" should do what's on the tin. Instead it prompts for sign-up with terms and conditions warnings. I'm out. Just open the app without sign-in! Why not? Too hard? Too scary? You can haggle for sign-up later. Let's see what you have right now, under the button labelled with a promise that I expect you to keep. Lying to me on page one is not a good start. Here's an example of a web app that does it right. The button "start using Photopea" isn't a lie: https://www.photopea.com/ https://www.photopea.com/
- AndreasMoeller 1y ago
  Thank you for the feedback. You can try Nordcraft without signing up by going to one of our examples: https://nordcraft.com/built-with-nordcraft https://nordcraft.com/built-with-nordcraft
  - exodust 1y ago
    Ok good, I'm checking out the CSS clock demo. Looks interesting, although I'm probably not the target audience, I'd just code it normally. I may revisit and see what else it can do.
asnyder 1y ago
Seems to be missing quite a bit of history. As many here mention, there was an entire ecosystem of tools to convert PSDs to HTML such as CSSHat, Engima64, etc., and its evolution into Avocode, Sketch, Zeplin, Invision Craft & Inspect, and other preview/prototyping/inspect/export tools. Eventually all roads led to Figma somehow, which honestly I would've never expected. Still surprised Figma became Sketch before Sketch could become Figma.
- AndreasMoeller 1y ago
  Yes I left out a lot to keep it short and to the point. There has been many attempts at solving the handoff and none of them has been effective. The solution is to get rid of the design handoff all together. Instead of designing user interfaces in vector drawing tools we need web design tools.
p2hari 1y ago
Like all the comments below, a show HN should have been the norm, but they knew that would not get any clicks and this. However, I do not understand their pricing. If nordcraft's ppl are here, please tell me how does it work. For open source, you say there is a limit of 20k requests? . But I can always download the code/web-components and deploy anywhere I want right? Then even enterprise can do that? I do not understand it. Also it is Apache License 2.0. I can host it on my own cloud. Are there some restrictions if I do that?
- AndreasMoeller 1y ago
  Not according to their rules: https://news.ycombinator.com/showhn.html https://news.ycombinator.com/showhn.html
tehwebguy 1y ago
Figma is pretty great but the lack of a minimap / navigator pane is glaring!
- AndreasMoeller 1y ago
  Figma is a great tool. We use it all the time for all sorts of things, just not web design.
dangus 1y ago
The solution to some big industry problem that sticks is almost never a closed product that you buy from a vendor.
- AndreasMoeller 1y ago
  Absolutely agree. That is why we are working on making the Nordcraft editor open source and we write blog posts like this to hope to get more people to see that we need better tools. If you are just one tool are not going to have meainingful change.
  - dangus 1y ago
    Okay, there’s no “working on” open sourcing your app. You could just open source it. What you really mean is that you’re looking into how you can open source just enough to create a free-to-paid entrapment pathway. You’ll do open source if you can provide a product where all of your users eventually hit a wall and need to upgrade to a paid plan. A more honest answer from you would have been “we are just looking to provide a solution” rather than pretending to be working on a true open tooling ecosystem. Don’t pretend to be open source as in Linux or git when you’re really open source as in MongoDB or Chef Software.
    - AndreasMoeller 1y ago
      the editor is currently closely coupled to our hosting platform which is built on top of cloudflare. we want the open source version to be independant of that
simulator5g 1y ago
Figma balls

deleted 1y ago

[deleted]

This is just an ad that doesn't even describe what their proposed solution is. "We don't like Figma. We don't like designers and developers being split. So we built and are selling.... Another tool for mocking UI designs"?

dmix 1y ago
Having worked with Figmas from pure UI-designers that translation to HTML/CSS is not at all as straightforward as they like to pretend. I don't know about this startup's product but based on their homepage having (real) HTML/CSS output as a core part of the creation process would have helped me many times. Designers need to be constrained. Expecting designers to know how to build production websites in html/css/js before designing is apparently a step people skip over these days. It creates meaningless design and dev cycles + tons of extra approval meetings by marketing/execs.
- marcosdumay 1y ago
  It always bothered me that people got in the trouble of making a web-app, that generates designs, and those designs are not plain web pages. I guess one could create a really good tool where UI designers make a real web reusable pattern language, and UX designers specialize them into a set of templates the software developers can actually apply.
  - robenkleene 1y ago
    > It always bothered me that people got in the trouble of making a web-app, that generates designs, and those designs are not plain web pages. Figma isn't a web app in the traditional sense of the word, it's a C++ app with a WebAssembly compile target. https://www.figma.com/blog/webassembly-cut-figmas-load-time-by-3x/ https://www.figma.com/blog/webassembly-cut-figmas-load-time-... E.g., it's more similar to how Adobe Illustrator and other C++ graphics programs render content than it is how a web browser engine renders HTML and CSS.
    - fragmede 1y ago
      That's an implementation details and doesn't answer the higher level product incongruency. Tool A, used to design for technology B, doesn't output files in technology B format. It's fine to point out that Tool a uses technology C under the hood, but that's the tail wagging the dog, and doesn't make sense, even if there's an explanation for it.
      - robenkleene 1y ago
        Sure, but I was interpreting the parent comment as implying the underlying technology was important to the output format: > people got in the trouble of making a web-app [...] and those designs are not plain web pages.
      - robenkleene 1y ago
        To address your point specifically though, Webflow is (at least from my perspective) the inevitable result of the line of thinking you're pursuing. So I'd be curious what you think of Figma vs. Webflow, and why those two products have their relative market positions. I.e., "Tool A, used to design for technology B, doesn't output files in technology B format. [...] doesn't make much sense". E.g., why not just use Webflow then? From my understanding, that's what it does, that's what it's made for.
        fragmede 1y ago
        Figma got where they are because their collaboration features are Google docs level. They also got enterprise buy-in, and target design more broadly than simply website building. (As far I understand. I'm not a professional designer.)
        robenkleene 1y ago
        > Figma got where they are because their collaboration features are Google docs level. I’d argue Figma got where they are mainly by streamlining the handoff process, not because of their live editing collaboration features per se. But there isn’t really an empirical way to validate this. But my point is really if you want to export natively to the web, just use, promote, etc... WebFlow that's the tool designed for that job. > [Figma targets] design more broadly than simply website building. This is absolutely true, but I’d argue it’s impossible to be able to both target many platforms, and simultaneously be able to export to all those platforms natively. I.e., you have to build the constraints of a specific platform into your tool in order to export to that format. This is what WebFlow is (and using it for just 5 minutes makes clear the trade-offs of designing a tool like that).
ludicrousdispla 1y ago
My first and last experience with Figma was that it required a user to import existing designs in order to do anything useful, such as 'share them with the team' . I was surprised at that given its hype as a design tool but then realized the name must have been carefully chosen. I will definitely be checking Nordcraft out.
- AndreasMoeller 1y ago
  Thanks! It is a very different tool than Figma. In Nordcraft designers and developers work together in the same tool.
AndreasMoeller 1y ago
https://nordcraft.com https://nordcraft.com

bippihippi1 1y ago

can you use css in the design tool? a designer needs to learn some way of specifying layout and interactivity so it might as well be css

AndreasMoeller 1y ago
Yes. Nordcraft is based on HTML and CSS. You can either use the style panel or switch to css view if you prefer.

agedclock 1y ago

> Once upon a time, design and code worked as one. Web designers would imagine beautiful designs and turn them into beautiful websites with HTML and CSS. This was never the case and in fact a rewriting of history. My first "proper" job in web development was taking a PSD from a designer and turning that into a XHTML template. Quite a lot of the time the designs looked nice in Photoshop but were almost impossible to implement (at least in CSS 2). I've worked in several since then and most were using Photoshop to create designs or design guidelines to pass over the developers. I used to "cut up the design" and then implement into XHTML template and controls. This was pretty much the norm everywhere if the company cared about how the website / webapp looked. There were some frontend designer types that would write code, but I've met actually two of them during my career as a dev that was heavily front-end focused until 2023.

XenophileJKO 1y ago
Well it was certainly true in many places. I was doing both roles designing and coding. I even had the title of "Webmaster" at the time. I had to do work in Photoshop (or usually Macromedia Fireworks), and then code it up in Cold Fusion.
mcny 1y ago
You are a better person than me. I would have taken the PSD, export as jpeg, add some alt text and slap that as the web page
- thehappypm 1y ago
  And don’t forget to stretch the aspect ratio while you’re at it
- pavlov 1y ago
  That's how we used to do it with the <map> element back in 1995 and the Netscape 2.0 days... And of course that abomination of a HTML tag still works: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/map https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/...

etchalon 1y ago

What the hell is this article talking about? Designers used to hand development teams PSD files. Or Illustrator files. Or, in the golden times, Fireworks files. Designers rarely handed us CSS and markup. ... did this person just start in the industry like three years ago?

AndreasMoeller 1y ago
No quite the opposite. I have been around for a long time :) It used to be completely normal for companies to have developers who worked in php or ruby on rails and have designers take care of the css. You are absolutely right that in the early days many UI designers came from graphic design and worked in photoshop. But the fact that they also existed in some companies isn't really relevant.

makeitdouble 1y ago

The problem as described: > Designers would go into a design team and draw user interfaces. Developers would go into a dev team and write code. And thus, the hand-off was born. Which is exactly what Figma solves and why it's so valuable. Figma is the place where the UX team and dev team meet and discuss, specify design and behavior together through back and forth, and helps the dev team move from there with exactly what they need. Nordcraft might want to be the next Figma, as it's apparently a lucrative position provided you execute incredibly and capture most of the market. But how they describe it they're not properly assessing or representing any of the current reality. I kinda wonder what it would need to achieve to be significantly different from Figma. Perhaps if it was actually a whole production runtime where designers define front layers and the dev team codes binds them to a backend ? Basically a WordPress competitor ?

dmix 1y ago
The Figma as a design space works better when the designers understand that constraints of HTML/CSS/JS animations. That's not often the case in reality (unless you hire around that idea). I find many Figma designs basically force you to use fancy JS to assemble their UI designs. I know everyone uses React these days but you really shouldn't have to constantly write JS just to reproduce what's in a UI design. It creates so much needless dev and browser overhead.
- makeitdouble 1y ago
  Reading the other threads as well, I got the feeling it's more a culture or process problem than tooling per se. The excessively fancy UI issue can be avoided if the devs enter the process at the prototyping phase. And Figma can be used for that: start with a wirefame and get everyone's input, comments, or even let the devs make counterpropositions (basically MRs?) by tweaking a copy of whatever screens are worked on. And as the design gets closer to reality the back and forth can continue in Figma. That requires team collaboration and the willingness to build decent HTML/CSS in the first place, none of which are a given, but for teams working at that level it's a boon.
  - 1y ago

Hexigonz 1y ago

As others have pointed out, this should have been a showHN, but the article is vague enough that it wouldn't have garnered attention as a showHN. Furthermore, the post inflates the problems of design handoff to try and sell a no code editor environment. Yes, I'm aware that the platform enables coding capabilities, but plenty of no code tools can. If you want to get into the shortcomings of Figma when it comes to hand off, I'm more than happy to have that conversation. Units that aren't valid in the CSS spec? Sure. Vector tools leading to things that are only achievable through clip path and masking? You bet. But claiming that designers and developers should have the same job when they're completely different skill sets and claiming that both roles are using the wrong tools to get the job done is no way to sell your product.

AndreasMoeller 1y ago
It literally says in the showHN rules that blog posts are off topic. I don't think they can be more clear than that.

croisillon 1y ago

i wonder why it's so hard to find that they are based in Denmark if half their name is based on that ; sounds like an interesting project!

AndreasMoeller 1y ago
It didn't feel like it was the most important information for the website, but maybe it should be It is on our LinkedIn profile

zenethian 1y ago

How does this compare to something like Storybook?

AndreasMoeller 1y ago
Nordcraft is for building the whole frontend. Instead of trying to fix the handoff, designers and developers work in the same tool.

exodust 1y ago

I didn't notice at first but it's one of those "blog post ads", concluding with "it's time". Time for what? To click the "open app" button? Okay, so I clicked. It doesn't open app. A button labelled "open app" should do what's on the tin. Instead it prompts for sign-up with terms and conditions warnings. I'm out. Just open the app without sign-in! Why not? Too hard? Too scary? You can haggle for sign-up later. Let's see what you have right now, under the button labelled with a promise that I expect you to keep. Lying to me on page one is not a good start. Here's an example of a web app that does it right. The button "start using Photopea" isn't a lie: https://www.photopea.com/ https://www.photopea.com/

AndreasMoeller 1y ago
Thank you for the feedback. You can try Nordcraft without signing up by going to one of our examples: https://nordcraft.com/built-with-nordcraft https://nordcraft.com/built-with-nordcraft
- exodust 1y ago
  Ok good, I'm checking out the CSS clock demo. Looks interesting, although I'm probably not the target audience, I'd just code it normally. I may revisit and see what else it can do.

asnyder 1y ago

Seems to be missing quite a bit of history. As many here mention, there was an entire ecosystem of tools to convert PSDs to HTML such as CSSHat, Engima64, etc., and its evolution into Avocode, Sketch, Zeplin, Invision Craft & Inspect, and other preview/prototyping/inspect/export tools. Eventually all roads led to Figma somehow, which honestly I would've never expected. Still surprised Figma became Sketch before Sketch could become Figma.

AndreasMoeller 1y ago
Yes I left out a lot to keep it short and to the point. There has been many attempts at solving the handoff and none of them has been effective. The solution is to get rid of the design handoff all together. Instead of designing user interfaces in vector drawing tools we need web design tools.

p2hari 1y ago

Like all the comments below, a show HN should have been the norm, but they knew that would not get any clicks and this. However, I do not understand their pricing. If nordcraft's ppl are here, please tell me how does it work. For open source, you say there is a limit of 20k requests? . But I can always download the code/web-components and deploy anywhere I want right? Then even enterprise can do that? I do not understand it. Also it is Apache License 2.0. I can host it on my own cloud. Are there some restrictions if I do that?

AndreasMoeller 1y ago
Not according to their rules: https://news.ycombinator.com/showhn.html https://news.ycombinator.com/showhn.html

tehwebguy 1y ago

Figma is pretty great but the lack of a minimap / navigator pane is glaring!

AndreasMoeller 1y ago
Figma is a great tool. We use it all the time for all sorts of things, just not web design.

dangus 1y ago

The solution to some big industry problem that sticks is almost never a closed product that you buy from a vendor.

AndreasMoeller 1y ago
Absolutely agree. That is why we are working on making the Nordcraft editor open source and we write blog posts like this to hope to get more people to see that we need better tools. If you are just one tool are not going to have meainingful change.
- dangus 1y ago
  Okay, there’s no “working on” open sourcing your app. You could just open source it. What you really mean is that you’re looking into how you can open source just enough to create a free-to-paid entrapment pathway. You’ll do open source if you can provide a product where all of your users eventually hit a wall and need to upgrade to a paid plan. A more honest answer from you would have been “we are just looking to provide a solution” rather than pretending to be working on a true open tooling ecosystem. Don’t pretend to be open source as in Linux or git when you’re really open source as in MongoDB or Chef Software.
  - AndreasMoeller 1y ago
    the editor is currently closely coupled to our hosting platform which is built on top of cloudflare. we want the open source version to be independant of that

simulator5g 1y ago

Figma balls