|
The simplicity of HTML (Hyper
Text Markup Language) makes it relatively easy for even a non-programmer
to put together web-pages. But the need for good design still
exists. Often, it is tempting to try too many gimmicks, and to
forget that good design is more important. I like to think that
this portfolio, and the other web-sites Ive worked on, achieve
a good balance between those conflicting desires.
- World Wide Web Sites: Design,
coding and programming of a complete web-site.
- Web Graphics and Design: Complete
design, or creation of graphics for use on a web-site (little or no coding).
- Web Animation: Mostly
just animated GIFs, including banner ads (also see my Animation
section).
- Web Programming: JavaScript
and CGI programming samples.
World Wide Web Sites:
Many of the web-sites Ive
worked on are now gone... the result of sales and buyouts, and
some busts as well. Some are hidden behind firewalls and unavailable
for general viewing. Yet other sites have expanded beyond the
ability of a lone individual, such as I, to cope with and have
changed beyond all recognition. The Internet is a moving target,
but Ive done my best to show some of my work below. The
sites Ive included are almost a history of the web in miniature!
Ive listed them in approximate order from newest to oldest.
- Smartshop.com, Inc. corporate web-site.
Until January 2001, I was the Manager of the Visual Communications Department
for Smartshop, and entirely responsible for the design and production of the
coporate web-site, including hand-coding the HTML. I also worked together with the
User Interface Department to design and produce graphics for the comparison
shopping web-site. This was a very complicated, and exciting,
position for me, but it ended when the company was sold and all of the workers laid off.
- Chamberlin
Real Estate School, Inc. web-site. My client wanted a simple, professional site that
would inspire confidence, yet at the same time also show that they are up-to-date.
Use of colors, images and drop-down menus contribute to those requirements.
-
Testarossa Vineyards web-site. This web-site is one I am currently working on,
and changes are occuring regularly. It makes extensive use of CSS (Cascading
Style Sheets), and JavaScript and CGI programs (see below). Also uses server-side includes (SSI) for the
buttons and promotional text in the left margin, and for the footer. CSS and SSI
make global changes to content and formatting so much simpler.
-
Portfolio Hair Salon web-site. This web-site is another one I am currently working
on. Anything you like, or dislike, about it is entirely my responsibilty. I adapted a
JavaScript for the slideshow on the "Gallery" page to show various
clients of theirs. Again, lots of CSS and SSI. I also did much of the photography.
- Affinia.com
was another recent
website Ive worked on. I was primarily involved in coding
the HTML for the pages on the public side of the
site, in concert with Affinia employees. A minimal design direction
was created by a design firm for us to follow. Sadly, Affinia
has ceased to exist.
- Bank of the West web-site. I
designed and created the interface, all the graphics, and wrote
all the HTML coding from scratch for this web site (in 1996).
They have since totally redesigned it but I have some of the
original web-site graphics I created for
them. My client agency was Battenberg, Fillhardt & Wright.
The scripts for the site were written to meet my requirements
a programmer.
- Collabra Software, Inc. web-site.
This was a complete remake of their (barely) existing site. This
site was also made available on CD-ROM for those without Internet
access (!). Back in 1995 that was still a major concern. We were
the first to successfully create an HTML-based interactive CD
with a Netscape Navigator installer included. Woodie
at Micromedium assisted me on this project, mostly to ensure
that the clients server was configured properly, and also
with other technical issues like creating the Navigator installer
for the CD-ROM. Collabra was purchased by Netscape, Inc. and
my work disappeared from the web. But Ive uploaded some
of the original Collabra
web-site files for viewing.
Web Graphics and Design:
- Cisco Systems, Inc. web-site designs. Their web-site
is constantly being updated and modified, so links to my work
may be quickly outdated. Instead, Ive uploaded the original
files. They are linked below. Some of them are actually sub-sites
(a.k.a. pods at Netscape). Ive done other work
for Cisco too, and some is accessible in my Design
and Illustration sections.
-
Cisco Market Web
web-site graphics. Its still in use today Im told.
-
Cisco EIS Global Reporting web-site graphics.
- Here are various stand-alone graphics I've created for Cisco Systems, Inc..
- Evoke seems to have dissappeared,
so Ive uploaded the
original web-site template here.
- Power Agents also seems to have
vanished, so Ive uploaded the
original web-site template here.
- Metricom, Inc. web-site (also
known as Ricochet). This site has since totally changed,
but Ive uploaded the
original web-site template. The main requirement was that
it be extremely quick to download since it was to be the home
page for all Ricochet wireless modem users. When bandwidth became
less of a concern, I redesigned
the site graphics, which Ive also uploaded here.
Web Animation:
Other animations (including Flash) are linked from my Animation
section. Please visit there as well.
- hpshopping.com. A random sampling of ad banners used on Yahoo
(others I made were used on AOL, CNET, My Simon and other web-sites).
HP Media Center PC highlights (570x179)
HP iPAQ h1910 highlights (570x179)
HP iPAQ h1910 highlights (300x95)
HP iPAQ 3955 with a free case (300x95)
Free case or paper with HP printer (570x179)
HP ze5270 notebook PC highlights (570x179)
-
NEC Webway animated GIF89a logo for an NEC product. This was for use in
a web-based software application in a manner similar to the Netscape
comets.
- Bank
of the West animations. These were used in the original version
of their website.
-
Live Objects
logo animated GIF89a file (145K). This was for use by Apple
on their OpenDoc and CyberDog web pages, and by CI Labs and others.
This was also used at MacWorld Expo/Boston 96.
I also created several QuickTime versions of it for on-screen
presentations. Live Objects is dead, but the graphics live on!
- A quick animated GIF89a file
for a Marimba
press release.
- Ive created quite a few
web-banners too (this is just a small sampling; I probably
created over 100 for Smartshop.com alone):
- And a ton of other "generic ad banners"
I created for Smartshop partners.
- And a few ad banners for other customers:
Web Programming:
I have been working with Perl (and even a little C) to write CGI programs
since 1994, and working with JavaScript to control browsers since early 2000,
even though I don't consider myself a programmer. It was just easier than trying
to find a good, reliable and affordable programmer to write programs for me.
Though in some cases I did so anyway (see "Bank of the West" above).
Most of the time it is far faster and more efficient to simply use existing code, and
there are so many sources for free code that there is seldom any reason to write
from scratch. That said, knowing how to write from scratch is a tremedously
good learning experience, and I have done so several times.
- Order Form
for Testarossa Vineyards (the current live version of this form can be seen here). In this case I wrote all of the JavaScript
from scratch, mostly because I couldn't find anything quite like this to adapt.
I chose to use JavaScript for the form because it is so nice to
have the totals and subtotals update instantly, without the need for a "Submit"
to the server and the consequent page loads. Also, in some cases certain states
don't allow wine shipments (try to select, say, Arizona for the shipping address), and it
saves people the annoyance of finding out much later, after they've filled out the form,
that they can't buy wine by mail-order anyway. The CGI script (in Perl) that accepts
the form input was one that I adapted from a simple CGI e-mail script. But I've
expanded it quite considerably here. It also does redundant math to calculate the
totals, unlike the simple e-mail script I adapted it from! (This was so I could avoid the
danger of somebody not clicking on the "Update" buttons, thus sending an
incorrect value to the CGI program.) If you want to test this form, fill out the form
and click on the "Submit" button it will send you two e-mails: A confirmation
of your order, and the order as received by Testarossa. I also created a "mailing list sign-up" form in a similar manner. Just another
example of how very simple CGI programs can be adapted to perform much more complicated things.
|