BlueCat Learning Shopify Site

BlueCatLearningScreen

Project Details

During my coop term, I got the chance to redesign BlueCat's webpage where they sell their training courses. BlueCat has 4 instructor-led classes and an e-learning platform that provides training on its products. For this project, I was the main designer and I received information and directions from the Learning team. My role included redesigning the site and creating graphics for the site.

Team

  • 1 Designer
  • 2 Learning Administrators

My role

  • Providing UX advice
  • Creating icons and photos
  • Creating Mocks to help visualize the end goal of site

Duration

1 month

The Process

1

Understood the Environmental Space

Through meetings with the Learning Administrators, I got an understanding of the problem space. This information helped me to inform my design.

Pain Points

  • The current site did not align with BlueCat's branding
  • Receiving multiple emails asking about the dates of the courses
  • Receiving many emails asking for more information about the courses
  • The learning team has many PDFs about the courses. However, there is no access to the PDF from the webpage.

The Goal

  • Adding more content overall
  • Aligning with BlueCat branding
  • Creating logos and icons for different products (i.e differentiating between elearning and ILT).

User Flow

  • Users start from BlueCat's website and then go to the Shopify page. Thus, need to ensure a smooth transition from the BlueCat website to the Shopify page.
  • The majority of users purchased e-Learning compared to instructor-led

2

Design Phase

With the information given, mocks were created in Sketch. Meetings were held to discuss the design while the mocks were being made.

Challenges

During this project, I worked with two learning administers. Sometimes opinions between the two varied which made it hard to understand the direction of the project. Another challenge was that mock kept changing as new ideas came up. In the end, we just decided to stick with what we had at the moment and start the development stage.



3

Development Phase

As the page got developed, the learning administrator had notified me of design changes due to technical constraints and got my opinion as we went along. Before the site got launched we had looked it over together to check for errors. It was an exciting day as we were both thrilled to see the site launch.

Photo taken on Launch Day of Site:

LaunchDayPhoto
Link to the mocks