UX Prototype

This prototype was developed for one of my projects during my study at BCIT with the objective of redesigning Compass transportation's website for reloading cards. This process began with the planning stages of creating information architecture all the way through coding key testable functions. Based on the goals of Compass, the transport company.

Header Image UX Prototype

Technical Sheet:

The goal of this project was to redesign the existing website for Compass Card, the public transit company in Vancouver BC. The focus of the project was addressing the online reloading system for the tap card.The system lacks a painless method for commuters to load money or monthly passes onto their tap card. Based on the goals of Compass, my final product attempted to enhance the user experience of the existing site.

The most important step in building a successful product was identifying the goals of Compass, and what they hoped to achieve with the card system. After researching the problem, I concluded that some important goals were increasing revenue, and gaining more monthly pass users.


Technologies And Skills:

Code technologies I got involved while working on this project.

  1. HTML5
  2. CSS
  3. Javascript / jQuery
  4. Adobe Illustrator
  5. Balsamiq
  6. Wireframing
  7. Information Architecture
  8. Content Modeling
  9. User Experience

The Objective:

The design of the prototype is focused around easily clickable buttons and legible fonts. The basic structure allows the user to click exactly which button they want, and not be distracted by too much information on the page.