Live data from Hacker News

Show HN: Don't code your UI, draw it

github.com

101–110 of 148 posts

Re: Show HN: Don't code your UI, draw it

#101
post #36

Maybe I am not a UI designer but I much prefer rule based approaches than drawing. Rule based means I tell use instruction like "this button must be on top on that button horizontally centered", "this label must fit that text", "this image must be between this and that", etc... and let the layout engine deal with it. UIs are usually not paintings, window sizes vary, text length changes with localization, decorations…

This is basically how designing ios/osx apps in xCode works. You set a bunch of constraints that are relative to one another. You can also specify what type of screen those constraints will work on (like iphone vs ipad screens) and portrait / landscape. I find it quite pleasant once you get used to it.

It is (or at least was) all based on Cassowary: https://en.wikipedia.org/wiki/Cassowary_(software)

Re: Show HN: Don't code your UI, draw it

#102
post #36

Maybe I am not a UI designer but I much prefer rule based approaches than drawing. Rule based means I tell use instruction like "this button must be on top on that button horizontally centered", "this label must fit that text", "this image must be between this and that", etc... and let the layout engine deal with it. UIs are usually not paintings, window sizes vary, text length changes with localization, decorations…

That sounds a bit like CAD actually, where they let you set properties on various dimensions and auto-fit/organize everything else according to that.

Re: Show HN: Don't code your UI, draw it

#103
post #65

Earlier quoted context omitted.

It really is disappointing how modern web GUI environments are harder to use than what was around 20+ years ago. Yes. We had drag and drop UIs decades ago. Now you can't even get a decent GUI program for laying out a web page. CSS/Javascript got so messy that even Dreamweaver became useless. Part of the problem is that ad code requires a messy environment, so that ad blockers and click generators have a hard time. Go…

> Yes. We had drag and drop UIs decades ago. We had _simple_ drag and drop UIs decades ago. Computers operated within a lot more limited constructs back then. UI windows didn't resize, or it was reasonable to expect that they're fixed. How did those drag and drop tools back then handle creating a UI for screens ranging from 400pt wide to 2560pt wide?

> UI windows didn't resize, or it was reasonable to expect that they're fixed.

This isn't true at all. The original Mac in 1984 had resizable windows for most apps. Most other WIMP GUIs followed suit.

Re: Show HN: Don't code your UI, draw it

#104

Codeless UI is so exciting! This reminds me of Ivan Sutherland's Sketchpad from the early 60s https://en.wikipedia.org/wiki/Sketchpad

Don't get excited. The thing that this demo shows in minutes could've been typed up in text in seconds . It is not a productive way to do things. There's a reason that these systems never catched on, they are unnecessary. You may say, but "non-programmers" will use it! No, they won't. Designers will use real design tools to create (non-functional) visual designs. Programmers will bring those visual designs to functio…

Yo - I did the Airbnb project linked ^^^ which I believe was the first of this wave of deep learning-powered sketch->UI projects (though standing on the shoulders of decades of R&D projects)

Our take was that we really do design on paper or whiteboard first & foremost, which is why our project emphasized the webcam + sharpie thing rather than drawing in-browser etc.

Here's a related thing I wrote about the need for design tools to design the real thing, rather than facsimiles of the thing: https://jon.gold/2017/08/dragging-rectangles/ - so so so much process waste is because developers have to re-implement static pictures of designs.

In our case, we didn't get buy-in to keep developing the project, but I'm kinda jazzed that so many people are running with the idea

Re: Show HN: Don't code your UI, draw it

#105

For my whole life I've been "drawing" real GUIs and writing the logic code, not GUI code then. It started with VisualBasic 1.0 for DOS, then there were different versions of VisualBasic for Windows, then Borland C++ Builder and Delphi (I was using the former), then NetBeans Swing designer and WinForms designer in VisualStudio. And now building a GUI is such a problem that a huge number of almost-useless (I really pre…

Agreed. Sometimes I could use a simple website and compared to Winforms or VB it's really hard these days.

I think if someone finds the right sweet spot between extensibility and ease-of-use for web apps they could make a killing. Something similar to what VB did for the desktop.

Re: Show HN: Don't code your UI, draw it

#106
post #65
post #59

Earlier quoted context omitted.

It really is disappointing how modern web GUI environments are harder to use than what was around 20+ years ago. There are still Visual Basic Apps from the 1990s floating around in large corporations and in government. Users who were expert in the process but not expert developers could easily code up tools to their exact specifications. https://en.wikipedia.org/wiki/Visual_Basic#1990s Admittedly the deployment of we…

It really is disappointing how modern web GUI environments are harder to use than what was around 20+ years ago. Yes. We had drag and drop UIs decades ago. Now you can't even get a decent GUI program for laying out a web page. CSS/Javascript got so messy that even Dreamweaver became useless. Part of the problem is that ad code requires a messy environment, so that ad blockers and click generators have a hard time. Go…

Part of the problem is that ad code requires a messy environment, so that ad blockers and click generators have a hard time. Google, by policy, does not permit you to put their ads in a iframe, where they belong. You can't even put Google Hostile Code Loader ("tag manager") in an iframe sandbox.

I believe the proper term for this is "Well there's your problem.". That sort of antisocial behavior is what caused the issue in the first place and rather than solve this by being civil enough to the user that they don't try to block everything they double down on the untrustworthiness and act /even more/ malicious.

Re: Show HN: Don't code your UI, draw it

#107
post #36

Maybe I am not a UI designer but I much prefer rule based approaches than drawing. Rule based means I tell use instruction like "this button must be on top on that button horizontally centered", "this label must fit that text", "this image must be between this and that", etc... and let the layout engine deal with it. UIs are usually not paintings, window sizes vary, text length changes with localization, decorations…

Totally agree. You have to be able to model the relationships between controls. WPF is actually quite good about that.

Re: Show HN: Don't code your UI, draw it

#108
post #65
post #59

Earlier quoted context omitted.

It really is disappointing how modern web GUI environments are harder to use than what was around 20+ years ago. There are still Visual Basic Apps from the 1990s floating around in large corporations and in government. Users who were expert in the process but not expert developers could easily code up tools to their exact specifications. https://en.wikipedia.org/wiki/Visual_Basic#1990s Admittedly the deployment of we…

It really is disappointing how modern web GUI environments are harder to use than what was around 20+ years ago. Yes. We had drag and drop UIs decades ago. Now you can't even get a decent GUI program for laying out a web page. CSS/Javascript got so messy that even Dreamweaver became useless. Part of the problem is that ad code requires a messy environment, so that ad blockers and click generators have a hard time. Go…

Then you are overusing CSS and JavaScript. It is not needing so much to put. And then, just use a pure text editor you can write the HTML codes.

Re: Show HN: Don't code your UI, draw it

#109
post #91

Earlier quoted context omitted.

I'm confused as to how having a common target to have _any_ language, including C, running on the web makes tooling easier rather than harder.

The idea would be that WASM will facilitate a particular language with a good standard library would be used to create an easy to use GUI drawing and then coding setup. But yes, it wouldn't support every language that could compile to WASM and you're right that would be even harder than creating a good tool for Javascript.

Such "easy to use GUI drawing libraries" would still need to be written in javascript. If you want actual things to appear in the browser you still need to interact with the DOM, which is actually harder with WASM, not easier.

And while it's technically possible to say, just compile QT to wasm and give it a CANVAS tag as a dumb drawing surface, you've just broken accessibility, and that's a deal breaker.

Re: Show HN: Don't code your UI, draw it

#110

For my whole life I've been "drawing" real GUIs and writing the logic code, not GUI code then. It started with VisualBasic 1.0 for DOS, then there were different versions of VisualBasic for Windows, then Borland C++ Builder and Delphi (I was using the former), then NetBeans Swing designer and WinForms designer in VisualStudio. And now building a GUI is such a problem that a huge number of almost-useless (I really pre…

Just a note, C++ Builder, Delphi and it's open source counterpart - Lazarus (cross-platform) are still here and involving.
Post reply on HN