Hi, I'm Matthew

I am passionate about web design and development

My personal web work is showcased on this page. You can also check out my social profiles linked below

What I've worked on...

My professional experience exposed me to working with engineers, designers, marketers, and product owners.

My personal interests have given me strong knowledge of HTML5 & CSS3. These pursuits have led me to learn how to use pre-compilers such as SASS & Jade, while using GULP as a task running build system.

As a product manager, solving user experience problems was only one of my many major duties. I also had a hand in pushing pixels in user interface designs.

Writing & documenting product requirements for development and authoring public facing technical guides for client facing teams was time well spent.

My non-traditional background provided an extensive history interfacing with clients. This work also introduced me to writing & debugging client code using C#./NET and WPF.

In addition to general layout and CSS3 transitions & animations, I have enjoyed learning Javascript & Jquery to help make my web components more dynamic and interactive. Most recently I have started learning VueJS with for building interactive interfaces.

Although I am most comfortable on the front-end, I have worked toward learning the full web development stack. Over the years I have become familiar with Ruby on Rails and Express with Node.js.

See my work

Most of my product management work history is under a non-disclosure agreement (NDA). Despite this, I've showcased a small collection of my favorite personal front-end web components.

Below are some of my favorite Codepen demos I've created. You can also check out my profile linked below:

A word frequency counter designed to filter out individual words not commonly used. This demo is a single component taken from a personal project built with the progressive VueJS Javascript Library. I have enjoyed working with VueJS due to its powerful front-end rendering capabilities and relatively shallow learning curve compared to some of the other frameworks available. This demo also shows a bit of responsive web design using Flexbox, as well as the adoption of Material Design principles.

VueJS, JavaScript, Flexbox

See the Pen Word Frequency VueJS by Matthew Hendricks (@watthem) on CodePen.

When I'm not working on my front-end skills, I'm likely spending time with my son, or just trying to get him to go to bed. I've spent quite a bit of time in the last few months in a dark room while I swaddle / shush / swing him to sleep. So often, in fact, I felt compelled to recreate his nightlight from memory.

CSS3, Animation, Responsive

See the Pen Arthur's Nightlight by Matthew Hendricks (@watthem) on CodePen.

I set out to create a responsive lightbox image browser using only SASS. I accomplished that and then added some JQuery for some more interactive flair.

SCSS, Animation, Responsive, JQuery

See the Pen Colorful Lightbox Gallery by Matthew Hendricks (@watthem) on CodePen.

My favorite part of my day is marking my Google Inbox items as done. While I was waiting for you to email me, I decided to see if I could recreate the empty Google image using CSS shapes. I also took effort in making it responsive to the viewport and adding a bit of animation.

CSS3, Animation, Responsive

See the Pen Google Inbox Sun and Clouds by Matthew Hendricks (@watthem) on CodePen.

A HTML/CSS designed responsive table I put together for a friend. He uses it on a private blog to journal his day trading. He needed the table to be responsive enough that he could use it both his desktop and his phone.

HTML5, Responsive, JQuery

See the Pen Trade Journal with Responsive Table by Matthew Hendricks (@watthem) on CodePen.

I was lucky enough to work on a project learning the DirectX Direct2D and DirectWrite API. I was also thrilled noticing my knowledge translated to the JavaScript canvas rendering API.

Javascript, HTML5 Canvas

See the Pen Playing with Canvas by Matthew Hendricks (@watthem) on CodePen.

My wife and I just had a baby. We had a hard time deciding on a name. I used this opportunity to build a random card system to help come up with a name. (we landed on Arthur)

CSS3, Animation, Responsive, JQuery

See the Pen Another Baby Name Gen by Matthew Hendricks (@watthem) on CodePen.

Any good corn-grown-boy is going to make something like this learning CSS3 animations

CSS3, Animation, Responsive

See the Pen GBR by Matthew Hendricks (@watthem) on CodePen.

In effort to help improve my vanilla Javascript knowledge, I have most recently been working on a Color Contrast Ratio tool to help developers and designers find a set of colors with a healthy contrast ratio as defined by W3. I have used this project to explore my working knowledge of ES5 and working with object-orientated Javascript. I was able to complete this project without having to rely on any 3rd party frameworks for calculating colors or libraries for traversing the DOM

HTML5, CSS3, Javascript

See the demo: Color Ratio Tool or view on: GitHub

The source code for this site and other web and C# projects are on my GitHub linked below:

I live in Omaha, with my wife & new born son

While I'm not a programmer, I'm a product manager who knows code

(which I think is invaluable)

My mother was a nurse, and my father was an electronics technician. Their qualities helped shape me into an empathic problem solver with a technical intuition.

I love helping people

I love working on problems

I love helping people work on their problems


and my rabbit, Harvey

(go ahead - you can pet her)

I'm looking for work

It appears you don't have a PDF plugin for this browser...

Good thing I always come prepared ;)

download My Resume

# My portfolio is always evolving,
# so I apologize if you encounter any #{content_tag :b, "bugs"}
# :) Please report any problems to my Github project's issues page

 @issues = 'watthem.github.io/issues'