Back when I was still in middle school, I started to watch a lot of Japanese animated shows and heard about a website that could help create a list to organize what I had watched, read and create reviews, and score such shows. What caught my interest more about this site is that you could customize your list page by using HTML and CSS. This is where I first started to learn about UI design. After learning that I could design a list with HTML and CSS, I went straight to websites that teach you how to learn the languages for free. The outcome was about a week of learning the basics and funnily enough, never applied it to the list. I did not do so because I got intimidated by the amount of CSS that you can potentially do and gave up in the end. Even though I wasn’t able to apply what I had learned from 1 week of free tutorials on how to use basic HTML and CSS, I was able to understand a bit of text formatting for sites that allow you to do so like Reddit or Stack Overflow. Regardless of how I used the basic knowledge I had, I enjoyed learning in the end.
Years have passed since learning the basics of HTML and CSS, and surprisingly I was still able to remember HTML at its basic form, but for CSS, I have completely forgotten everything. Either way, coming into a software engineering course, I did not think I would be coming back to HTML and CSS. My initial thoughts coming into the week that I get to learn HTML and CSS again was that it was going to be easy for the most part, which it was. The problem was that I understand the basics if told how to implement them step-by-step, but I don’t have such a creative mind when it comes to UI. This is especially true if you were to see me play games where they allow you to customize your UI and my UI doesn’t look nice, but is personalized to be functional and easy to look at for me and it may look messy to most people as it may look out of place or random. Either way, coming into the practice WOD’s and Semantic UI after the tutorials of the first week, I knew I was in big trouble.
After completing the tutorials for HTML and CSS in the first week that it was introduced, I had practice WOD’s, which were designed to help improve your programming ability under time pressure. These practice WOD’s weren’t too bad, but I could tell that I’m not that good with UI design just from how slow I was performing these WOD’s. For pretty much all of the practice WOD’s in the first week, and actually the second week as well, I could not finish them within the expected time that the professor wanted them to be done. This was the case due to me always going back to the tutorials and references. When the second week came around with learning Semantic UI, I think I got hit with a serious wall. The practice WOD’s that utilized Semantic UI can have so many ways of customization that it honestly overwhelmed me. This was especially true for the WOD where I had to decide a website I would re-create with Semantic UI, and all I want to say is that it felt terrible. This website took me about 5-6 hours to re-create, but realistically speaking, this WOD took me longer than what I had just mentioned. I say this because I actually had another website decided prior to the one I submitted, but the website I had chosen previously proved to be too difficult with how the interactions inside the site worked. In the end, I think I improved a lot since learning HTML and CSS again alongside Semantic UI, but definitely not a guru because of the amount of properties and variations that can be done. There is no one right way I believe to design a website.
Funnily enough, after going through the process of learning HTML and CSS again with Semantic UI, I think I might actually go back to that one site that allows you to create a list for Japanese animated shows that you can organize and try to design it and see how it turns out. The two weeks of what I would say grueling pain feels like it’s paying off a bit as I start to understand more about UI design overall and want to apply it to sites I use that allow you to customize your profile or something similar with HTML and/or CSS. I may not be a complete guru in the future with UI design, but I want to at least have enough knowledge that I can feel satisfied with personalizing something like my shows list.