Professional

My title right now is Director of Digital Design & Development at St. Martin’s Press, book publisher. It’s probably one of the few titles that I feel comfortable with as it expresses what I actually do. My projects include creating videos for everything from broadcast TV to Instagram, building landing pages and websites, editing audio and creating digital assets for marketing campaigns.

I am creative at heart, equally visual and technical. I still create art by hand, nothing beats a quick sketch. I’m eager to learn new ways of creating, of telling a story. In the end, isn’t that what it all really is, telling a story? Here’s some of mine.

I’ve been an artist/designer as far as I can remember. I started as a graphic designer over 25 years ago, and when I got a computer I really immersed myself into all the programs, started networking and learning anything I could. I’m still the same way. The thing I always loved about the web, we were all learning together. You could look at the source code of a page and see exactly what was going on, it’s a little crazier these days. It would help you learn, and people were mostly eager to provide what they know. It’s still true today, most of the open source endeavors get good returns. I’ve learned a lot from everyone I’ve worked with and still do today.

If you’re looking for the boring, all-text, traditional resume/CV format, click here.

About the site

Designers/developers will tell you the hardest site to build is usually their own. All those questions I ask clients, what are the site’s goals?, who is it for?, blah blah… I have to answer those myself. This site is for me, to present myself, my ideas, and my work. I’ll use it as a playground, and a lab to exercise and experiment.

I decided I needed the site to be visually different. I wanted the site to reflect my personality, rather than use a theme or template. I’ve noticed, as many people have, the rise of emojis in text and conversation. There’s something fun and creative in communicating graphically, so I employed that for my navigation icons, to give them a personal touch.

The “About” icon took me a while to come up with. I wasn’t really sure what connotes “about”, but I saw a lot of uses of the lowercase “i” for “info”. So I started playing with different typefaces to see which one was graphically interesting and had enough weight to stand on its own. I eventually landed on Poster Bodoni, a nice serif that has a bold body. As I was converting it to outlines, I was zoomed in to a view where I perceived the shape as a guy with a curvy arm and a tail, the dot in the “i” was his head just floating above. It personified the graphic for me right there. I then added a break for a shirt, with a neck space. I played around with a full face but decided to go with just eyes, which are actually just two commas from the same typeface rotated 90°.

The “Portfolio” icon was a little easier in that I knew what I wanted. I wanted to integrate a digital concept with a real tool for creating art. I had tried a pencil and paint brush enclosed in curly braces. However a good deal of my work doesn’t really involve code writing, like illustration or video creation. So I thought a computer mouse was something I’ve been using throughout my career, and the brush swiping wet with paint is a common image so it conveys an artistic endeavor. Then it was just finding the right combination of look and detail.

The “Rants & Raves” icon I also had a pretty good idea of what I was looking for. I wanted it to feel like old advertising art, so I went through a bunch of clip art collections from old advertising. I even went to the library and looked up old newspapers to see the ads in full. I ended up doing a search for “hand shout” and found an image close to what I’m using. I recreated it in Illustrator and tweaked it a bit.

The mobile menu created an interesting thought process as well. In the development community there are discussions, heated at times, as to whether a “hamburger” menu (indicated by three horizontal lines), or the word “MENU” itself is better. I have no strong conviction here so I decided to use both, and add the hamburger emoji as an extra visual, in coordination with the rest of my site. Technically, I know the emoji is of a “cheeseburger” not a “HAMburger”, but they don’t have a hamburger emoji. Why? I don’t know. It’s the same prejudice I find when I have to send my cheeseburger back because I ordered a hamburger and didn’t want cheese, as if the cheese is assumed. Hungry now?

Shout Outs

I want to give some praise to all the people who work in the development community. One of the things I loved about moving into web was that most people were eager to share their solutions, exchange ideas, and things moved quickly, and they still do. It’s impossible for one person to keep up with everything, that’s why the community presence is so important, you’re never alone.

Here are some of the ones that have helped me most.

Sarah Drasner @sarah_edo is one the most amazing people I’ve encountered in this field. I’ve been lucky enough to have two workshops with her, one was SVG animation with Val Head, who is equally amazing. Sarah’s book on SVG Animations is excellent and my go-to reference for all things SVG. The other was a Vue workshop through Smashing Magazine Conference. She has enthusiasm for everything she is teaching. You get cool examples with Wall-E and Tron, and you’ll likely want a taco after work.

Sara Soueidan @SaraSoueidan is another superstar, when I first starting using SVGs, I was having a really tough time understanding the concept of the “viewBox”. She explained it and created an interactive tool to play around with it, it was only using this for days that the switch finally went on and I “got it”. I was lucky enough to take a SVG workshop with her as well, and that was one of the best sessions I’ve been to. She is also a great resource for accessibility and handling all things related to it.

Chris Coyier

@chriscoyier is a co-founder of CodePen, which is amazing in itself. I love CodePen, so much that I include it in my contact nav. It is the ultimate developer playground. CSS-Tricks, another of his great works, is open in a tab at all times in my browser, at least one each for Flexbox and CSS Grid, where the layout and visual representation make it really easy to explore all options and queries.