Clenergy EV Driver's app new user

arrow_back

Back to Work

arrow_back

Back to Work

arrow_back

Back to Work

Clenergy EV Driver's app new user

Encouraging and enabling guest users to register an account with ease

Challenge

I worked at Clenergy EV, a startup EV charge point management software company, as their sole product designer, across their driver's app and owner's admin portal. Allowing drivers to charge their EV with the app as a guest is essential to the user experience, giving the option to start charging quickly and easily. Despite that, there are benefits for both the business and the driver for them to register an account, and conversions were low. Given the two user flows are intertwined, the task was to update both so they fulfilled their purpose as much as possible.

Process

I audited the existing guest and new user flows, which uncovered usability issues and offered opportunity to improve and enhance, and carried out competitor analysis and researched flows from other sectors to reveal design pattern commonalities. While a full overhaul was out of scope, the potential to update key screens and improve UX aspects was clear.

Solution

I designed updated flows for the full guest experience, and conversion to new user registration, both stemming from an updated landing screen. While being restricted to how far I could push things due to time and resource, I managed to introduce improved usability patterns, and took the opportunity to bring in a few new elements from a brand update that had recently been rolled out to the company's marketing website.

Role

Senior Product Designer

Year

2024

Contribution

UX, UI, Design System, Prototypes, Research

Platform

Web, app

How the Guest screens looked BEFORE I joined the company

Discovery

Clenergy's admin tool showed that the number of users converting from guest to fully registered accounts was low. Being a guest offered the user the chance to instantly find a charger, so that aspect of the experience couldn't be much quicker. But it was visibly clear that the alternatives to guest charging were only shown on the initial landing page, and the benefits of which weren't highlighted at all.

If a driver did decide to register during this flow, the process was convoluted. Additionally there was no prompt to encourage the user to register at any stage, whether literally or by the confused weighting of the UI options on the landing page. This discovery clearly highlighted that the landing page was a source of friction, as the presentation of UI options increased cognitive load on the user.

Reviewing the inherited designs in depth, it confirmed there were issues with continuity, with multiple versions of some components, further affecting streamlined user experiences.

Ideas had to be sold in to stakeholders to justify the work, so I put together a presentation piece, showing the various flows that stemmed from the landing page. This gained the approval, albeit with some restrictions, mainly for time and technical reasons.

Outgoing and incoming designs for the driver's app landing screen

Design

The timing of the task also offered an opportunity to introduce aspects of the company's new brand refresh. A third party agency had updated branding, along with a new public-facing, marketing-led website.

The scope of the task would be too great to update the brand elements fully, so we settled on the landing screen featuring elements of the main website homepage, bridging the gap between the old and new brand styles.

The UI of the landing screen was simplified to avoid multiple buttons wrestling with each other and reduce friction, offering 3 potential routes - 'Create an account', 'Login', and 'Continue as Guest', with the button weighting in that order.

Design

Selected screens from the NEW Guest experience flow

Taking the guest route first, I added a secondary screen that outlined the benefit of creating an account, with 3 key factors highlighted that they'd gain by registering. Once into the guest flow, a 'Create account' button was added in the header, to give users an opportunity to register at any stage in their flow, instantly reducing friction.

From here, having not taken the opportunity, the encouragements were introduced with a lighter touch, and in context of the page - so when adding card details a reminder that a registered account offers payment flexibility and lower prices, and the opportunity to save card details for fasting access to car charging.

Once their car was up and charging, research revealed this was a moment when the driver was likely to have a spare pocket of time, so the opportunity to highlight that and offer the chance to register while car charges was added in a collapsible overlay.

How the Registration screens looked BEFORE I joined the company

Designing the registration flow was primarily an exercise in UX form optimisation. Currently it was presented as a single form, with multiple fields. This was problematic for various reasons, from friction through cognitive overload - hardly encouraging users to register - to issues with highlighting errors. Research revealed some of the data requested wasn't essential, particularly at this early stage.

Selected screens from the NEW Registration experience flow

Utilising the 'one thing per page' approach, after several conversations with the technical team, we distilled the necessary fields down to a minimum, and improved the UIs.

Having registered, I introduced a light-onboarding screen, to welcome the user, and offer a few touch-points to access key areas of the app, or to continue and navigate and discover the app themselves.

Finally, the log-in flow was updated, in consistent brand style and structure, again with flow improvements, specifically reducing clicks in the authentication process.

Flows were prototyped and tested internally, with updates made accordingly, and designs handed off to the development team.

Utilising the 'one thing per page' approach, after several conversations with the technical team, we distilled the necessary fields down to a minimum, and improved the UIs.

Finally, the log-in flow was updated, in consistent brand style and structure, again with flow improvements, specifically reducing clicks in the authentication process.

Flows were prototyped and tested internally, with updates made accordingly, and designs handed off to the development team.

Utilising the 'one thing per page' approach, after several conversations with the technical team, we distilled the necessary fields down to a minimum, and improved the UIs.

Finally, the log-in flow was updated, in consistent brand style and structure, again with flow improvements, specifically reducing clicks in the authentication process.

Flows were prototyped and tested internally, with updates made accordingly, and designs handed off to the development team.