websites
Following is a list of some websites we've created or collaborated on, most of which are currently visible online.
currently in service
These sites are currently operational; some are recently built, others relatively old:
elemental code + graphics (http://www.ecplusg.com)
Our role — sole designer and developer; produced all graphics for site in Illustrator, Flash and Photoshop
Overview — you're looking at it. If you judge us on only one site, this should be it, because everything about the site reflects ec+g — the design, the graphics, the content, the code, it's all us.
Technologies — PHP, CSS, JavaScript
Go-live — 2008
: back to top :
Bay Area 511 Traffic Information Site (http://traffic.511.org)
Our role — subcontractor to Gray Hill Solutions; assisted with ASP programming, CSS; performed hosting, maintenance and site updates until 2007; performed project planning, management, and documentation duties for site construction
Overview — the 511 Traffic Site was commissioned by the San Francisco Bay Area's Metropolitan Transportation Commission (MTC) as part of its overall 511 web portal system. Our team developed the front end, application server, and databases for a highly complex web application which uses GIS (Geographic Information Systems) to display real-time traffic information for Bay Area commuters. The site is rated for up to 1,000,000 hits/day; actual average usage is over 100,000 hits/day at last report. The project demanded rigourous planning and documentation, for which ec+g was primarily responsible.
Technologies — ASP, CSS, JavaScript
Go-live — 2003
: back to top :
Elemental Consulting Services (http://www.elementalcs.net)
Our role — sole designer and developer; produced all non-photo graphics for site in Illustrator; edited all photos in Photoshop
Overview — ECS is our other business, specializing in non-web technology and business consulting. So, like the ec+g site, this one is all ec+g in its design and execution, and we've used many similar design elements for consistency. We aimed, however, to give it a very different feel — more businesslike and conservative, but not bland or boring.
Technologies — PHP, CSS, JavaScript
Go-live — we redesign the site every year or so, most recently in late 2008. Original go-live was in 2003.
: back to top :
St. Saviour's Preschool (http://www.sscpreschool.org)
Our role — sole designer and developer; produced all non-photo graphics for site in Illustrator; edited all photos in Photoshop
Overview — we designed this site on a volunteer basis. The preschool our son attended had no website at all and very limited funds, so we offered to provide them a site for free. We based the site on WordPress, so they could easily update and maintain it (the staff are not tech-savvy). We reused work from earlier WordPress sites we'd built, and provided a new set of graphics and navigation menu. Visually, we aimed for a look that would reflect the child-centred nature of the organization.
Technologies — WordPress as base; extensions use PHP, CSS, JavaScript
Go-live — 2008
incomplete/in progress
The following websites are currently under development/incomplete, but show some of our most recent design and development ideas and capabilities:
Gray Hill Solutions (currently viewable at http://testsite.grayhillsolutions.com)
Our role — sole designer and developer; produced all non-photo graphics for site in Illustrator; edited all photos in Photoshop
Overview — GHS was a Seattle-based software company with a casual, quirky culture; the site needed to express that culture, while projecting a somewhat more mature image than the original GHS site (discussed above). The base of the site is the WordPress CMS, but we've created an extensively-modified theme for GHS, with an entirely new design and a variety of custom functions for menus, automated section index pages, and other features.
Technologies — WordPress as base; extensions use PHP, CSS, JavaScript
Status — The design is complete; content is not. GHS is winding down, so the site will never be fully populated with content; but we keep it alive to show the design and illustration work.
: back to top :
Macdonald's Prescriptions #3 (currently viewable at http://macrx3.elementalcs.net)
Our role — sole designer and developer; produced all graphics for site in Illustrator and Photoshop
Overview — Macdonald's is a neighbourhood pharmacy in Vancouver's Kitsilano area, with a primary clientele of seniors, but a secondary clientele of young professionals. The site needs to project a professional but friendly atmosphere, and should be accessible to users without a great deal of internet experience, while offering functionality for more experienced users as well. The colour scheme reflects the scheme for the Medicine Centre pharmacy group.
Technologies — WordPress as base; extensions use PHP, CSS, JavaScript
Status — the site is in a relatively early stage of design; the skeleton is in place, but content is almost absent, and a number of design decisions remain. We will also be producing a Flash animation for the site's masthead.
no longer available
All good things must come to an end, and websites can go out of service for many reasons. Here are some we created that you can no longer see, but which give you more sense of our experience:
Gray Hill Solutions (http://www.grayhillsolutions.com)
Our role — sole designer and developer; produced all non-photo graphics for site in Illustrator; edited all photos in Photoshop
Overview — this was the first commercial website we created; we were asked to produce a light-hearted site reflecting the company's small size and fun-loving attitude. Realistically, the site looks quite dated now; but the proposed redesign was never completed (see below), so there it still is.
What happened to it? — the company's owners decided to wind down the business.
: back to top :
Depiction Community Site
Our role — customization and theme creation for Drupal CMS-based site
Overview — we were asked if we could take a PDF of a prototype design (not our own design) and translate the look into a Drupal theme in about 3 days. We could, and did. Unfortunately, without signing up you can only see the front page, but that page gives you the basic idea.
What happened to it? — the portal was intended as a temporary site for a product rollout, and so it was.
: back to top :
APARC Systems (http://www.aparcsystems.com)
Our role — sole designer and developer; produced all non-photo graphics for site in Illustrator; edited all photos in Photoshop
Overview — we were asked to produce a professional, easy-to-maintain site within a tight time frame and budget. We suggested a WordPress CMS-based site, as it would allow use of blog functionality for news updates. As well, using WordPress allowed us to recycle some custom functionality we'd written for other sites, with some degree of rewriting.
What happened to it? — budgetary considerations caused the business to choose a different web designer and host.
: back to top :
Urban Forestry Services (http://www.urbanforestryservices.com)
Our role — sole designer and developer; produced non-photo graphics for site in Illustrator; edited all photos in Photoshop
Overview — we were asked to produce a relatively static informational (i.e., not customer-action-oriented) site for an urban forestry goods and services retailer. The site needed to be maintained in DreamWeaver, and built on an extremely low budget (<$1,000).
What happened to it? — after years of operation, the site's look badly needed updating. By this time, the owner's daughter had learned web design, so they decided to keep the web work, literally, in-house.
: back to top :
Immanuel Christian Fellowship
Our role — creation and customization of a Drupal CMS-based site
Overview — we cut our Drupal teeth on this site, which we built on a volunteer basis. We designed five entirely different themes to suit different tastes, and incorporated a number of functional modules aimed at community-building.
What happened to it? — after we no longer had time to perform site maintenance, nobody else could or would either; so they created a less complex site instead.
: back to top :