PHILIP CHEUNG

Project Overview

Richmond Alternative Medical Clinic Website

With over 20 years of healing patients in Richmond, BC, the Richmond Alternate Medical Clinic (RaMc) is a trusted clinic that provides alternate medical care. I was tasked to redesign and develop their aging website. The main KPI was to rank their website higher on Google.

My Role

UI/UX 

Time

3 Months

Platform

Web

Programs

Webflow
Photoshop
Adobe Xd

Deliverables

Content Strategy, UI, UX, Development

Contributors

Chloe Kwok, Illustrator

The Challenge

The challenge was to redesign their website to be more engaging and adhere to modern web standards. Easy access to contact the clinic was of the highest priority. Further, the client needed a platform that made it easy to make changes without contacting a developer to make changes on the site.

Approach

How I Did it

In the span of 3 months I used this process:

1) Project Requirements

2) UX Research & Content Strategy

3) UI Design

4) Development

Design Process

Requirements

My client did not want changes the old site's content

1) Homepage is too short, could contain more information, people are used to scrolling down for long periods.

2) The number 3000+, 100+ are nice, caught attention, but more social proof would be better, such as big brand names, maybe testimonials.

3) There was no contact page. People kept looking for it.

With the research completed, our team conducted a meeting outlining how the content strategy for how the website will be done. From the meeting, the copy team & design team worked closely together to create wireframes (its hard to design without the real copy first).

The Information Architecture of the site

Wireframes

Low Fidelity

With the content strategy completed, the design team jumped into low-fi wireframing. We iterated 3 times in this process getting feedback from the whole team in each iteration. Most of my contributions were in this phase of the project.

The final round of wireframes of the entire website.

Hi Fi Wireframes

With the low-fi mockups approved by the project manager, the design team created the Hi Fi mockups. The copy team handed us the written content and everything was coming together. The most challenging part of this phase was short deadline in which this phase needed to be completed.

The final round of wireframes of the entire website.
This is some text inside of a div block.

Development

When the Designers hands it Off to the Devs

Using Adobe Xd as our tool for our devs to "inspect" the design, our team passed the design to the tech team for an another technical review. Additionally, the design team handed off all necessary files for the tech team to build the site.

The Final Site

Below are the images of the competed 2019 VSW website.

This is some text inside of a div block.

Outcomes

Project Outcomes

The 2019 Website drew in X traffic, X ticket sales, etc. The event was more successful than previous years.

Personal Outcomes

My biggest learning outcome was the importance of looking for visual errors (mis-alignment, inconsistency in typography, etc). One must scan their designs multiple times before handing the design over to the developers.

Continue Exploring

UI/UX
Product Design

IoT Smart Controller

A case study of a IoT floor controller for a multi-floored building

VIEW PROJECT
Branding
WEb Design

WIC Marketing

Brand identity and web design for one of Canada's largest seasonal distributors.

VIEW PROJECT
UI/UX
Product Design

Interviewr

A template based interviewing web application for creating, conducting, and managing hiring interviews.

View Project