My history is that I am self-taught. I come from a graphic design background creating print media using Quark, Photoshop and Illustrator. I am an expert using Photoshop and Illustrator, having worked in advertising and also working as a CD designer for Sony Music.
I got tired of buying new iterations of Photoshop. Each new version meant that I could no longer open other people’s newer files and there was never anything new that was worth the steep price. I started with Photoshop II and after thirty years the program still has the same onerous user interface.
What I liked about web design is that I don’t have to buy anything to work. I learned to type using TextEdit and for many years that’s how I worked. In a pinch I still jump onto TextEdit to stomp out a quick test or prototype.
The first bit of web development technology that I embraced was SASS, using Compass. In order to use it I also had to learn to use MAMP. Now I was working in an “environment”. Somewhere along the way I started to use a more sophisticated text editor, Sublime Text. I am still using Sublime Text.
Bit by little bit I am learning to use the terminal. I have a cheat sheet that I sometimes refer to. Along with the Terminal comes GIT and Github, Homebrew, Node, NPM. Setting these things up has never been easy. It often requires months and months of study complemented by lot of trial and error.
I was an early adherent of CSS and when HTML5 and CSS3 came into being I was on top of it, learning from the best web mavens on Twitter. I learned to build websites with cross-browser fixes, many of which are still actively in use today.
Recently I helped a client with her WordPress. It had a sophisticated drop-and-build functionality that was hard to learn. Part of what made it hard to learn was that she hadn’t touched it for two years and the complicated functionality was out of date and broken. Over the last two years PHP has evolved quite a bit and her server settings were out of date and frankly a hacking hazard. Dozens of plugins were out of date too. Any small change might freeze the program, providing a white screen of death.
But when it comes to learning how to build, use and maintain the working environment for the “modern web”, I have lagged behind. I missed out on learning how to use Grunt, for instance. There is a long list of technologies that have come and gone.
I am working to catch up. Some time ago I decided to break my website into template components. This is supposed to be a time-saver, so that when I want to change a thing in the webpage footer I don’t have to copy-paste it into thirty pages. I can change it on the footer template and all of the pages will update all at once.
So for the last year or so I have worked to learn how to use Gulp. Gulp is something called a task runner. It processes SASS instead of Compass and squeezes code to be small and unreadable and other stuff. In addition to processing SASS into CSS Gulp runs Handlebars to convert templates into HTML.
Did I mention that I like to write code, using TextEdit? Learning how to install Gulp through the terminal and program it to do what I need it to do has been difficult and time-consuming. There are not many tutorials and I could not understand the language of those I found. I did not know the paradigm. I am getting it slowly.
All of these things come in versions and when one of these becomes updated with another version, the others have to come along too, or the web design working-environment will break.
So recently I was designing happily in SASS and Handlebars when I saw a message in my terminal that my Yarn program was in need of an update. It is easy to hit “update” and without thinking about it much I did so.
I had intended to write a how-to about these technologies but instead I am writing about the distancing of design engendered by adopting a complex build environment, how hard it is to learn, keep up, and how brittle it is.
Recently I watched a video tutorial where the tutor was using a text named Visual Studio Code. He was able to load a SASS capability into VSC, link it to his browser and code just like that. No Node, no Gulp. Huh.
Visual Studio Code is owned and built by Microsoft and is free to use. Recently Microsoft bought Github for a small fortune so it looks as though VSC can interact with GIT and Github. I am searching to see if it can also process Handlebars. I bet it does, and I will be using it soon.