The University of British Columbia and Telus Health are creating an eMental Health clinic to connect patients with qualified mental health professionals. I collaborated with their teams to design and implement a landing page for their virtual clinic.
University of British Columbia and Telus Health
The COVID-19 pandemic has left many Canadians struggling with isolation and mental health issues. To address this, The University of British Columbia (UBC) and Telus Health joined forces to create the UBC COVID-19 Mental Health Clinic. In order to operate, the virtual clinic needs a landing page.
The team had a short timeline for this project, so we needed to design and iterate quickly and efficiently.
Design an intuitive and responsive landing page following UBC’s Design System to welcome patients and clinicians to the UBC COVID-19 Mental Health Clinic.
In our first meeting between myself, UBC, and Telus Health, I focussed on aligning the team around shared goals for the project. I communicated my design process and how we would complete this projection in the short timeframe they had.
I explained my process for this project as having three layers, the content, the layout, and the visual style. Once their team agreed on the content of the site, I would create wireframes of the layout. After that, I would add the visual style from UBC’s Design System. This helped the process move smoothly and allowed for clear feedback and quick revisions.
The client gave me a powerpoint with the content and we discussed their preliminary ideas for how they wanted it laid out. Some ideas included a prominent hero image and three sections for their three different users.
After hearing their ideas, I offered my suggestions for how we could strengthen them. for example, the clients wanted the CTAs to be hyperlinks, so I explained how using buttons to signal possible actions would be more clear and prominent, making it easier for users to understand where to click and what actions can be performed.
I narrowed down my design in my wireframes. I followed our visual design strategy, creating ample whitespace, clear typographic hierarchy, and responsive design. I paid attention to small details such as ensuring optimal button spacing and line length for text across device sizes according to design best practices.
I worked with UBC’s Design System to create the landing page. All the components were easy to find on their website and made it easy to implement.
We wanted to create more visual interest with the hero section to grab users’ attention. Below are some of the explorations.
After some final tweaks to the content, the client was very happy with the design. Once the design was finalized, I implemented it using Wix, which was the client’s preferred website builder.
The UBC COVID-19 eMental Health Clinic will help clinicians provide accessible mental health care to Canadians.
During this project, I made sure to explain my design decisions to my client so they understood why I designed things the way I did. I felt confident in my ability to advocate for my designs and explain my thought process.
I really enjoyed working with the UBC and Telus Health teams. This project was a great learning experience for me when it came to communication and collaboration with clients. I learned how important it is to be prepared going into a client meeting with my meeting agenda and a list of any questions I have for the client. As well, at the end of the meeting, I learned to set a date and time for the next meeting to ensure we stayed on top of things.
For this project, I got to work with the UBC Design System. It was great practice implementing a Design System in my work and creating consistency across experiences.
© Desiree Chek, 2021