A Functional Framework for Frustration and User Friendliness

21 Feb 2019

A powerhouse of customization

While code can “look pretty” to programmers, it looks like gibberish to those outside the field and creating a well-designed user interface is important to let the user know what’s actually going on. Here is where we have HTML and CSS, two incredibly powerful tools to make a clean looking and intuitive UI if used properly. It’s not impossible to format a website to the exact specifications that you want using HTML and CSS but there are tools that make this process easier and faster. This is where UI Frameworks come in, such as Semantic UI, that allow programmers to create responsive, clean, and highly customizable interfaces. These frameworks can take away the stress of designing intricate structures for your UI since somebody else has already done if for you.

The learning curve of design

Can you make a pretty UI using raw HTML and CSS? Will using a UI Framework make development faster and give you more options? Is learning a UI Framework frustrating since there are so many things to learn on top of the cascade of options that already exist in HTML and CSS? The answer to all these questions is a resounding yes. UI Frameworks are extremely powerful if they’re used by the right programmer but in the hands of somebody who is just trying to learn HTML and CSS for the first time (like myself, for example) it’s like giving a motorcycle to a toddler. They can barely reach the handlebars nor control where it’s going and they can’t even balance on a regular bike yet.

In summary…

It’s not impossible to learn and while it can be frustrating, mastering how to use UI Frameworks can open up a lot of different options. I briefly mentioned Semantic UI earlier in this post and using it just makes sense since its entire structure (obviously) semantic. You want three columns of equal width?

<div class="ui three column grid container">

Boom! You want a menu bar without a border at the top of your page?

<div class="ui borderless topmenu menu">

It’s that easy. Of course, to an advanced user of Semantic UI, I’m praising some pretty simple features but I’m still learning how to ride this bike and I’m just excited that I could get down the street without crashing.