Shell
EV Network Planning Platform
I arrived at Shell joining the E-mobility/ChargeWorks team. Working fully remote, I was allocated to Project Sibyl, tasked with redesigning an existing EV network planning platform.
CLIENT
ROLE
Product Designer
Responsibilities
#UX/UI Design #Data Visualization #Wireframing #Prototyping #Workshops #Stakeholder management #Project management
Powering the Future of E-Mobility
Shell is a global leader in the energy sector, known for its extensive operations in oil, gas, and renewables. With a commitment to sustainable energy solutions, Shell is expanding its footprint in the electric vehicle (EV) market, focusing on innovative projects to drive the future of e-mobility.
Teaming Up for Innovation
Upon joining Shell, I was introduced to a brilliant team and assigned to the Sibyl project, an EV network planning tool and I started collaborating with the user researcher and the service designer. I studied the current platform to identify areas for improvement and in parallel I delved into the existing Concept Book documentation, produced during the Discovery Phase so I could gain a deep understanding of our audience. This foundation work allowed me to start thinking on how to translate research material into the first web app concept.
CONCEPT WORK
Structuring the Sibyl Platform & Waves of Approval
I created various high-level wireframe iterations for some of the key screens based on briefing requirements to define the app's structure and navigation patterns. This iterative approach and its output was documented in the Discovery Phase Concept Book material, presented right after to the broader team and senior stakeholders, setting the stage for the project's next phases. The initial work on the project was well-received, with the quality and structure of the work impressing the team and stakeholders. This positive feedback gained the project significant attention and momentum within the company.
“I’ve been keeping a senior stakeholder on Sibyl updated, but today for the first time he has seen the concepts from the Discovery phase. He was completely blown away and loved every aspect of it and he is certain this will make waves across Shell and set a new standard, KUDOS for all the amazing team work. He also invited the team to join one of the upcoming sessions/webcasts to talk about the Sibyl product revamp exercise that was just completed and was met with rave reviews by the business! He added saying that It shows the value of customer back thinking in real action as well as proposals that can transform truly existing products and UX at Shell.”
- Tom G. - Design Lead
MVP Scope Definition
Once the team got the green light, we worked with development and data teams to define the project scope. Due to the scale, we adopted an MVP strategy, prioritizing core features for a phased rollout that eased users into the new platform without dropping the old one entirely.
In an online workshop with stakeholders and the user researcher, we aligned on feasible goals, prioritizing features by user impact, business value, and effort. I then partnered with the Senior Data Analyst/PM to break the MVP into three phases—1 and 2 for essentials, 3 for nice-to-haves.
For project management, I worked closely with the Data Analyst to turn high-level feature descriptions into detailed user stories and acceptance criteria in JIRA, managing both design and development tasks.
Navigating the Experience
After the MVP scope was defined, I began developing the core journeys and user flows for each feature in greater detail. I evolved the previously presented wireframes into a high-fidelity UI using the Design System components that Shell already had in place. Shell’s designers who worked on the Experience Design team were consistently expanding the Design System in Figma, continually adding new libraries and resources. This was a significant advantage, streamlining my workflow and accelerating the output of my work.
Shell flows
Modular Components
Combining Design System elements, I created modular components that suited the new Sibyl platform, enhancing its capabilities and further expanding the library.
Special recognition awarded
Following the project's success up to that point, I was commended and awarded the “Super Star Designer of the Quarter” to the broader audience, highlighting the exceptional work done thus far.
“Philipe has been an integral part of the CW Design Team and the success of Sibyl 2.0 Discovery - Philipe has shown professionalism, dedication and perseverance through all projects, but specifically the EVPS/Volt/OneFPS project.”
Development Kick-off
After designing core features and their journeys, we kicked off development. I worked closely with developers to ensure quality and fidelity during the implementation.
USABILITY TESTING
In the video below, you’ll see a walkthrough of the Sibyl MVP app, showcasing its core functionalities and user experience design. Each feature was validated through usability testing, guiding decisions on prioritization and MVP phasing. This video captures the product in action, demonstrating how research, design, and data came together in a real-world tool.
After completing the MVP 1 scope, we were ready to test it with our users. Given the tight deadlines, I couldn't afford to pause the design work, so I collaborated with the user researcher who laid the groundwork for Sibyl to assist with our first usability testing and start gathering feedback. I helped define what we should test and the usability testing KPIs and metrics, enabling the user researcher to evaluate the features with our audience.
Testing Results
The testing output was a comprehensive document highlighting all findings, what worked, what didn't, and areas for improvement. The primary focus was on the app's core structure and navigation patterns. The initial results were exceptional with an average success score of 90%~ as users found the new platform significantly better and easier to use, requiring only minor changes. This positive feedback confirmed I was on the right track, allowing me to shift focus to individual features and begin planning for MVP2 and MVP3 milestones.
Product Launch
As we approached the MVP conclusion, our goal was to launch the new platform for a select group of key users. At this stage, we were implementing front/backend data analytics to assess platform usage. This combination of usage data and qualitative analysis from testing sessions provided a solid foundation for understanding user behaviour in detail.
I was responsible for creating the product launch strategy, aiming to maximize user engagement and establish direct communication with users to address their concerns quickly. This was crucial, as the old platform lacked this level of user interaction, and there were high expectations for the new platform's support processes.
