Portfolio (Web)

authored by Matt

Board of Supervisor's Minutes Application

SLO Board of Supervisors Minutes

This was a fun and fast–moving project done for the Clerk Recorder for San Luis Obispo County. A two–man project with my primary duty being the user interface design, XHTML and CSS, this was also a big learning project because it was my first real project working with .NET. Much of it consisted of learning how to hook CSS into .NET and Visual Studio 2005 and to try and get it to produce “clean” code. In short, it was a challenge! Microsoft is, as usual, intent on doing things “their” way and not necessarily a W3C standards–based way. But in the end, things worked out for this prototype.

The link to this demo is a “fleshed–out” wireframe, meaning that the navigation, graphics, and text are all there, but the interaction is “canned” with no database behind it. Please follow the instructions in the cool AJAX “fade–in” text boxes. Hovering over these “fading text boxes” will also give you a visual cue as to which link/button will take you to the next demo page. Try it out!

San Luis Obispo Spanish Home Page

SLO Spanish Home Page

This was a really interesting and fun project done for San Luis Obispo County. Working with a number of native Spanish–speaking county employees, I was tasked with creating a Spanish translation of the county’s recently–developed home page. SLO County utilizes a content management system by IronPoint (now part of Active Network). So this project consisted of creating a set of HTML templates, additions to the County CSS stylesheets, modifying and translating the XSLT file for the County’s Google Search Appliance so that search results are returned in Spanish, and creating CMS database content to be used with all future County Spanish website translations.

Design In Mind Company Website

DesignInMind-Danville.com

The owner of Design In Mind, Debora Killeen, is a very creative, upbeat, and busy! interior designer in the Danville, CA area. She wanted a soft, flowing website that reflected her existing business card design.

My way of personalizing her site was to take direct inspiration from her very nice business card design, which she had previously designed herself. (I love working with creative people!) She mentioned that fleur–de–lis were common components in interior design, especially as decorative curtain rod ends. That immediately made me think of a curtain rod element with the words “Interior Design Consulting” as the rod itself. We took it a step further as she wanted some sort of “curtain opening” animation for the main page. I decided to use Flash for the animation panel, and came up with a much more extensive animation than I usually do for web sites. I am very proud of the soft, simple, yet modern look of the curtains! The animation introduces the viewer to all of the web site’s main topics. The animation is self–running, but there are also interactive controls to skip through the pages. Each animated page also links to more–extensive HTML pages. The final touch to the design was adding her slogan, “Do you have a Design In Mind?” at the top of the page. Debora is thrilled with the design and thinks it really reflects her business well. I do too!!

Frame Company Website

FrameCompany.com

The owner of the Frame Company, Sawsan Wolski, is a very creative artist who is a joy to work with! She wanted an elegant, artistic web site that reflected her Framing and Art Gallery business.

Since I always try to personalize my work and bring some of my clients’ personality and creativity into their projects, my approach to this web site included using some special handmade paper Sawsan had acquired years earlier. At the time, she didn’t know what she would use it for and just loved the beauty of these papers. I thought it was very appropriate to come up with multiple designs based on several of these papers.

Sawsan chose this design, since it is a gender–neutral look, neither too masculine nor too feminine. The paper pattern is at the left edge of the site, where I created irregular borders to simulate wet paint. The paint brush, with the “paint” on the tip, brings a final personal touch as Sawsan is a very accomplished artist and painter in her own right! The site includes a Flash animation that displays a few works of one of the gallery’s principal artists. These animations change every few months or so to help keep the site fresh. I believe this is one of my favorite graphic projects to date!

All Pro Sports Company Website

All Pro Sports Cards Company Website

A simple, clean sports–related website for a Pleasanton, CA sports collectibles shop. It “hits it out of the park”, which is exactly what I wanted to communicate. Includes a “Flash” intro.

The Channel Web Newsletter Masthead

“The Channel” Web Newsletter Masthead

I was asked to come up with a catchy masthead graphic for a web newsletter for an organization I used to work for at Bank of America. This is what I came up with. My ideas to communicate were “communication”, “digital technology” (since it was primarily a systems and programming organization…natch!), a sense of motion, as in “moving ahead”, with a little “hipness” thrown in. I think it communicates these. What do you think?