I live for web design. I talk code with web developers. I love making things work. With over seven years’ experience designing everything from brand identities to blog templates, I can help solve most communications challenges. My expertise is in website design, typography, and illustration. Let’s get to work!

Why I love the internet

I’m excited about

Other stuff I love

Readings

UBC Admissions & UBC FYI

MY ROLE: design, HTML + CSS coding

UBC Admissions and UBC FYI are two related newsletter-style blogs that broadcast topical items about student services to applicants and current students.

My challenge was to create an interface that would appeal to the largely young audience while still honouring the more muted University brand. My solution was to incorporate illustration and bright colours to draw a user’s attention to key areas of content. Background tints re-inforce the brand.

Brainbits

MY ROLE: design and illustration

Web developer Colin Ligertwood wanted a memorable identity for his business, Brainbits. Taking his concept, a brain-filled cereal, and his request for a classic cartoon aesthetic (a la Ren & Stimpy), I helped Colin develop an illustration, a colour palette, and a type treatment which he could carry across his website and his business cards.

youbc

MY ROLE: styleguide, HTML + CSS coding

Youbc is for students who are considering to study at UBC.

Working with design agency, Idea Rebel, I helped to develop the colour palette, image requirements, and site furniture such as icons, buttons, and call-outs.

Since launch, I’ve consolidated all available styles into a guide for content-providers to help them best format their content in the content-management system.

KHK Jazz

MY ROLE: design

Teacher and jazz musician Karl Heinz-Kiehlman wanted a website to attract more potential students. Rather than simply listing Karl’s contact information and availability, web developer Colin Ligertwood and I set out to showcase Karl’s long and rich experience as a musician by evoking his musical style.

A thin art-deco typeface (Raleway from The League of Moveable Type), Karl’s own “cool-cat” photos, and a night-time colour palette all serve to set the stage, for both a prospective student and Karl.

Here’s Karl’s site.

Suicide awareness posters

MY ROLE: design and illustration

I was honoured to work on the suicide prevention campaign for the UBC campus. I was asked to create posters that would catch the attention of students in distress, but also convey the message“you’re not alone” in a subtle, comfortable way.

My solution was to use a graphic-novel style of illustration to display the message. Visuals dominate the posters, making them easy to read discreetly in a public place.

Type Zoo

MY ROLE: design, personal project

Typezoo is a personal experiment: it’s an application that enables people to finetune pre-set stylesheets online using one of a series of typographic scales such as fibonacci, the golden-ratio, and fourths & fifths.

The scales affect the font-size and space relationships between elements. Almost all of the styles would use type available through the Google Font Directory.

Once a person is happy with their adjustments to a given stylesheet, they can include it in their own site by either downloading it or linking to it.

UBC Services for Students

MY ROLE: design and illustration

Services for Students is a primer for all undergraduate students at UBC. It’s a map metaphorically and literally to services such as career advice, orientation sessions, and housing options.

Together with the lead designer, Meg Whetung, I developed the colour palette, icons, and the transit-inspired map. The project existed online and in print, as a series of hand-outs.

interactive map

MY ROLE: illustration, HTML + CSS coding

I drew and developed this interactive map to informal learning spaces on UBC’s campus.

For accessibility and SEO, I used a combination of CSS sprites and semantic HTML to animate the hover effect. Semantic HTML also helps ensure that the client can maintain the map easily.

Cartoon-like “pop-up” speech-bubbles and an informal drawing style serve to support the content.

ASIST blog

MY ROLE: design, HTML + CSS coding

Working with an illustrator, I helped to design and code this internal Wordpress template for a UBC Student Services committee charged with rethinking the University’s admissions process.

UBC web app styleguide

MY ROLE: design, HTML + CSS coding

I wrote this brief styleguide to help developers use common form elements and iconography more consistently. I designed the UI to suit the overall visual identity of UBC’s Student Services websites.

UBC Student Health

MY ROLE: styleguide and art direction

Live Well, Learn Well is a UBC student’s portal to student health services on campus.

Together with a diverse team, I designed the page templates for incorporation into a CMS. I also art-directed a photoshoot.

My biggest challenge was to add visuals to what was a very text-heavy site with sensitive subject matter. Since the client was keen to expand the site’s audience, I suggested expanding the project budget to include custom photography.

The design also uses global styles which shape related websites. I helped to develop these styles, with a two-fold purpose: to orient typical users and to allow for more efficient web development.

Go Global

MY ROLE: design and HTML + CSS coding

Go Global is UBC’s service for students who would like to go on an exchange abroad. I designed the site’s page templates, optimised for a CMS, as well as a plug-in.

The plug-in is a solution that I helped to develop in response to the client’s need for a repository of student profiles. The profiles are ordinarily featured one at a time on the homepage however the client wanted a way to make all of them accessible at once.

Working with the information architect and a developer, I developed the styles to match the overall look-and-feel and to allow for easy repurposing on various pages in the site.