Interactive FAQ App [bp pulse]
Understanding the brief
bp pulse offers electric vehicle charging at thousands of points across the UK. Despite their high performance, a set of core misconceptions about the brand were being repeatedly voiced by consumers.
They required a native windows touchscreen app to tour across their events schedule.
They needed to bring users' attention to these questions and answers, combining text with various forms of interactive content to help break the negative views of the brand.
I was brought into the project to consult on the creative development, and lead on the UX & UI design.
Carrying out the research
I interviewed a set of employees at the creative agency and the final client. I analysed construction plans for the initial event program, and tested web pages on the screen size the app was intended for.
It became clear that users would not be arriving at the event or installation space with the intention of using the app, so the design would need to spark interest in pedestrian traffic and draw them towards the screen.
Developing hypotheses
I decided to design the app with simplicity and eye-catching movement in mind. With a touchscreen format, you must seek the user's attention from afar and attract them towards the interaction point.
Once engaged the user must be able to get the information desired quickly, to avoid the all-too-easy abandonment of the application.
Initial sketching
Developing the prototype
I opted for large "card" style questions in a carousel format with a moving image background, keeping only 3 questions visible at any one time to avoid overloading pages with content or small text.
To further increase movement and avoid a static feel to the app, the cards were accompanied by custom designed PNG sequence animations.
With just one click, the answers were revealed in a large card with its core piece of content alongside it (animation, interactive map, video).
This sense of movement, larger text and animated iconography would greatly increase the probability of catching a user’s eye, encouraging them to engage with the content.
Question carousel template wireframe
Answer + video template wireframe
Applying the interface design
Fortunately the bp pulse brand colour palette was bright and vibrant, further allowing me to create something that would stand out in a room or event space.
The colour gradient was applied to the animated iconography, and I created the background animation from a still image that formed part of the wider brand asset kit.
The deep contrast between the moving blue and green background and the sharper white FAQ cards allowed the attention to be focussed on the questions, and thus boost user interest to reveal the answers.
Question carousel template UI design
Answer + video template UI design
Measuring the impact
In the first installation, the app saw 1,800 unique page impressions over 3 event days.
Due to the positive user response the app was rolled out across a series of office installations and event activations later in 2023.
Due to the continued success, the app was recently updated with new data at the end of 2023 in preparation for event installations in 2024.
The wide and consistent use of the app will play an important role in triggering a shift in customer preconceptions, subsequently boosting brand advocacy.