Live data from Hacker News

WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

webtui.ironclad.sh

21–30 of 159 posts

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#21
This looks awesome and we're fans of the TUI aesthetic at terminal trove (1) (we're biased), it's also great that WebTUI has keyboard shortcuts to go with it.

Not CSS but similarly ratzilla (2) also comes to mind, that allows you to build terminal-themed web applications with Rust and WebAssembly.

Check out the examples (3) they look great!

(1) https://terminaltrove.com/

(2) https://github.com/orhun/ratzilla

(3) https://github.com/orhun/ratzilla?tab=readme-ov-file#example...

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#22
I don't understand the obsession with 1980s terminals. They're even less powerful than the contemporary 8-bit home computers. It's perfectly OK to be a retro enthusiast, it's another thing to claim that this is the peak tech to power our modern CLIs, or a solid foundation for portable UIs.

From the docs:

    Stop thinking in standard CSS units like px, em, rem, %
    Start thinking in Character Cells for spacing, sizing, and positioning
A VT102 already has a character grid, but it needs a serial protocol to allow applications on the mainframe to talk to it. You can loop around this and use the raw mode to address individual cells.

The web browser has an insanely powerful typographic and layout engine. Now we're looping back into character cells. Something went wrong here, at least once.

That said, I like the aesthetic and the default color palette. It's quirky, but it has its places.

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#23

I'm terminally terminal, but I'll be honest, I'm a bit confused by this. If it is trying to be what I think it is, I * really* want this. But to be a bit blunt, it also feels a bit cargo-culty. To look like the thing but not be like the thing. I'm not saying this to discourage you, because if you are trying to make a web interface that I can fully use via keybindings then please for the love of god keep developing, I…

Do you know of any good resources that discuss TUI user interaction/research?

I'm working on a new project to build some simple workflow applications for business, and one of the aspects I would like to attempt to resolve is the speed of input. It is painful watching operators work with modern GUI inputs, particularly web based as the mouse work slows them down horrendously. And keyboard 'shortcuts' where they exist are often anything but, as the entire GUI model assumes a mouse (or on the web a Document) first.

It is like you mention about this CSS library, it kind of misses the point in that the awesomeness of TUI is not in the appearance, but rather how workflows that the constraints of a keyboard-first interface enforce allow creative and highly efficient solutions.

When all you have is a mouse everything becomes a click, and that is a horrible way to input data.

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#24
post #16

I am working on a pitch for an AI startup and need to create a nice looking webpage with the demo. I have very little experience with webdev and I wonder if it is a good idea to build a TUI-like interface, as I am a fan of terminal aesthetics in general. This would much relieve the burden of thinking about design and focus on the content.

Honestly I wouldn’t personally, I’d use a really good components library like https://mantine.dev/ (no affiliation, just a fan) and make your site look similar to your competitors. That’s what people seeing your pitch will expect IMO. Depending who you’re pitching to they might not use a terminal very often.

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#25
post #22

I don't understand the obsession with 1980s terminals. They're even less powerful than the contemporary 8-bit home computers. It's perfectly OK to be a retro enthusiast, it's another thing to claim that this is the peak tech to power our modern CLIs, or a solid foundation for portable UIs. From the docs: Stop thinking in standard CSS units like px, em, rem, % Start thinking in Character Cells for spacing, sizing, and…

I think they're just being funny, and if asked seriously they'll tell you that those words are only meant to hype up the project and not neat seriously (cells vs ems, %, px)

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#26
post #22

I don't understand the obsession with 1980s terminals. They're even less powerful than the contemporary 8-bit home computers. It's perfectly OK to be a retro enthusiast, it's another thing to claim that this is the peak tech to power our modern CLIs, or a solid foundation for portable UIs. From the docs: Stop thinking in standard CSS units like px, em, rem, % Start thinking in Character Cells for spacing, sizing, and…

And can we stop calling every stupid little hobby project "beautiful" while we're at it? The word has no meaning any more.

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#27

I'm not seeing any icons (on ios, tried a few browsers). Is the font (or svgs? Not at a computer to check how it's built) being served?

I'm also not seeing any icons (macOS, running Firefox). Tried it in safari and just get blank rectangles instead of the rectangles with a small hexcode(?) in FF.

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#28
post #23

I'm terminally terminal, but I'll be honest, I'm a bit confused by this. If it is trying to be what I think it is, I * really* want this. But to be a bit blunt, it also feels a bit cargo-culty. To look like the thing but not be like the thing. I'm not saying this to discourage you, because if you are trying to make a web interface that I can fully use via keybindings then please for the love of god keep developing, I…

Do you know of any good resources that discuss TUI user interaction/research? I'm working on a new project to build some simple workflow applications for business, and one of the aspects I would like to attempt to resolve is the speed of input. It is painful watching operators work with modern GUI inputs, particularly web based as the mouse work slows them down horrendously. And keyboard 'shortcuts' where they exist…

I don't, but I hope someone else does. I can speak the language but I doubt I could teach it.

People see the aesthetics and appreciate the beauty but the best way I can describe the problem is it's like trying to write poetry in a language you do not understand. You can get the rhythm and tone but it has no substance. The aesthetics are driven from the language, the way we play, the way we speak. There's something natural to this but only when you're fluent. The art is a reflection of us. It looks like something you pull from outside, a craft to hone, a monument to build; but it will always miss because it is an expression, a feeling, it comes from you.

I don't know how to describe it like a linguist would describe a poem. There's depth they see that I don't. I only know the feel, the way Sylvia Plath can make me feel but Su Shi never will. I can appreciate it from afar but it remains foreign. I do not know the language, the culture, the context, so I can only be a stranger as if looking through glass.

But I do know this. We programmers often fail to see when building and designing things. The Zen of it is to use your things the same way you use the grass under your feet or the air you breathe. It feels weird to call the ground a tool but you use it to move. I certainly do not have the right words but I hope the meaning is clear. The point is to build something that feels as natural as the air you breathe. A space to live in and makes you feel free. It's okay if this has to be learned but there's something more I don't know how to describe. It's like saying it's okay to learn a new language but recognizing that the concept of language itself is natural and part of us. Even without a language we still speak, there is a drive to make sound, to communicate, to express. It makes language inevitable yet as difficult to describe in detail as the beating of your own heart. It's just you

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#29
post #26
post #22

I don't understand the obsession with 1980s terminals. They're even less powerful than the contemporary 8-bit home computers. It's perfectly OK to be a retro enthusiast, it's another thing to claim that this is the peak tech to power our modern CLIs, or a solid foundation for portable UIs. From the docs: Stop thinking in standard CSS units like px, em, rem, % Start thinking in Character Cells for spacing, sizing, and…

And can we stop calling every stupid little hobby project "beautiful" while we're at it? The word has no meaning any more.

I find the usage of „i love x“ for x representing something inanimate you surely do not love far more unsettling..

Re: WebTUI – A CSS Library That Brings the Beauty of Terminal UIs to the Browser

#30
post #23

I'm terminally terminal, but I'll be honest, I'm a bit confused by this. If it is trying to be what I think it is, I * really* want this. But to be a bit blunt, it also feels a bit cargo-culty. To look like the thing but not be like the thing. I'm not saying this to discourage you, because if you are trying to make a web interface that I can fully use via keybindings then please for the love of god keep developing, I…

Do you know of any good resources that discuss TUI user interaction/research? I'm working on a new project to build some simple workflow applications for business, and one of the aspects I would like to attempt to resolve is the speed of input. It is painful watching operators work with modern GUI inputs, particularly web based as the mouse work slows them down horrendously. And keyboard 'shortcuts' where they exist…

But an editor is something where you navigate for a long time, whereas the average web page navigation is brief. In 99.99% of the cases, it doesn't make sense to attach a (complex) keyboard interface to it, and a specifically vim-like interface even less.

> When all you have is a mouse everything becomes a click, and that is a horrible way to input data.

Quite a few people access web pages via a table or phone. Touch is often easier than a mouse (not always, though), and can also outdo a keyboard.

I think web-based TUI is a very small niche. Large-scale data entry might be about the only place where it could work, but then you'd want a highly tailored, ergonomic, user-friendly interface.

Post reply on HN