RBC Technology & Operations Design Hub

Note: Due to company policies, some information has been excluded*

My Role

UI/UX Designer, Prototyping

Team Members

Kaitlin English (Developer),
Melody Chu & Winnie Zhan (Graphic Designers)

Tools Used

Figma, HTML, CSS, Illustrator

Duration

Ongoing project

Problem

Designers on our team were finding it hard to quickly scan through the Design Hub to find the resources they needed. Looking for assets would take more time and effort. This website is also used by employees from different departments to submit a design or video request, but this section was hard to find and easily missed. It was also difficult to digest the instructions on the request forms.

BACKGROUND

"RBC Technology & Operations (T&O) Design Hub is an intranet where employees can find design assets, templates, tutorials and submit a design or video request."

Solution

In order to make it easier to find resources, here are the key methods I proposed to help break down the information on the pages.

📍

"Popular Resources" section to quickly find most used resources

📂

Thumbnails to give context and know what each resource is

🗓

Section dedicated to "Design & Video Requests" as the call to action

📚

Request Form instructions broken down into steps through a timeline

Persona

Predicated on the problem and key information, a persona was created to identify and list the user's goals, needs and frustrations.

Current Design Hub Layout

Brainstorming (Sketches)

Mid-Fidelity Wireframes

Takeaways

How to 3D Model in Cinema 4D

Prior to this project, I had never used Cinema 4D before. It was a huge learning curve for me because I did not know how to 3D model. But, after watching many tutorials and making many iterations I became more comfortable using this program. I enjoyed the challenge of learning a new program and incorporated multiple 3D models in my project because I had a lot of fun working on it.

Working within the Scope of the Project

Since I wanted to have complicated 3D models with a lot of rounded shapes, it was not possible to load them into the browser without lagging and a long wait time. I had to make the shapes less complicated and use low-poly shapes to decrease the file size.