Case study
Case study
Case study
Industry Design Project
Electric Vehicle Fleet SaaS
Industry Design Project
Electric Vehicle Fleet SaaS
Industry Design Project
Electric Vehicle Fleet SaaS
For this project, I collaborated with a team of two other designers to create the user interface (UI) for a SaaS platform for EquiCharge Solutions, a Canadian company specialising in electric vehicle fleet management.
This project involved creating wireframes, journey maps, and personas to design a SaaS platform from the ground up, primarily leveraging the company’s simulation-based consulting and implementation of electric vehicle fleets.
Project Context and Aims
Project Context and Aims
Main Project Goal:
The main goal for the project was to develop wireframes, mockups, and personas and journey maps for EquiCharge's SaaS platform.
Reasons for this development (company’s perspective):
The Company had previously utilised a static consulting model of face-to-face consultation for Electric Vehicle Fleet Management, the process and planning of which would often take 8-12 months. Their solution (and our problem to solve) was to create an iterative, scaleable, and dynamic planning SaaS (Software as a Service)platform that would improve upon the existing model. An additional motivation for the development of this platform is to match the requirements under Canada's current Net-Zero Act targets of 20 per cent emissions reduction (against 2005 levels) by 2026, a 40-45 per cent reduction by 2030 and achieving net-zero by 2050.
Main Project Goal:
The main goal for the project was to develop wireframes, mockups, and personas and journey maps for EquiCharge's SaaS platform.
Reasons for this development (company’s perspective):
The Company had previously utilised a static consulting model of face-to-face consultation for Electric Vehicle Fleet Management, the process and planning of which would often take 8-12 months. Their solution (and our problem to solve) was to create an iterative, scaleable, and dynamic planning SaaS (Software as a Service)platform that would improve upon the existing model. An additional motivation for the development of this platform is to match the requirements under Canada's current Net-Zero Act targets of 20 per cent emissions reduction (against 2005 levels) by 2026, a 40-45 per cent reduction by 2030 and achieving net-zero by 2050.
User Demographics:
Engineering and Consulting Firms and Vehicle Fleet operators, Architects,Engineers and Construction firm personnel both private and public.
Understanding the goals and objectives of EquiCharge Solutions and their Digital Fleets platform.
Developing wireframes and mockups for the Digital Fleets platform based on user requirements and business goals.
Incorporation of iterative improvements and changes based on feedback from the company.
Creating personas that represent the target audience & their characteristics.
Journey mapping to both visualise and understand user behaviours and interactions with the platform.
Collaborating with EquiCharge's team to ensure the deliverables align with their vision and objectives as well as validation and refinement of the deliverables.
User Demographics:
Engineering and Consulting Firms and Vehicle Fleet operators, Architects,Engineers and Construction firm personnel both private and public.
Understanding the goals and objectives of EquiCharge Solutions and their Digital Fleets platform.
Developing wireframes and mockups for the Digital Fleets platform based on user requirements and business goals.
Incorporation of iterative improvements and changes based on feedback from the company.
Creating personas that represent the target audience & their characteristics.
Journey mapping to both visualise and understand user behaviours and interactions with the platform.
Collaborating with EquiCharge's team to ensure the deliverables align with their vision and objectives as well as validation and refinement of the deliverables.
Main Project Goal:
The main goal for the project was to develop wireframes, mockups, and personas and journey maps for EquiCharge's SaaS platform.
Reasons for this development (company’s perspective):
The Company had previously utilised a static consulting model of face-to-face consultation for Electric Vehicle Fleet Management, the process and planning of which would often take 8-12 months. Their solution (and our problem to solve) was to create an iterative, scaleable, and dynamic planning SaaS (Software as a Service)platform that would improve upon the existing model. An additional motivation for the development of this platform is to match the requirements under Canada's current Net-Zero Act targets of 20 per cent emissions reduction (against 2005 levels) by 2026, a 40-45 per cent reduction by 2030 and achieving net-zero by 2050.
User Demographics:
Engineering and Consulting Firms and Vehicle Fleet operators, Architects,Engineers and Construction firm personnel both private and public.
Understanding the goals and objectives of EquiCharge Solutions and their Digital Fleets platform.
Developing wireframes and mockups for the Digital Fleets platform based on user requirements and business goals.
Incorporation of iterative improvements and changes based on feedback from the company.
Creating personas that represent the target audience & their characteristics.
Journey mapping to both visualise and understand user behaviours and interactions with the platform.
Collaborating with EquiCharge's team to ensure the deliverables align with their vision and objectives as well as validation and refinement of the deliverables.
Deliverables
The final deliverables included presentation and submission of comprehensive wireframe documentation of the mockups, personas, and journey maps. Including: Wireframes, Developer Hand-off, UI style guide and Design System, components and other UI and design assets.
Personas
Journey Maps
SaaS Wireframes
The final deliverables included presentation and submission of comprehensive wireframe documentation of the mockups, personas, and journey maps. Including: Wireframes, Developer Hand-off, UI style guide and Design System, components and other UI and design assets.
Personas
Journey Maps
SaaS Wireframes
SaaS Wireframes Included
SaaS Wireframes Included
Dashboard
Live Map Explorer Interface
Configuration for:
a.Vehicles
b.Fleetc.Facilities/Properties
d.Energy Resources
e.Human Resource
Simulation Interface comprised of a control panel and a scenario optimiser
Reports and Analytics Dashboard
I was responsible for designing and building screens 1 and 3a-e
Dashboard
Live Map Explorer Interface
Configuration for:
a.Vehicles
b.Fleetc.Facilities/Properties
d.Energy Resources
e.Human Resource
Simulation Interface comprised of a control panel and a scenario optimiser
Reports and Analytics Dashboard
I was responsible for designing and building screens 1 and 3a-e
Design Constraints
Design Constraints
With these deliverables, we were provided also with the company Logo which gave us both primary colours & typography style, this served as both our constraints and design limitations. Beyond this, we were provided with a example of a simplistic menu accompanied by images representative of the content and elements to be included for each page.
These initial requirements were built upon throughout the 4 week process, resulting in 12 extra pages with many more elements & features than the initial 4 screens identified & requested by the company.
This difference in the initial number of pages asked for and the final number of pages highlights the importance of the UX UI role in a business venture such as this, in that essential and accompanying components were identified and made without any prompting from the company.
With these deliverables, we were provided also with the company Logo which gave us both primary colours & typography style, this served as both our constraints and design limitations. Beyond this, we were provided with a example of a simplistic menu accompanied by images representative of the content and elements to be included for each page.
These initial requirements were built upon throughout the 4 week process, resulting in 12 extra pages with many more elements & features than the initial 4 screens identified & requested by the company.
This difference in the initial number of pages asked for and the final number of pages highlights the importance of the UX UI role in a business venture such as this, in that essential and accompanying components were identified and made without any prompting from the company.
One of the main challenges was identifying the best method for organising what would eventually become content-heavy pages into an accessible and intuitive format for users.
One of the main challenges was identifying the best method for organising what would eventually become content-heavy pages into an accessible and intuitive format for users.
Working as a group, we divided the project into it’s main flows and took one on each.This was after I had made and shared red routes to identify critical screens & a user flow that included aspects such as logging in and understanding how the menu and navigation would work. After sharing this with the project team, I began constructing the configuration pages and dashboard.
We had weekly meetings with the CTO and meetings amongst ourselves where we made decisions about our designs and brainstormed solutions. After we had created our UI kit, we were able to work independently on our assigned screens. Toward the end, I suggested a round of in-house user testing whereby we would go through each others screens, acting as users to identify flows, missing elements (like buttons or icons), utilising this technique, we identified a handful of necessary adjustments which we then incorporated into our designs.
Working as a group, we divided the project into it’s main flows and took one on each.This was after I had made and shared red routes to identify critical screens & a user flow that included aspects such as logging in and understanding how the menu and navigation would work. After sharing this with the project team, I began constructing the configuration pages and dashboard.
We had weekly meetings with the CTO and meetings amongst ourselves where we made decisions about our designs and brainstormed solutions. After we had created our UI kit, we were able to work independently on our assigned screens. Toward the end, I suggested a round of in-house user testing whereby we would go through each others screens, acting as users to identify flows, missing elements (like buttons or icons), utilising this technique, we identified a handful of necessary adjustments which we then incorporated into our designs.
The Design Team
The Design Team
Style guide & UI Kit we created, adjusted and added to along the way
Style guide & UI Kit we created, adjusted
and added to along the way
Dashboard with Cards
Examples of Cards
Cards used by Team
Screen Progression Iteration 1
Screen Progression Iteration 4
Screen Progression Iteration 7
Final Iteration & Delivery
Final Iteration & Delivery
Extra Delivery!
I created a high-fidelity mock-up as an extra deliverable in the style that the CEO had mentioned he liked in our first meeting to accompany the wireframes the team and myself had constructed.
We also conducted some in-house user testing to better understand the user experience and to workshop solutions to any problems that arose.
Extra Delivery!
I created a high-fidelity mock-up as an extra deliverable in the style that the CEO had mentioned he liked in our first meeting to accompany the wireframes the team and myself had constructed.
We also conducted some in-house user testing to better understand the user experience and to workshop solutions to any problems that arose.
This SaaS design project for an enterprise electric vehicle fleet company was a fantastic learning experience. It pushed me to learn about and understand a completely new industry.
Collaborating with my design team offered valuable insights into different design approaches and workflows.
A key challenge of this project was empathising with the needs of unfamiliar user base, having little prior knowledge of electric vehicle fleet operations, I had to rely on extensive research and collaboration with my team to design a solution that resonated with the needs of the company.
This SaaS design project for an enterprise electric vehicle fleet company was a fantastic learning experience. It pushed me to learn about and understand a completely new industry.
Collaborating with my design team offered valuable insights into different design approaches and workflows.
A key challenge of this project was empathising with the needs of unfamiliar user base, having little prior knowledge of electric vehicle fleet operations, I had to rely on extensive research and collaboration with my team to design a solution that resonated with the needs of the company.
A note on my experience
A note on my experience
Comments from the CTO
"I am pleased to share that the company awarded us an overall rating of 5/5. Notably, we received perfect scores in Communication, Critical Thinking, Creativity, Professionalism, and Employability. It's gratifying to see these high ratings, and I'm proud of the contribution I've made to help us achieve this success."
Comments from the CTO
"I am pleased to share that the company awarded us an overall rating of 5/5. Notably, we received perfect scores in Communication, Critical Thinking, Creativity, Professionalism, and Employability. It's gratifying to see these high ratings, and I'm proud of the contribution I've made to help us achieve this success."
“It was a pleasure working with this team. They were all extremely engaging and took their time to understand our project needs. The project's execution went very smoothly, and we are very excited about the results”
“Eloise showed great attention to detail and strong problem-solving skills throughout the project. She was very engaged and took the time to understand our complicated solution.”