As promised, I said I’d give some updates on my learning UI/UX design…. and I have a few thoughts on the issue. Don’t expect this to be coherent.. It’s not.
First off, I spent some time looking at courses on the subject and quickly realized I don’t have 20 weeks to dedicate to this, so I’m just going to have to do it on my own, just the way I’d have done it in grad school: find a reference, and beat my head on it as much as possible. So, after some digging, I settled on this: https://hackdesign.org/lessons101
Each lesson seems to take a couple of hours, and I’ve managed to get through the first 5. Beware, like grad school, you’re only going get out of it what you take the time to learn. Design appears to be something that takes a lot of practice.
The first lesson is pretty abstract – it mostly focuses on the idea that design and web coding are separate skill sets. Given that I’m lacking in both, that doesn’t bother me – I’m here to acquire both! More troublesome, though is the insistence that both be done separately. Given that I’m a one-man-full-stack-developer on all of my current projects, there’s no real arms length possible.. so I’m just going to have to do the best I can. Mostly, that means drawing things out on paper, and then abandoning those plans as I work out what I can actually accomplish with my limited CSS/JS coding skills.
The next few lessons, focusing on the basics, were pretty useful. I skipped some of the tutorials on the tools of design. Yes, I can use a pen and paper because I’m not going to be showing my lousy designs to a panel of judges, so I haven’t worried too much about that part. However, the sections on typography and layouts were fascinating.
Typography, after reading several essays on the subject, is entirely subjective. I can summarize it as this: If it makes your page readable and clean looking, you’re doing well. Don’t go overboard with more than 2 fonts, don’t pick fonts that don’t do what you want, and don’t try to use CSS/HTML to make fonts do things they weren’t designed to do. The take away message is just that you just have to go by what you think looks ok.
Considering that I previously just used the default fonts for everything, though, that’s already a good lesson for me.
The real take away from all of this was the section on responsive UI’s. I didn’t know that was a thing: basically, you use CSS to allow your page to seamlessly resize itself as you grow or shrink the window. Trivial, you might say, but it was eye opening to me. I didn’t know that was possible – and I didn’t know that there are frameworks and pre-built CSS/HTML examples of that. It completely changed the way I thought about layouts.
In fact, so much so, that I have started practicing with it already. As a demo workspace, I’ve been templating up a replacement for my fejes.ca domain. What’s there now is 1997 technology. Hopefully in a day or two, I can apply what I’ve learned for a revamp. I don’t know how that’ll go, but it’s a great place to start learning.
If you were expecting a conclusion, however, I’m going to have to disappoint you. After 10 hours of delving into HTML/CSS/JS today, I’m still blindly flailing around. I have much to learn, but at least I can say that I have successfully applied the lessons in the first 5 chapters of the design tutorial. On the bright side, I only have another 45 chapters still to go!