Built around your vision.

Oak Counselling website design

Client: Oak Counselling, Vancouver, Canada
My roles: Website designer
Oak Counselling Services Society is a non-profit that offers counselling services to Vancouver and surrounding areas. Their original website was built many years ago and the team decided for a re-design and later re-development.

I worked with Oak's Executive Director and a number of client-facing volunteers on putting together ideas for the new look of the website and the design building process was a very collaborative one. The final design featured a nature-inspired theme with content images picked by the client's team from a selection of images focused around mental health that I prepared for them.

Home page final design

The design package

The design package included a home page, a form page and a long content page design, ready to be used by a web developer as templates for building the entire site.

A content page final design
A form page final design

The design process stages

The design process begun with a review of other websites and inspiration images that the client's team liked. I also reviewed their current website and the type of content that it contained. Based on this information, I created three different mockup designs in order to find out what kind of feel the team liked.

Alternative design mockup 1
Alternative design mockup 2

I followed up by making changes to the selected design to create the home page first. The home page design was a combination of element shapes and colors that the client's team voted on. The home page went through a few iterations until everyone was satisfied with the final outcome. I managed this collaborative process by differentiating individual design elements (shapes, fonts, colors, etc.), discussing each elements with the client's team first and then bringing the elements together with the team's preferences in mind.

Once the home page was finished and agreed upon, I created additional pages based on the home page theme, so that the team could get a sense of what the full new website would look like. These page iterations needed small adjustments before they were signed off by the client.