How this website’s design came about
When I first started working exclusively as a software engineer, people who knew me as a designer were convinced I had gone mad: “Who wouldn’t want to do design?” Short answer: Me. I did design for other people for the first 7 years of my career, and let me tell you – it sucked. It sucked because all of my effort and inspiration would go into a design, only to have it reduced to, “Can you make it blue instead of brown – my wife likes blue.” That was an actual, real statement for my last design client. It wasn’t that this was the first time I had received feedback on my designs (and this was by no stretch of imagination the worst feedback I have every gotten), but it was the last straw. It would be years before I opened Photoshop and Illustrator again.
I supposed I was heartbroken. I love doing design, especially user interface design. I wouldn’t consider myself an “artist”, as I like to design within constraints. This may be why I find graphic design so appealing. I reminds me very much of writing software, where you also have to design within constraints. It would be fair to say that I love every type of design, from visual design to software design and everything in between, but I digress.
This website, I suppose, was a long time in the making. I’ll try to make the history of this how this particular design emerged as quick and painless as possible.
First, I must explain the goofy illustration of myself. Yes, that’s me. It’s based off a photograph I took of myself in a Starbucks bathroom in 2005. It was the only place I had access to at that particular moment where I could take that type of photograph of myself and not make a complete idiot of myself in public. The photo was meant to make fun people who (at the time) were taking glamor photos of themselves and posting them as their profile photo on social websites. I thought they were cheesy, so I wanted to out-cheese them. I claim I succeeded. Admittedly, I added embellishments to the illustration to make me look better than I actually do, as I do not have a chiseled jawline, and I cannot grow sideburns if I tried. However, adding those embellishments made for a nice composition, which I what I was going for. Besides, why would I make myself look worse if given the chance?
Second is the name “Feyn” and the logo made to represent it. Simply put, “Feyn” is a short version of “Feynman”, which is taken from the last name of Mr. Richard Feynman, a physicist I greatly respect for his candor and unique communication style. It was also a 4 letter domain, so I snatched it up back in 2001. The actual logo composition came to me when I was taking a shower, thinking about what a “Feyn” logo might look like, while staring at the square tiles in my bathroom. Once I had the notion of it fitting in a square, I remembered a painting done by one of my oldest colleagues and dearest friends, which she used to teach me graphical composition through the use of sophisticated angular grid lines. In many ways the logo is an ode to her, and when I showed it to her, she didn’t say it sucked, which was more than enough of an endorsement for me.
Next came the icons that were to represent the topics I wanted to talk about on my new blog. I was inspired by the terse, monochrome icons used in iPhone/iPad white-on-black menus, so I kept the lines very clean, simple, and abstract. My goal was to create markers, rather than communicate what they represented clearly. However, I’ve done enough heuristic analysis and usability studies to know that – at a minimum – they need labels. Still, it being my website and all, I decided to do something that flew in the face of everything I knew about usability – mainly because I could, and I would never have the chance to do so at work. The icons were all designed in an evening, but one took more time than all the others combined – the “Quality Assurance” icon. That was a nightmare, but I’m satisfied with the final product.
With goofy illustration, logo, and icons in place, I needed a layout. I wanted something I wouldn’t mind looking at on an iPad, and that drove many of the design decisions. I also wanted a constrained page width to ease with reading. This was actually the first and last composition I chose, so the revisions I did afterwards were just variations of the basic page structure.
When it came to color, well, I’m not good with color. I don’t think others would stay the same of my work, but selecting colors, like selecting fonts, stresses me out. To me, picking colors and fonts does not come easily, and I have to work very hard at it, where I feel that other designers do not. I believe this has to do with my background in black and white photography, technical illustration, and clay modeling – none of which require color. For my own website, I decided to be a coward and avoid the problem completely. Once I made that decision, I had loads of fun with shades of grey.
From there on, it was just bits and bobs, like the social icons. A few hours later those were all in place. I then ruminated on the design for several weeks, until I got tired of working the blending options in Photoshop and just cut it up into CSS sprites.
So there you have it, for better or for worse. Think of this less as a tour-de-force of my design skills, and more of something organic that oozed out of my brain that you are now subjected to. I hope you don’t hate it, and if you do, I understand. This website is my infinitesimally small corner of the internet, so as I pitch my little tent I wanted to hang a sign on the door that at least read, “Neil was here.”