Web Design
From planning to programming

Shown here are websites I designed and then programmed. I can work with you from the earliest stages, brainstorming solutions, providing design sketches, and helping you organize the content. Or maybe you already have a design for the site, 3D website window and smartphone/tablet, with web design labeled Responsive HTML5, SEO, CSS3 and only need a programmer to build it—or to build just one part. Either way, my goals in creating a website are:

  • Future flexibility and ease of maintenance.
  • Professional graphic design that supports the site’s specific objectives.
  • Simple navigation that guides the user rapidly to the most important information.
  • Modern web standards and practices, such as HTML5, CSS3, semantic markup, and search-engine optimization (SEO). I do web programming in JavaScript, PHP, and PERL.
  • Wide compatibility including responsive design for smartphones, accessibility for the visually impaired, optimized loading times, and high-DPI (“retina”) images.

Web Animation and 3D

Illustration: animation frames with mouse pointerI do custom 2D and 3D web animation, from simple transition effects to in-depth product demos and interactive charts. Animation systems I work with include JavaScript, CSS, SVG, canvas tag animation, and WebGL via Unity.

Making Websites Easy to Update

Illustration: spider with 
browser refresh iconI can work worth various CMS (Content Management System) solutions, including my own WebUpdater system, which can be deployed under your company’s branding. It is designed to be so simple that even the most non-technical users can be productive immediately, with no training or documentation needed. It’s even easy to use from a smartphone.

Instead of bombarding the site owner with options, WebUpdater is customized to do just what each particular organization needs—and no more. It’s a “virtual webmaster” that I customize for each site, programming it to painlessly handle details that site owners don’t have time to think about:

  • Instead of offering complex style tools, WebUpdater automatically insures that the look of the site is maintained.
  • It can watch for likely errors and correct them quietly without user intervention. For example: accidentally using an old phone number, a commonly-misspelled name, or a trademark without the ™ symbol.
  • It cleans up extra spaces and line-breaks (common when pasting from a word processor) and even has automated typographic “orphan control” to prevent a single word from ending up alone on a line.
  • It can make certain words into links automatically, detecting phrases like “contact us” and product names.

WebUpdater is fast, widely compatible, and easily portable: installation is as simple as copying a directory. Data is stored as human-readable text, which generates simple static HTML files. That means the site owner isn’t locked in: changes can easily be made by other methods, and the site keeps working even if WebUpdater is removed.

See WebUpdater in Action

Try this demo copy of a WebUpdater deployment that simultaneously updates two touchscreen museum exhibits and a history website that I programmed (exhibit UI design by Impact Communications).

You can create, edit, and rearrange topics, including slideshows with captions and quiz activities with a variety of question types. This then ties into a system I built to allow teachers and museum-goers to take home or share personalized sets of topics, via email or a QR code.

View

Pioneer Table Pads
Three websites and online store

  • Table pad “configurator” to simplify ordering a complex, customizable product
  • Library of seasonal marketing animations
  • Led to an immediate sales increase

View portfolio project
E-commerce websites with product configurators: Pioneer Table Pad Company
View

GE Lighting
3D City of Light home page

  • Interactive lighting simulations
  • Cost/benefit calculator
  • Banner ads
  • Business-to-business sales presentations

View portfolio project
3D illustration: GE city website
View

CASACweb.org
Large-scale nonprofit website

  • Custom CMS allows instant updates with no programming or training needed
  • Around 100 pages, yet easy to navigate
  • Search-engine optimized (SEO)

View portfolio project
Non-profit web site design: CASACweb.org
View

Premier Pediatrics
Mini-site for a medical practice

  • Simple home page and gateway to patient portal
  • Emphasizes vital content for new patients: map and contact information
  • Responsive web design

View portfolio project
Doctor’s office web site design: Ask Dr. Bennet
View

Sydney 2000 Olympics
Web banner ads

  • Animated banner ads for the Paralympic Games in Sydney, Australia
  • Tailored for strict data limits
  • Click to view this and other banner ad campaigns

View portfolio project
Web banner ad design: Paralympic Games, Sydney, Australia
View

IRUL
Large-scale nonprofit website

  • Designed for an institutional, academic feel
  • Two-level navigation to keep a large site organized
  • Libraries of downloadable white papers and other media

View portfolio project
Non-profit website design: Institute for Research on Unlimited Love
View

HeartOfReligion.net
Book promotional website

  • High-DPI web design optimized for retina displays
  • Clean, open design with remote Web fonts
  • Online ordering, reviews, and embedded audiobook

View portfolio project
Book web site design: HeartOfReligion.net
View

Love All Means All
Scholarship contest website

  • Bold, responsive design focused on 7 question areas
  • Simple system for submitting essays as uploaded Word documents
  • Library of past winning essays

View portfolio project
Contest submission web site design: Love All Means All