Elephant Insurance, 2019»2026
Customer Portal
My work iterating on the Elephant customer portal to overhaul the UX and information architecture.
The First Iteration
I completed the first version of Elephant's customer service portal in 2019. It was the first project I led at Elephant and, working closely with marketing, I designed and iterated on an interactive prototype in Adobe XD to be shared with stakeholders. Once we had some good feedback from the mocks, I worked alongside a full-stack developer who helped a ton with API integration and the business logic while I focused on the interactive UI elements and front-end component architecture.
New design for a new era
Over the last few years, I've worked with marketing to expand the UX process and branding guidelines — basing many of the new brand elements on my work on the Quote journey and the first portal iteration. With the new brand guidelines fleshed out, I started redesigning in Figma.
I kept the "quick actions" from my original design, but included all four categories to mimic the new navigation. I also included icons for easier differentiation and a more friendly intro message for the quick actions.
Below the quick actions, the new "At-a-glance" section gives the user a quick overview of their policy.
Mobile App Dashboard
In the most recent update to portal, I added Capacitor.js to our Angular application to keep the customer portal logic centralized instead of maintaining the functionality in two places: the React Native mobile app and the angular web app. I started this update by going through the old app and finding the native features we'd added that were missing from the Angular application (e.g., Biometric Login and Offline Data). I worked with two other developers who handled the backend integrations with the new mobile app functionality.
I was solely responsible for the UI: UX design, navigation structure, interaction animations, and implementing the styling with Modular CSS/Sass. This project has been my baby and I'm so excited to see it in the wild.
Login page
On larger screens, I added a simple two-column layout to allow the mobile app banner to take more prominence without hindering user interaction.
On mobile, I've streamlined the page to allow for easy access to the most important information, allowing for quick biometric login and access to insurance ID Cards.
Contribution
I have been the main contributor to this project since conception — iterated upon and updated from Angular 7 to Angular 19, and now also a Capacitor project. I'm extremely proud of what I've been able to create.