UI for Dummies

21 Feb 2019

If there is one thing that backend developers hate more than anything, it’s the User-Interface (UI). For some reason, we have the mindset that if the command line works for us, it works for you too. Sadly, that is just not a reality, so how does an artistically impaired backend developer, like me, produce a visually appealing UI? Enter UI frameworks.

What is a UI Framework?

A UI framework is a set of tools for building, you guessed it, a UI. Although there are UI frameworks for many programming languages, most of them are related to web applications, which is going to be the focus of this article. UI frameworks do a lot of the heavy lifting for you; they can take a website that looks like it came straight out of the 90’s and quickly turn it into something that’s visually appealing and responsive, which is useful for the ever-growing number of mobile users.

Semantic UI

After going through HTML and CSS in my software engineering class, we were introduced to Semantic UI. Although this is not the first UI framework I have worked with, it was probably the easiest one to use out of the gate. The ease of use comes from its class naming convention, which is similar to written English. Let’s say that you wanted a big red button, the class in Semantic UI would be “ui big red button”, whereas in other frameworks the class would be less intuitive, such as in Bootstrap, “btn btn-danger btn-lg”. After only one week, I can already make a reasonably good-looking website in under half an hour, including features such as dropdown menus, grids and columns for content separation, responsive images and layouts, etc. To complete the same website in only HTML and CSS would take several hours.

UI Frameworks for Everyone!?!?

I say no; although there are many benefits to using UI frameworks, there are a lot of down sides as well. Unless you are using a UI framework every day, you are going to be referring to the framework’s documentation often; how is that different than looking though CSS documentation? One issue I had with Semantic UI was centering, something that you think would be easy, is anything but; after a few failed attempts, even after referencing their documentation, I gave up trying to get it to work with Semantic UI and quickly wrote the CSS.

All in all, I think that UI frameworks are useful for certain situations, it’s hard to argue with how fast and easy it is to make a decent website. There is a reason that front-end developers haven’t been replaced by UI frameworks yet, no amount of Semantic-fu can turn a decent website into a great website.