Today, in my journey of relearning web development, I am diving into the world of web front-end layout and style. I wanted to create a minimalist design with a modern, no-frills look. But here's the thing—the initial starter kit I chose was like a fireworks show on steroids for my current skill level. It turned out to be a bit too overwhelming and made it super tricky to customize the site to my liking. I felt like I was lost in a maze without a map! I ditched the fancy starter kit and took on the challenge of building the layout from scratch. Starting fresh gave me the opportunity to truly grasp how all the elements worked together and make the design truly my own.
I Have Style—Sort of
Did I mention I'm not an artist? I opted for a simplistic design for various reasons, and that's the main one. To help me with styling, I chose theme-ui—a tool that keeps things organized and allows for defining reusable styles using a concept in UX called constraint-based design. Once I got the hang of it, updating properties and watching the UI change in real time was fun. Fonts, colors, and positioning within containers all came together well.
Graphics
I decided to try out some new AI tools—Looka and PhotoLeap to help me with graphics. They are both pretty cool pieces of tech. The only thing I ended up using was a basic app icon that shows up in my the browser tab and a profile icon in the upper right corner of the page. I guess this was better than a straight picture of myself and copying images from the internet. This made me better appreciate that graphics is a whole world on its own if a project requires graphics.
Blog post written by Chad with the assistance of ChatGPT.