Brilliant by Design

Right and left brain design solutions.

my portfolio

Web Design and Development

Featured: Michael Rooker Online
Michael Rooker Online

Overview

The personal website of actor Michael Rooker, Michael brought me on to migrate the site to a new server and to manage the day-to-day coding requirements as needed. The site design is a standard Wordpress plug-n-play theme with a little bit of tweaking thrown in. In truth I would like to move it away from Wordpress and rebuild the site on my preferred platform but for the time being the site will stay where it is.

Visit Michael Rooker Online

Skills and Tools

Responsibilities
Development
Code Requirements
HTML5
Sass / CSS3
JavaScript
PHP
Primary Development Tools
Coda
CodeKit
Apache Server / MAMP PRO (local)
Content Management System
Yes

Jeffrey Axelbank
Jeffrey Axelbank

Overview

A redesign/recoding for a prominent psychologist, the challenge of this site was the sticky menu with a horizontal hide/show CSS3 animation effect. The menu’s structural design is more complex than I normally build but it was necessary in order to provide a brief summary of each page link on tap/rollover. It’s well-structured and semantic though initially I had some UX concerns, but after some fine-tuning I feel it works well.

At the client’s request accordions are used extensively throughout to help streamline the layout and better differentiate sections, thus making it quicker and easier for the visitor to target a specific area of interest.

Visit Jeffrey Axelbank Psy., D.

Skills and Tools

Responsibilities
Concept and Wireframe (hand-drawn)
Design (UI, UX, Responsive Layout)
Development
Graphics
Code Requirements
HTML5
Sass / CSS3
JavaScript
PHP
Primary Development Tools
Coda
CodeKit
GitUp
Apache Server / MAMP PRO (local)
Graphic Tools
Affinity Designer
Affinity Photo
Sketch
Content Management System
Yes
QREATiv
QREATiv

Overview

QREATiv is a community-based project where people can sign-up, create, edit, publish content and manage media uploads all from their front-end account. It required highly customized content editing and media management tools with great attention given to user permissions and general security.

Functionally this was by far the most ambitious site I have built to date. As a front-end dev the PHP was outside my comfort-zone, and even some of the javascript customization was new territory. It was a great learning experience and I am proud of what I was able to accomplish with the members’ area.

Visit QREATiv

Skills and Tools

Responsibilities
Concept and Wireframe (hand-drawn)
Design (UI, UX, Responsive Layout)
Development
Graphics
Code Requirements
HTML5
Sass / CSS3
JavaScript (vanilla) and jQuery
PHP
Primary Development Tools
Coda
CodeKit
Prompt 2
GitUp
Apache Server / MAMP PRO (local)
Graphic Tools
Affinity Designer
Content Management System
Yes
Saparoff Music
Saparoff Music

Overview

This project makes extensive use of audio/video to showcase the client’s musical talent. The original developer (whom I replaced) built the site long before responsive design, HTML5 and CSS3 existed so it used outdated technology and techniques such as a fixed layout and graphic text. The client is aware of the issues but is holding off on a comprehensive update so there’s not much I can do for the time being.

However, I was able to rewrite the code-base to HTML5, improve video compatibility across more browsers, and replace a lot (not all) of the graphic text. Accessibility is improved and load time is down. And while functional on mobile devices the UX is far from ideal. Hopefully the client gives me the “green light” to bring the site up to modern Web standards.

Visit Saparoff Music

Skills and Tools

Responsibilities
Concept and Wireframe (hand-drawn)
Design (UI, UX, Responsive Layout)
Development
Graphics
Code Requirements
HTML5
Sass / CSS3
jQuery
PHP
Primary Development Tools
Coda
CodeKit
Apache Server / MAMP PRO (local)
Graphic Tools
Affinity Designer
Affinity Photo
Sketch
Content Management System
Yes
Princeton Family
Princeton Family

Overview

I was hired to redesign and recode this site from scratch. Admittedly it’s not a flashy design but that wasn’t my goal, nor was it what the client wanted (it’s a mental health site, after all).

The real beauty of this site lies with the Content Management System customization. The client wanted granular control over multiple editors and content editing which required heavily customized security permissions and editing tools. What I provided were bespoke editing controls that make a normally technical process user-friendly for the client. Overall the client loves the result, front and back.

Visit Princeton Family Institute

Skills and Tools

Responsibilities
Concept and Wireframe (hand-drawn)
Design (UI, UX, Responsive Layout)
Development
Graphics
Code Requirements
HTML5
Sass / CSS3
jQuery
PHP
Primary Development Tools
Coda
CodeKit
Apache Server / MAMP PRO (local)
Graphic Tools
Affinity Designer
Affinity Photo
Content Management System
Yes
Dr. Norbert Wetzel
Dr. Norbert Wetzel

Overview

The personal website (blog) of a prominent east coast psychologist, the client very much likes the minimalist aesthetic, as do I. Functionally it’s very simple but it works well for the client’s modest content needs.

Visit Dr. Norbert Wetzel

Skills and Tools

Responsibilities
Concept and Wireframe (hand-drawn)
Design (UI, UX, Responsive Layout)
Development
Graphics
Code Requirements
HTML5
Sass / CSS3
JavaScript
PHP
Primary Development Tools
Coda
CodeKit
Apache Server / MAMP PRO (local)
Graphic Tools
Affinity Designer
Affinity Photo
Sketch
Content Management System
Yes

Hand-drawing

“Woman in Coat”
Woman in Coat

Overview

This drawing was created by hand (yes, really) with pencils on heavyweight plate finish paper. What started out as a personal side project for my own enjoyment ended up being sold.

As someone who is (pardon the pun), drawn to photorealistic drawing, I was intrigued by the fine detail of the coat and brick wall which came out nicely, if you ask me.

Skills and Tools

I’m Todd

×

A Little About Myself

Brilliant by Design is my itsy-bitsy Web design and development shop, and it’s powered by the man behind-the-curtain, me... Todd. As a one-person outfit I’m responsible for, well... pretty much everything. From finding clients, to conceptual design, to writing code right through to the finished product, and every little thing in-between (I also take out the garbage, by the way).

I discovered early on that dealing effectively with different personalities can be more challenging than learning to code. When working with clients interpersonal skills and social finesse are at least as important as technical know-how, and can sometimes mean the difference between a mutually beneficial working relationship and feeling like Sysiphus.

Left Brain

I’m primarily a front-end developer. If I were to pick a favorite language it would be CSS (and Sass) which for some reason really “clicked” with me from the very first line I wrote. As for server-side scripting languages I frequently dive into PHP as part of CMS customization which these days is a standing requirement. Nevertheless, PHP sits outside my comfort-zone. Though I manage fine there’s plenty of room for improvement.

Right Brain

Most of my graphic work is for the Web only. I’ve done some print work (business card, logo) but nothing recently. The artwork is pretty straightforward vector and raster stuff, with some photo editing as required.

I also have a talent for hand-drawing, especially photorealism. I have been commissioned a couple times to do small pieces but it’s more of an “available upon request” kind of thing. It’s not a skill that comes into play when building websites and that’s fine with me. Hand-drawing is a much more organic and intimate process. Graphite pencil is my favorite tool, I love the subtlety and simplicity of the humble pencil. It’s a thing of beauty.

Thanks for stopping by,

Todd