Introducing Our Web UI Framework

03/11/2021

After over a year of ideation, learning, design, and preseverance, without any external motivations whatsoever, we are introducing our web UI framework.

In case you missed it, our original plan for 2020 was to revamp NET-Slides, our presentation authoring software for the web. We made a non-interactive concept UI (see its homepage) to showcase what it would've looked and felt like if completed. We then halted the project due to circumstances already mentioned previously, but were nevertheless left impressed with our work. So we decided to design a UI framework based on it.

A UI framework facilitates the construction of a UI. This can be achieved in many ways: from boilerplates to utilities.

This framework has a design language of its own. The conventional flat design language is an icon of the contemporary culture which I personally loathe, and that it has a few usability issues. Rather, our design emphasizes on flat accents and unbalanced highlights, which we see as an extreme modification of the flat design with heavy inspirations from popular late-90s graphical desktop environments. While it grants some uniqueness, we acknowledge that this style might not appeal to some people.

This framework is universal, lightweight, and works with most sizes from the iPhone 5 or SE. It offers 20 styles of form fields, optimized for either desktop- or mobile-class applications, though they all work for both. It doesn't rely on JavaScript, external libraries, resources, and even development utilities.

Technically speaking, it's not really a UI framework but actually a CSS UI framework. It comes with a bundle of CSS stylesheets rather than a complete suite, so applications would have to follow some document structure in order to utilize it. Finally, the stylesheets aren't portable; their class names populate the global namespace. This is because they're part of NET, which is what EDEN Online is built on. So applications would have to be built on NET in order to utilize our web UI framework. If public interest persists, we may mitigate over these issues.

Built on NET technology, we decided to name it Unagi, an abbreviation of Universal NET Application Graphical Interface. You can read more about Unagi and view its demonstration at EDEN Online, the link to Unagi's homepage can be found in its Projects page.

Naturally, we tried Unagi on one of our web applications. Thus, we'd like to announce an update to J-Card Template, our printable in-browser template for cassette tape J-cards. For Update 1 Revision 5, it's UI has been redone with Unagi, making it the first web application to do so. Of course, J-Card Template represents one of many possible use cases for Unagi. As a reminder, its homepage can be found at EDEN Online under NET Services.