Website / UI Work
I've served as UI developer, art director, website developer, and online editor on numerous projects over the years, but my favorites have in common the following characteristics:
- the project has complex business requirements
- I have input on defining/refining functional requirements and UI "solutions"
- rapid prototyping is required
- it's understood that the project will go through multiple iterations
- my team has a solid project manager and keen developers
While I've designed and maintained many general company internet and intranet websites, my distinctive is application UI design.
I do all my coding with BBEdit (a glorified text editor) and Photoshop.
I've done my best to remove all branding from the examples below, including logos and company names.
Internet and Intranet Websites
As a versatile frontend developer, I've designed and maintained numerous websites. While many have been redesigned in the years since I turned them over to the client, below are some current examples.
- Women Praying Boldly. Based on Ning.com technology, I designed the interface and tweaked the source code extensively. I created the videos linked to in the right column (shot the video in a studio, edited the audio in Protools, edited the video in Final Cut Pro, wrote the music). I also configured the site's e-mail and DNS, and configured and embedded the Amazon "Store."
- Eli Bremer. Eli's site is fairly traditional. The embedded blog is a cool feature.
- Boundless. As editor of Boundless, I'm responsible for securing and editing all content and developing and managing the layout/coding in the site.
- MTI Custom Landscapes. I designed and currently maintain this website. They put in our yard.
- New Attitude Band. I was a member of this band, and developed the site (the link leads you to an archived copy of the site; the original site no longer exists).
- Delta3D. I was brought in to lead the site redevelopment. I selected GeekLog as the foundation for the site primarily because of its being open source, but also because it met all the client's requirements and enabled a good deal of customization. This is what the site looked like when I began the project.
- iJot. This is my personal website, which contains a few photo-travelogues and links to my home studio and other stuff.
Other sites I had developed and/or maintained include the following:
- Duncan Bremer For Congress
- Orchard Grove Music
- Sovereign Grace Church
- Fluency Voice Technology
- Christian Broadcasting Network
- National Fatherhood Initiative
- OOP.COM -- Object Oriented Programming
- Flying Hospital
- Electric Mirror
- Orchard Grove Condominium Community
- New Attitude/New Attitude Band
- Episcopalians United/Anglican Voice
- Concerned Clergy and Laity of the Episcopal Church
- Campaign website -- U.S. Representative Mark Goins
- Duluth Medical Web Server
- Regent University School of Education
- Regent University School of Divinity
- South American Missionary Society
Application Prototype UI
Example 1
Consistent with iterative development, this project began with an extremely simple set of text-only webpages, providing the client and developers a concrete "starting place" to agree on at the commencement of the project -- basically a text-only interpretation of the requirements document.
The second set of webpages is the fairly robust "clickable prototype," especially the "Edit Users" section. By removing all branding from that second set of webpages, we forced the client to focus on functionality, rather than colors etc. Some of the buttons are disabled, and of course the data is hard-coded.
Example 2
This was the prototype UI for an online check-viewing application. While not all the buttons and links are clickable, many of them are. Try selecting a date from the date-picker, sorting the results by clicking on columns, viewing the three checks that have been pulled from the database so far, downloading or printing a check, and clicking on the "search" link once you've already viewed a check.
Example 3
This set of webpages formed the basis of a Purchase Authorization Form application. Note that while some of the links and buttons "work," because they weren't important during this particular phase of development, many of the links don't work.
Example 4
The following were typical application prototypes.
Documentation
I've written and maintained a variety of requirements documents, Dialog Design documents, Persona Design documents, handouts for classes (e.g., SSML, UI principles and techniques, prompt recording and editing techniques), news releases, copy for brochures and flyers, and so on. Please contact me if you'd like to see samples.
In addition to standard application documentation, I've submitted several informal "change requests / bug reports" for a tool our developers created, VoiceRunner.
Logos
OOP had a fairly typical "dot com" work culture, one that was characterized by outside-the-box thinking, hard work, and dedication to our work. Because our corporate culture and attitude was "bold" and "vibrant," our marketing and collateral reflected that.
In the following examples, I was responsible for all design, including the logos, colors, and so on. The first set images were included as splash screens and installation screens for of a developer tool our team created. The second set of images is a UI prototype of part of an application we developed, a mock-up of the "retail box" in which the software might be sold, and an early draft of multi-level tabs which I created from scratch.
