--- title: "prudential - Derek Arrington" language: "en-US" canonical_url: "https://jnytjp2rc55aygc.onstatic.studio/project/prudential" source_url: "https://jnytjp2rc55aygc.onstatic.studio/project/prudential/" content_type: "text/markdown" --- # prudential senior design director [the playbook design system //](#playbook) [tools & calculators //](#tools) [retirement app //](#retirement) ### the playbook / design system The very first thing we did as a team was to sit down and build our very own design system and this was when design system were new and shiny. #### my role I was the director, working side-by-side with our lead engineer, overseeing all aspects of the creation and implementation of The Playbook. ![playbook-homepage](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/playbook-homepage.png) ![playbook-design-system-page](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/playbook-design-system-page.png) ![playbook-branding-guidelines](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/playbook-branding-guidelines.png) ![playbook-web-guidelines](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/playbook-web-guidelines.png) ![Pru Playbook Colors White Background](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/Pru-Playbook-Colors-White-Background.png) ![Pru Cmponent Documentation](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/Pru-Cmponent-Documentation.jpg) ![Pru Area Chart](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/Pru-Area-Chart.svg) ![Pru Bubble Chart](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2025/01/Pru-Bubble-Chart.svg) ### starting from scratch #### vision Back then, our vision was to create one of the best enterprise design systems ever. #### goals As the newly created internal design team set out to bring experiential design unity to Prudential's five primary business units, the first step in our endeavor was to create a single design system. Keep in mind, design systems were a brand new thing at this time. Our high-level goals were to: - Provide Prudential customers a 360° view of their financial lives - Create hyper-personalized experiences for customers and provide an SSO service  - Educate customers and clients on financial wellness and the tools and services offered by Prudential - Provide new marketing and revenue opportunities for each of the business units ### challenges #### the wild, wild west The greatest challenge we encountered was the simple fact that no one really knew what they were doing. So many now established and accepted rules had yet to be established and accepted. Another biggie was that almost no one outside the realm of ux/ui design knew what we were talking about. Us talking to stakeholders just sounded like Charlie Brown's teacher to most folks. #### approach & process #### figure it out along the way We really did just wing it. We all went out and got certified for Google design sprints. We just workshopped a lot and figured out agile as we went along. #### results #### we did it The Good: we developed and delivered a really great design system. The Bad: It was frustrating. It was chaotic. We were all over the place. It was still a lot of fun. ### b2c tools & calculators With five business units all discovering they had an internal design and dev team at their disposal, we had no shortage of ideas and requests for b2c products. The most notable and impactful being the unified global dashboard. #### team lead / design lead / senior designer You name it, I did it.  ### lots of products #### visions While each tool or calculator had it's own set of goals, it was important the design gorup leads all maintained a single, overarching vision for these products writ large. This vision evolved naturally but, at it's core, was to provide thoughtful, impactful, and meaningful products to Prudential's customers and clients. Enabling them to make the most of their life's financial journey. #### goals As mentioned above, each product had it's own goals but, below are a few applicable all products: - Provide Prudential customers a 360° of their financial lives - Facilitate personalized experiences - Educate customers and clients - Provide marketing and revenue opportunities ![dashboard desktop mockup](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2024/09/dashboard-desktop-mockup.png) ![dashboard xsmall 3up mockup](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2024/09/dashboard-xsmall-3up-mockup.png) ![retirement tool xsmall mockup](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2024/09/retirement-tool-xsmall-mockup-1.png) ![debt tool landing page mockup](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2024/09/debt-tool-landing-page-mockup-2.png) ![debt tool results mockup](https://jnytjp2rc55aygc.onstatic.studio/wp-content/uploads/2024/09/debt-tool-results-mockup-1.png) ### challenges #### lots of challenges Every single one of these projects presented nearly the same set of challenges and headaches. While they could be, and often were, fun and quick, there was always disagreement on a-to-b flows, styling, iconography, and, most commonly, the want for shiny, interactive "bells and whistles". All this was fine and dandy except we designers were really trying to get the whole design system thing implemented and evangelized. #### approach & process #### varied / many / myriad All of these projects followed the same process. It was pretty straightforward after a while. We basically had a templated system. Assemble the team. Have a kickoff. Workshop, test, repeat. Design, test, repeat. Launch the MVP and move on to the next. #### results #### lots of wins The Good: We launched a lot. We did a lot. Most importantly, we learned a lot and were able to work through, refine, and fine-tune our design process and methods. The Bad: We missed the mark sometimes. We fell short of our goals sometimes. But, we still learned how to do and be better next time. ### retirement app The retirement business unit heads came to us one day and said they wanted to build Prudential's first ever native iOS and Android app and we said, Okay." And, that's just what we did. #### my role I lead the small, inexperienced, yet ambitious team. If you are reading this, it is because your browser does not support the HTML5 video element. ### for the first time #### vision To deliver a simple, yet useful retirement mobile app allowing customers to make quick and common changes or updates to their retirement accounts on the go. #### goals Nothing really groundbreaking about the app's purpose, itself. The goals were in the vision. ### challenges #### uncharted territory Simply put, it was the first time for nearly everyone involved. A lot of time was spent figuring out what and how to do everything on the fly. To make things more difficult, we didn't have any skilled native app engineers on the team. This forced us to make several sacrifices as to what features and functionality made it into the mvp. #### approach & process #### fake it till ya make it We just busted our butts to launch the app. The task was straightforward. Take the top functionalities from the retirement section of the global dashboard and stick them in the app. #### results #### we did it again The Good: We launched both versions of the app on time. Which was a miracle considering we were given only six months, start to finish. The Bad: Due to that six-month timeline, we were forced to leave a lot of desired functionality out. To be perfectly honest, I wasn't happy. I feel like we should have and could have just slapped a container around the global dashboard and launched a faux app instead. [orion //](https://jnytjp2rc55aygc.onstatic.studio/project/orion) [mckinsey //](https://jnytjp2rc55aygc.onstatic.studio/project/mckinsey) [prudential //](https://jnytjp2rc55aygc.onstatic.studio/project/prudential) [older work //](https://jnytjp2rc55aygc.onstatic.studio/project/older-work) [personal projects //](https://jnytjp2rc55aygc.onstatic.studio/project/passion-projects) [free time fun stuff //](https://jnytjp2rc55aygc.onstatic.studio/project/free-time) [cv //](https://justbeahuman.com/resume) [email //](mailto:derek.arrington@justbeahuman.com) [linkedin //](https://www.linkedin.com/in/derek-arrington/) View 341