Creative Mode vs. Correct Mode
I am usually superior creatively in Photoshop but better at being correct in HTML & CSS. I have a propensity to try outlandish ideas on the Photoshop canvas, knowing my actions have few repercussions, whereas when I’m coding, I’m sometimes fearful of not being able to revert to a point when everything was “working.” Most designers I know operate this way, although a rare few are just as creative in code as they are in Photoshop.
As responsive web designers, we need to be “correct” in our execution of code, but we also need to be able to vet our ideas adequately. I’m just not sure we can do both in a single environment.
When I first set out to design in the browser, I assumed that because it had similar tools to Photoshop, I’d be able to explore creative ideas in the same way. I could not have been more wrong. Not only were my designs looking less distinctive and considered, but the amount of time I was spending on them increased significantly. I’d sit for hours in CSS just trying one thing, reverting, trying another approach, and never really nailing it.
This is where direct manipulation makes all the difference. Code abstracts design by a layer of syntax. Instead of choosing position, size, and color by dragging or stretching, we use letters and numbers to assign a value. By no means is the latter approach objectively wrong, but the former feels right for many of us. If you come from a print background, you most likely agree that this abstraction hinders your ability to ideate.
The more I’ve thought about this abstraction, the more I’ve been able to attribute it to one significant concern: following the path of least resistance.