
Show HN: GuiLite – Tiny UI framework, runs on MCU without OS - zorro_young
https://github.com/idea4good/GuiLite
======
pasta
The examples of GuiLite and those of Littlevgi (posted in this thread) all
look a little outdated and messy.

And I can understand this. Most programmers aren't designers.

But if you know why it looks outdated and messy it can help to create better
looking products.

The reasons are: lack of alignment and padding / font sizes all over the
place.

To make your product look good there are simple tricks you can use:

    
    
      * Only use one size of padding (and multiplications of it).
      * Align your items horizontal and vertical.
      * Try to use one font family and maybe only 3 font sizes.
    

The above is why frameworks like Bootstrap work. They are all about alignment
and consistent use of space.

~~~
methyl
One more sin I would add here would be using too little paddings in general.
If you have enough space, try to double (or 1.5x) all of them and you will
probably see an improvement.

~~~
pasta
True. A good minimum might be 0.5 * normal font size.

------
nickjj
I like to see projects like this pop up because it's so easy to fall into a
trap of accepting input latency that other more bloated UI frameworks bring.

As we all know, Electron is really bad in this department but it's not limited
to Electron.

I recently installed native Linux and the problem exists there too. Gnome
terminal has a MASSIVE amount of input latency compared to xterm. Even worse
than the difference between Electron and any non-Electron app in Windows.

I wish more people embraced and went all-in with UI frameworks that were
optimized for reduced latency. IMO reduced / low latency input is the most
important feature for a terminal or code editor.

~~~
mixmastamyk
Interesting, I definitely believe you after reading Dan Luu's posts a year or
so ago on keyboard and terminal latency.

However I use mate terminal every day and it feels like it responds
instantaneously, even over a USB keyboard connected to a dock connected to a
laptop.

Maybe as long as the latency is below a certain threshold it is no longer
noticeable.

~~~
nickjj
It's a tricky thing to perceive because there's a lot of variables at play.

A lot of LCD monitors have 50-75ms of input lag. That means you don't even see
what you type until 75ms afterwards so you might not even have a chance to see
how a low latency application behaves. Then on top of that, there's the human
factor. Some people are just more sensitive to this sort of thing.

The monitor I use happens to have about 13ms of input lag (verified with
camera tests) which is pretty much as good as you can ask for with an IPS
panel. I wrote all about picking monitors for programming at
[https://nickjanetakis.com/blog/how-to-pick-a-good-monitor-
fo...](https://nickjanetakis.com/blog/how-to-pick-a-good-monitor-for-software-
development).

The difference is night and day when typing in an application that's not
efficient vs one that is. Even typing in this comment box on HN feels like I'm
typing in mud because Chrome's input lag is horrendous compared to xterm, WSL
Ubuntu terminal or any other application that doesn't have a million layers of
UI framework abstractions piled on.

If you're curious, one of the developers from the WSL Ubuntu terminal went
into great detail on why their terminal is so fast. It's at
[https://github.com/Microsoft/console/issues/327](https://github.com/Microsoft/console/issues/327).

The sad thing is, I've opened high input latency issues to a number of other
terminals and the author of those terminals often come back saying "nah, your
computer must be broken, otherwise everyone would be complaining" even after I
supply them video proof. I guess that's what happens when you live in a world
where everyone has low end monitors and are used to using Electron apps all
day.

~~~
raphlinus
The best way to measure end-to-end latency is an Arduino with a light sensor,
with the Arduino programatically injecting USB events. I made an Amazon
shopping list[1] a year ago. I hope to rework my code and post a blog soon.

[1]
[https://www.amazon.com/ideas/amzn1.account.AGSZP5AWBGH7772O3...](https://www.amazon.com/ideas/amzn1.account.AGSZP5AWBGH7772O35NTI7RN3JLQ/2LZEHRCO3YHSZ)

~~~
nickjj
If you're into this sort of thing I recommend reading this article:
[http://www.tftcentral.co.uk/articles/input_lag.htm](http://www.tftcentral.co.uk/articles/input_lag.htm)

It goes into a lot of depth on input lag and how to measure it accurately. The
site also happens to have recorded input lag numbers for hundreds of monitors.

In the article it mentions using photo sensors and oscilloscopes as the best
way to get a reading but they settle on using a special type of stopwatch test
that gets results that are nearly the same.

------
iveqy
So this is a framework to X? Framebuffer? Wayland? Everything? How does this
software fit into all other software out there?

~~~
janoc
It is for embedded development - e.g. your car radio or washing machine. You
wouldn't use this for desktop.

BTW, it is written right there in the title "runs on MCU ..." (MCU =
microcontroller)

------
black_puppydog
anybody else find the JS on the site they host their demo video on weird?
uMatrix shows stuff being loaded from 127.0.0.1. Not a web person, so I'm
confused...

------
wingerlang
The multi language example for Thai looks like it is rendering wrongly.

Proper rendering: ความสูง

~~~
raphlinus
This is actually a super-interesting problem. The complex scripts require
"shaping", which increasingly is done by HarfBuzz. Companies used to maintain
their own proprietary implementations, but that's increasingly not a good
idea. A problem is that HarfBuzz is a large, complex piece of software,
entirely because OpenType is complex and not well specified (there are a ton
of edge cases).

I did some research a few years ago on defining shaping by composing several
simple finite state machines together, and am confident it could be made to
work. The problem is, it doesn't work with existing fonts, the rules for
shaping would have to be redone. But for fonts shipping in an embedded device,
this would be entirely practical, and would be a lot faster and a lot less
code than a solution based on HarfBuzz.

I'd need some incentive to complete this research. If someone wants to pay for
it, please get in touch.

~~~
mikeday
What about compiling existing OpenType fonts to state machines in combination
with the shaping rules? That's something we're thinking about for our Rust
implementation :)

~~~
raphlinus
It's not as easy as it looks, but probably can be done. The research I was
doing was very much pure transducers, but with a couple of twists (the one I'm
proudest of is alternating between forward and backward passes, which makes
certain things like matra reordering much easier). There is some work in this
space by Monotype as well.

------
pjmlp
Looks quite nice.

~~~
zorro_young
Thanks

------
hk-mars
bad design

~~~
maslam
Please refrain from unconstructive comments! How would you make the design
better?

------
btashton
If you are looking for something that will run on even smaller embedded
devices I highly recommend LittlevGL. I have used it to throw a UI on a few
projects, and found it to be surprisingly easy to get going, and fairly
responsive long as you can run it in buffered mode.

[https://littlevgl.com](https://littlevgl.com)

~~~
squarefoot
Thanks, this one also supports the Esp32, which is great.

------
zorro_young
The demo has a Chinese name: 天女散花(means: fairy scatter blossoms)

------
tluyben2
Seems very interesting; nice work for sure. Any chance of a browser port?

~~~
zorro_young
Yes, we have. You can build & run
GuiLiteSamples\HostMonitor\BuildWinCmd\WinCmd.sln

You will find the UI be displayed in your browser.

