UBC-02

OVERVIEW

This was such a fun project to work on with UBC!  I had the opportunity to help them design an interactive storytelling website! 

 

 

END RESULT

We won an award for the website design! An Award of Excellence, Creative Design, Gold Quill Awards.

ROLE

Lead UX/UI Designer, UI Design, User Experience Design, Collaboration with UBC, focus on Mobile and Desktop

DESCRIPTION OF PROJECT

At my last company, Ballistic Arts, I would present to many important clients, such as UBC. We had such a fun and creative project with them, I expressed my concern over the proposed creative idea that UBC presented to us as we were under a tight timeline. I communicated to UBC that, due to the timeline we can offer storytelling type of design and it can be completed within the estimated time. UBC loved the project so much to the point where they’re re-using the layout each year! 

Website: https://biomedicalinnovation.pathways.med.ubc.ca/

Background

I got the opportunity to work with the UBC marketing department at a past company I worked at, Ballistic Arts! This was such a huge and important client and they proposed an idea to us that was out of scope as they were looking for the New Yorker interactive style, where just the creation of 3D elements would take months and months! Which we didn’t have that timeline, as UBC was wanting it within a 2 month period and so I collaborated with the graphic designer along with the developer on the project to see what was possible, then from there I said why don’t we create a storytelling website! 

Some key achievements of which I have listed below:

We won an Award of Excellence, Creative Design, Gold Quill Awards. This project tested my skills and I learned more about myself, where if I’m put under pressure, I quickly can think on my feet and come up with a solid solution.

Produced a reusable product. The overall user flow of this website and also layout was appreciated by UBC that now they reuse the same layout for when they come out with a new online magazine every year!

 

Low-fidelity and Site Structure

After brainstorming about what would be the best solution in providing a product that UBC would be happy with and also meets their deadline. I then created low-fidelity wireframes to help organize the user-flow and present to the UBC marketing department to be clear with how many pages we are creating.

 

Wireframes

Creation of low-fidelity wireframes was extremely important for this project as I needed to present these to the UBC marketing department which allows everyone to think about what is the most important while reviewing each page, we can sort out anything that is missing, any sections and also focus on the overall user flow of the website. Of course, I would like to showcase more of the pages, but you get the idea!

End Result

After many meetings, presentations, iterations, working with the graphic designer, collaborating with the developers, we were able to produce an amazing website that is still to this day being re-used as a template! I feel extremely proud of this achievement!