CSS Zen Garden
See the project on GitHub, view it live, or read a blog post I wrote describing my process
Timeframe: 4 days
Project Description
In the world of web design, the CSS Zen Garden is like a rite of passage. It's a challenge to style a single page of HTML using only CSS. As a UI Design project, each student was assigned a different art movement to use as a theme for their design. I was assigned op art, whose foundation is optical illusions.
An assignment designed to stretch our coding skills, we were allowed to skip mockups if we wished, and design in browser. This project was especially fun for me, because I've seen CSS Zen Gardens designed by people I look up to, and this gave me an excuse to finally give it a go.
Challenges
The challenge for me on this project was trying to step outside my comfort zone. Having had prior experience with HTML and CSS before coming to The Iron Yard, I have a habit of designing what I know I can code. It's a practice that has pros and cons. In some ways it's good, because I usually don't spend too much time trying to figure out how to code something I designed. But it's also bad, because by only designing to my current capabilities I don't stretch myself to learn new techniques.
For this project, I tried to do something different. Op art is very different from my usual aesthetic, and I saw that as a good thing. I wanted to go crazy for once, design something without knowing for sure that I could do it, and figure it out later. I didn't want to let my current knowledge hold me back. Unfortunately, after spending quite a bit of time trying to figure out how to accomplish what I sketched, I eventually gave up and did something I knew I could complete by the deadline. That felt like a failure, because I compromised my vision to finish on time. But I suppose there's something to be said for knowing what your limitations are and when to ditch an idea that isn't working. Better to turn in a compromised version of what I originally planned, than nothing at all.
