Design Document
Electrical Vehicle Charging Booking
System
(Sample Provided for INFS3202/7202 Design Document Assessment)
Submitted by
Student: Firstname, Lastname
Student ID:
Electrical Vehicle Charging Booking System 2
Table of Contents
Overview .......................................................................................................................................................... 3
Key Features .................................................................................................................................................... 3
Database Design ............................................................................................................................................. 5
Mockups ........................................................................................................................................................... 6
Technology Research ..................................................................................................................................... 7
Timeline ............................................................................................................................................................ 8
References ....................................................................................................................................................... 9
Electrical Vehicle Charging Booking System 3
Overview
This design document outlines the development of a SaaS web application for an Electric
Vehicle (EV) charging station booking system. With the surge in EV purchases, drivers are
increasingly seeking reliable charging options, especially when traveling to new cities.
While the rise of EVs increases environmental sustainability, the scarcity of easily
locatable charging stations presents a challenge. This platform aims to bridge the gap
between EV drivers and charging station providers, including commercial vendors and
private households, enabling them to rent out their charging facilities at specified times.
The target audience for this project includes EV drivers looking for convenient charging
solutions and charging station owners interested in monetizing their facilities. By facilitating
a connection between these two groups, the system not only supports environmental
sustainability efforts but also ensures charging stations are utilized efficiently. This service
will offer a straightforward signup process and a comprehensive booking system, filling a
gap in the market for an accessible, user-friendly platform dedicated to EV charging
needs.
The application will initially launch as a web-based platform, developed using the
CodeIgniter MVC framework to ensure a scalable, secure, and maintainable architecture.
Data management will be handled through the MySQL relational database system,
emphasizing security and integrity. While the primary focus is on creating an accessible
and responsive user interface suitable for various devices, the development of a native
mobile application will only be considered for future phases.
Key Features
Each of these features is designed with the user experience in mind, ensuring that both
vendors and drivers can navigate the platform with ease:
• Administration Dashboard
An admin dashboard will be integral for managing the ecosystem of EV charging
station vendors and EV car owners/drivers. This feature will facilitate the oversight
of user activities and resolve disputes.
• Vendor Registration and Management
Vendors can register on the platform, after which they'll have access to a dashboard
allowing them to manage their profile. This includes adding their charging station's
location via longitude and latitude, setting available charging times, and viewing
bookings. This ensures that vendors have full control over their listings and can
adjust their availability as needed.
• Booking Trend Insights for Vendors
Beyond basic management functionalities, vendors will have access to insights
regarding projected revenue and booking trends. This data-driven feature will help
vendors understand demand patterns and optimize their availability and pricing
strategies.
Electrical Vehicle Charging Booking System 4
• EV Driver Registration and Management
EV drivers can easily register and log into the platform, where they can manage
their profiles, view their booking history, and access other relevant functionalities.
• Charging Station Discovery and Booking with Maps
A pivotal feature for EV drivers is the capability to locate charging stations using an
interactive map, which displays options based on location, availability, and other
specified preferences. This integration of mapping technology allows users to
visually navigate and identify the most convenient charging stations in real-time.
Once a suitable station is found, drivers can book a charging slot directly through
the platform. This streamlined process aims to minimize the hassle associated with
finding and securing charging stations, especially in unfamiliar areas.
Database Design
The database is designed to allow users to assigned to both a vendor and be an EV driver. Vendors can have multiple
charging stations. EV drivers can make multiple bookings.
Mockups
[HTML Mockups are not provided in this example document. In this section you can
include a few screengrabs and refer to the HTML files that are submitted with your
assessment item.]
Electrical Vehicle Charging Booking System 7
Technology Research
It is crucial to evaluate different mapping services based on their features, customization
capabilities, and compatibility with React Native for future mobile app development. Below
is a comparative analysis of three popular mapping services/libraries: Google Maps,
Mapbox, and Leaflet.
Feature Google Maps Mapbox Leaflet
Custom Icons Yes, supports custom
icons for markers and
can dynamically
change icons based
on the application's
state or data.
Yes, offers extensive
support for custom
icons and allows for
dynamic updates to
reflect real-time data.
Yes, easily supports
custom icons for any
map marker, with
straightforward
implementation.
React Native
Compatibility
High, with a well-
maintained React
Native library (react-
native-maps) that
wraps the native
Google Maps SDK.
High, offers a React
Native SDK (react-
native-mapbox-gl) that
provides
comprehensive
mapping features.
Moderate, no official
React Native support,
but can be integrated
using third-party
libraries like react-
leaflet-native or by
wrapping Leaflet in a
WebView.
API Features Extensive, including
detailed maps, Street
View, real-time traffic,
route planning, and
more.
Rich set of features,
including
customizable maps,
real-time traffic,
navigation, and more.
Basic, focused on
map display and
interactions;
advanced features
require integration
with other services.
Pricing Based on usage, with
a free tier and pay-as-
you-go pricing for
higher usage levels.
Free tier available,
with additional costs
for higher usage or
premium features.
Free and open-
source, but may
require paid access to
certain tile providers.
Ease of Use User-friendly with
extensive
documentation and
community support.
Highly customizable
and developer-
friendly, with good
documentation.
Simple to use for
basic purposes,
extensive community
plugins for additional
features.
Based on this evaluation Mapbox has been chosen as the mapping library that will be
used in the project It provides a good balance between extensive customization options
(support for custom icons and detailed mapping features), React Native compatibility, and
a developer-friendly pricing model.
Timeline
The timeline allocates time across different phases, ensuring that each critical aspect of the development process is allocated
sufficient time for an individual developer to implement. The web application will be deployed and released at the end of May
2024.
[Note: This is a real-world timeline and includes some items that are not required in your student project assessment]
• Planning (1-2 weeks):
Initial phase focusing on gathering requirements, selecting technologies, and creating initial mockups.
• Design (2 weeks):
Detailed database design followed by the finalization of UI/UX mockups.
• Development (5 weeks):
Setting up the development environment, followed by focused periods on backend and frontend development, and
integration testing.
• Testing & Deployment (3 weeks):
Conducting user acceptance testing, addressing any issues, deploying the system to production, and reviewing post-
deployment.
References
CodeIgniter. (2024, Feb 29). https://www.codeigniter.com/
Google Maps Developer Platform. (2024, Feb 29). https://developers.google.com/maps
Leaflet. (2024, Feb 29). https://leafletjs.com/
Mapbox. (2024, Feb 29). https://www.mapbox.com/
Use of GenAI and other tools:
• DALLE 3 via ChatGPT was used to generate the image on the cover page and the
logo used in the page headers.
• ChatGPT was used to help brainstorm the timeline tasks and generate the Gantt
Chart in Mermaid.js format.
• Used https://kroki.io/ to preview DBML but rendered the DBML ER diagram in
https://dbdiagram.io/
Electrical Vehicle Charging Booking System 10