E-space
Airbnb for electric vehicle chargers connecting drivers with the charger operator companies.
We designed and developed IOS & Android apps consumers use to charge their cars and business dashboard companies use to manage their chargers, pricing, transactions and get analytics.
This case is focused on Mobile App.
e-space.geWe are responsible for
Scope:
Dedicated agile team
Team:
5 people
Duration:
12 months
Challenge
In Georgia, the number of electric vehicles is growing slowly. Transition to an environment-friendly transportation is limited by the lack of proper charger infrastructure for electric vehicles.
Solution
We designed and developed a system that lets different companies bringing EV chargers to Georgia connect to the Espace network and let car owners access all the chargers via mobile application.
-1717161514.png&w=3840&q=75)
-1717161516.png&w=3840&q=75)
-1717161518.png&w=3840&q=75)
Locate a Charger
Users can easily locate chargers on a map. Distinguishing between commercial/non-commercial and Lvl 2/Fast chargers is made easy by a special icon set.
Additionally, live charger data is provided to identify which chargers are currently busy, available, or out of order. User can also easily filter down the chargers and plan their routes to the charger.
-1718027780.png&w=3840&q=75)
-1718027783.png&w=3840&q=75)
-1718027785.png&w=3840&q=75)
-1718027787.png&w=3840&q=75)
Initiate Charging
User initiates a charging session from a charger’s screen, which user accesses by tapping a pin on the map, scanning the charger QR code, going through favorites or chargers list.
Prior to initiation of a charging session user sees the pricing and selects a connector suitable for her car. User can charge two cars simultaneously.
.png&w=3840&q=75)
.png&w=3840&q=75)
.png&w=3840&q=75)
Charging Process & Billing
User can either predefine an amount, charge her car until the battery is full or until she manually ends the charging session. User selects a payment method and the app communicates with the charger hardware to initiate the charging process.
During charging user sees live data of charging and billing status. She can end the session right from the app. User also gets a notification when the battery is full.
When the charging ends, the payment transaction is made and the user sees the summary of the session.
.png&w=3840&q=75)
.png&w=3840&q=75)
.png&w=3840&q=75)
.png&w=3840&q=75)
Other Features
User accesses other features from the burger menu. She can view transactions list and see the details of each charging session. User can also see the pricing, faq, personal settings and contact customer support with Intercom chat.
Involvement & Process
User Research
We conducted 1-on-1 and group interview sessions with electric vehicle owners to identify and get a deep understanding of the problems they faced when they needed to charge their cars. We created user personas and consumer journey maps.
Together with the client, we held ideation workshops to come up with solutions to specific pain points.
UI/UX & Prototyping
We started with the sketching workshops which was followed by creating user flow diagrams. After that, we moved to wireframing and created a prototype in Figma. We tested the prototype with users, got feedback and iterated over UX design.
After that, we moved forward to create the design system for the app interface. Our team designed the UI and built a UI prototype in Figma. We tested it with users, got feedback on the design and copy, and did iterations.
Mobile App Development
Our team used React Native to build a cross-platform mobile application. The process was based on the SCRUM framework with 2 week long sprints. At the end of each sprint, the code was reviewed by our lead developer. The development process was test-driven. We used Detox for e2e testing and Jest for frontend unit tests. The code quality was maintained with the help of ESLint and its integrations. The codebase was managed on Github and on each commit or pull request the code was tested automatically. On failure, our team was notified on Slack.
App Backend & API
We used Laravel to build the application backend and APIs. The development process was test-driven and based on SCRUM with 2 week-long sprints. We used the PHPUnit library for automated tests and had weekly code reviews to sustain and enhance code quality. Laravel logger was integrated with Slack to alert the team about any errors. We used Firebase to send events and notifications to the mobile application.
Middleware Development
We created a middleware to integrate our system with low-level charger hardware APIs. Our middleware translates data provided by the chargers to higher level process logic like the start and end of the charging process, live information about the charging session including energy consumption, live information about chargers including active, busy, out of order, etc. The middleware was implemented using Laravel and is managed using the Nova admin panel.
Devops & Production
Our team set up CI/CD pipelines with GitHub Actions. We had separate environments for development, staging and production. Infrastructure is in cloud and is based on AWS.
Meet the authors
We are a 200+ people agency and provide product design, software development, and creative growth marketing services to companies ranging from fresh startups to established enterprises. Our work has earned us 100+ international awards, partnerships with Laravel, Vue, Meta, and Google, and the title of Georgia’s agency of the year in 2019 and 2021.
