Prudential

Prudential

Prudential

Prudential

Prudential

Current //
Design Director //
Strategy //

Current //
Design Director //
Strategy //

Current //
Design Director //
Strategy //

The Playbook

Guidelines and Best Practices for Print, Digital and Web

The Playbook

Guidelines and Best Practices for Print, Digital and Web

The Playbook

Guidelines and Best Practices for Print, Digital and Web

The Playbook

Guidelines and Best Practices for Print, Digital and Web

The Playbook

Guidelines and Best Practices for Print, Digital and Web

Let’s look at it as city-planning. From the ground up. The playbook is the foundation from which all things are built. An ever-evolving document that aims to bring brand consistency and solidarity among the company’s five primary bu’s; retirement, annuities, individual life insurance, mutual funds and group insurance 

Prior to inception and implementation, the bu’s operated in silos and lacked uniformity across more than 50,000 individual pages and their respective digital marketing materials. Kind of like having all different road signage and different colors for traffic lights. So, the sole focus of the playbook was to bring consistency to the user experience and visual harmony across all experiences. 

With the atomic design system at it’s core, the teams worked with IBM to construct a fully customized CMS. The grand goal was to create a fully modular system with great flexibility, yet simple enough for anyone to construct pages within the ecosystem. From basic HTML elements to proprietary smart components architected on a customized bootstrap framework and working up to a fully templated system, the need for visual unification was more important than ever. Thus began the task of consolidating the myriad identities of the bu’s and strategizing how to get them all to play nicely together. 

From the brand voice to typography, photography, illustration and iconography and an allied color palette, the playbook became the municipal charter. The end result… a wholly consistent visual experience that continues to evolve daily.

Let’s look at it as city-planning. From the ground up. The playbook is the foundation from which all things are built. An ever-evolving document that aims to bring brand consistency and solidarity among the company’s five primary bu’s; retirement, annuities, individual life insurance, mutual funds and group insurance 

Prior to inception and implementation, the bu’s operated in silos and lacked uniformity across more than 50,000 individual pages and their respective digital marketing materials. Kind of like having all different road signage and different colors for traffic lights. So, the sole focus of the playbook was to bring consistency to the user experience and visual harmony across all experiences. 

With the atomic design system at it’s core, the teams worked with IBM to construct a fully customized CMS. The grand goal was to create a fully modular system with great flexibility, yet simple enough for anyone to construct pages within the ecosystem. From basic HTML elements to proprietary smart components architected on a customized bootstrap framework and working up to a fully templated system, the need for visual unification was more important than ever. Thus began the task of consolidating the myriad identities of the bu’s and strategizing how to get them all to play nicely together. 

From the brand voice to typography, photography, illustration and iconography and an allied color palette, the playbook became the municipal charter. The end result… a wholly consistent visual experience that continues to evolve daily.

Let’s look at it as city-planning. From the ground up. The playbook is the foundation from which all things are built. An ever-evolving document that aims to bring brand consistency and solidarity among the company’s five primary bu’s; retirement, annuities, individual life insurance, mutual funds and group insurance 

Prior to inception and implementation, the bu’s operated in silos and lacked uniformity across more than 50,000 individual pages and their respective digital marketing materials. Kind of like having all different road signage and different colors for traffic lights. So, the sole focus of the playbook was to bring consistency to the user experience and visual harmony across all experiences. 

With the atomic design system at it’s core, the teams worked with IBM to construct a fully customized CMS. The grand goal was to create a fully modular system with great flexibility, yet simple enough for anyone to construct pages within the ecosystem. From basic HTML elements to proprietary smart components architected on a customized bootstrap framework and working up to a fully templated system, the need for visual unification was more important than ever. Thus began the task of consolidating the myriad identities of the bu’s and strategizing how to get them all to play nicely together. 

From the brand voice to typography, photography, illustration and iconography and an allied color palette, the playbook became the municipal charter. The end result… a wholly consistent visual experience that continues to evolve daily.

Let’s look at it as city-planning. From the ground up. The playbook is the foundation from which all things are built. An ever-evolving document that aims to bring brand consistency and solidarity among the company’s five primary bu’s; retirement, annuities, individual life insurance, mutual funds and group insurance 

Prior to inception and implementation, the bu’s operated in silos and lacked uniformity across more than 50,000 individual pages and their respective digital marketing materials. Kind of like having all different road signage and different colors for traffic lights. So, the sole focus of the playbook was to bring consistency to the user experience and visual harmony across all experiences. 

With the atomic design system at it’s core, the teams worked with IBM to construct a fully customized CMS. The grand goal was to create a fully modular system with great flexibility, yet simple enough for anyone to construct pages within the ecosystem. From basic HTML elements to proprietary smart components architected on a customized bootstrap framework and working up to a fully templated system, the need for visual unification was more important than ever. Thus began the task of consolidating the myriad identities of the bu’s and strategizing how to get them all to play nicely together. 

From the brand voice to typography, photography, illustration and iconography and an allied color palette, the playbook became the municipal charter. The end result… a wholly consistent visual experience that continues to evolve daily.

Let’s look at it as city-planning. From the ground up. The playbook is the foundation from which all things are built. An ever-evolving document that aims to bring brand consistency and solidarity among the company’s five primary bu’s; retirement, annuities, individual life insurance, mutual funds and group insurance 

Prior to inception and implementation, the bu’s operated in silos and lacked uniformity across more than 50,000 individual pages and their respective digital marketing materials. Kind of like having all different road signage and different colors for traffic lights. So, the sole focus of the playbook was to bring consistency to the user experience and visual harmony across all experiences. 

With the atomic design system at it’s core, the teams worked with IBM to construct a fully customized CMS. The grand goal was to create a fully modular system with great flexibility, yet simple enough for anyone to construct pages within the ecosystem. From basic HTML elements to proprietary smart components architected on a customized bootstrap framework and working up to a fully templated system, the need for visual unification was more important than ever. Thus began the task of consolidating the myriad identities of the bu’s and strategizing how to get them all to play nicely together. 

From the brand voice to typography, photography, illustration and iconography and an allied color palette, the playbook became the municipal charter. The end result… a wholly consistent visual experience that continues to evolve daily.

playbook-two-up

Unauthenticated

Open to the Public

Unauthenticated

Open to the Public

Unauthenticated

Open to the Public

Unauthenticated

Open to the Public

Unauthenticated

Open to the Public

With standards in place, it was time to construct a whole new experience for the public. The ask from Senior Leadership was simple in principle, yet grand in scale. I like to think of it as parks and rec.

You have the basics to cover; some lawns, lakes, foliage, ballfields, playgrounds, fountains, benches and so on. All the general stuff parks need. But... The challenge is making it all appeal to, and work for everyone. All while ensuring progress and upkeep aren’t a pain in the ass.

Employing the playbook, of course, we set out to establish what page templates were applied when and where. But of course, you soon discover you haven’t thought of everything and have to do construction and fill in some potholes in the middle of the night. The greatest challenge was (and still is) surveying the thousands of live pages and combining, marrying and often deleting. Making sure there aren’t any dead ends and that users can get where they need to be as efficiently as possible.

With standards in place, it was time to construct a whole new experience for the public. The ask from Senior Leadership was simple in principle, yet grand in scale. I like to think of it as parks and rec.

You have the basics to cover; some lawns, lakes, foliage, ballfields, playgrounds, fountains, benches and so on. All the general stuff parks need. But... The challenge is making it all appeal to, and work for everyone. All while ensuring progress and upkeep aren’t a pain in the ass.

Employing the playbook, of course, we set out to establish what page templates were applied when and where. But of course, you soon discover you haven’t thought of everything and have to do construction and fill in some potholes in the middle of the night. The greatest challenge was (and still is) surveying the thousands of live pages and combining, marrying and often deleting. Making sure there aren’t any dead ends and that users can get where they need to be as efficiently as possible.

With standards in place, it was time to construct a whole new experience for the public. The ask from Senior Leadership was simple in principle, yet grand in scale. I like to think of it as parks and rec.

You have the basics to cover; some lawns, lakes, foliage, ballfields, playgrounds, fountains, benches and so on. All the general stuff parks need. But... The challenge is making it all appeal to, and work for everyone. All while ensuring progress and upkeep aren’t a pain in the ass.

Employing the playbook, of course, we set out to establish what page templates were applied when and where. But of course, you soon discover you haven’t thought of everything and have to do construction and fill in some potholes in the middle of the night. The greatest challenge was (and still is) surveying the thousands of live pages and combining, marrying and often deleting. Making sure there aren’t any dead ends and that users can get where they need to be as efficiently as possible.

With standards in place, it was time to construct a whole new experience for the public. The ask from Senior Leadership was simple in principle, yet grand in scale. I like to think of it as parks and rec.

You have the basics to cover; some lawns, lakes, foliage, ballfields, playgrounds, fountains, benches and so on. All the general stuff parks need. But... The challenge is making it all appeal to, and work for everyone. All while ensuring progress and upkeep aren’t a pain in the ass.

Employing the playbook, of course, we set out to establish what page templates were applied when and where. But of course, you soon discover you haven’t thought of everything and have to do construction and fill in some potholes in the middle of the night. The greatest challenge was (and still is) surveying the thousands of live pages and combining, marrying and often deleting. Making sure there aren’t any dead ends and that users can get where they need to be as efficiently as possible.

With standards in place, it was time to construct a whole new experience for the public. The ask from Senior Leadership was simple in principle, yet grand in scale. I like to think of it as parks and rec.

You have the basics to cover; some lawns, lakes, foliage, ballfields, playgrounds, fountains, benches and so on. All the general stuff parks need. But... The challenge is making it all appeal to, and work for everyone. All while ensuring progress and upkeep aren’t a pain in the ass.

Employing the playbook, of course, we set out to establish what page templates were applied when and where. But of course, you soon discover you haven’t thought of everything and have to do construction and fill in some potholes in the middle of the night. The greatest challenge was (and still is) surveying the thousands of live pages and combining, marrying and often deleting. Making sure there aren’t any dead ends and that users can get where they need to be as efficiently as possible.

unauthenticated-two-up

Global Dashboard

Town Hall

Global Dashboard

Town Hall

Global Dashboard

Town Hall

Global Dashboard

Town Hall

Global Dashboard

Town Hall

The dashboard is centralized management. Where customers access all their products under one roof, a single-sign-in, authenticated experience. Prior to the dashboard, if a customer owned multiple products across businesses, they’d have to visit each one, login, check everything, logout and repeat.

Those days are no more. All products, notices and pertinent information can be accessed on a single page. A comprehensive message center keeps customers up to date with changes, updates, improvements, legal matters or any other material of impact. But it wasn’t all that easy. With the bu’s joining at different times, and moreover, adding products at different intervals, the greatest challenge was to plan months in advance for what might come along. We established a core card structure opting for space and breathability and simple typography over a lot of bells and whistles seen in most financial dashboards. All the while anticipating extreme use-cases yet, baking in enough flexibility to accommodate the unforeseen.

On the backend, The sharing of data across bu’s allows for more relevant educational and engagement materials to be displayed. Encouraging the user to explore more of Prudential’s financial wellness services, like the many new tools and calculators currently in production.

The dashboard is centralized management. Where customers access all their products under one roof, a single-sign-in, authenticated experience. Prior to the dashboard, if a customer owned multiple products across businesses, they’d have to visit each one, login, check everything, logout and repeat.

Those days are no more. All products, notices and pertinent information can be accessed on a single page. A comprehensive message center keeps customers up to date with changes, updates, improvements, legal matters or any other material of impact. But it wasn’t all that easy. With the bu’s joining at different times, and moreover, adding products at different intervals, the greatest challenge was to plan months in advance for what might come along. We established a core card structure opting for space and breathability and simple typography over a lot of bells and whistles seen in most financial dashboards. All the while anticipating extreme use-cases yet, baking in enough flexibility to accommodate the unforeseen.

On the backend, The sharing of data across bu’s allows for more relevant educational and engagement materials to be displayed. Encouraging the user to explore more of Prudential’s financial wellness services, like the many new tools and calculators currently in production.

The dashboard is centralized management. Where customers access all their products under one roof, a single-sign-in, authenticated experience. Prior to the dashboard, if a customer owned multiple products across businesses, they’d have to visit each one, login, check everything, logout and repeat.

Those days are no more. All products, notices and pertinent information can be accessed on a single page. A comprehensive message center keeps customers up to date with changes, updates, improvements, legal matters or any other material of impact. But it wasn’t all that easy. With the bu’s joining at different times, and moreover, adding products at different intervals, the greatest challenge was to plan months in advance for what might come along. We established a core card structure opting for space and breathability and simple typography over a lot of bells and whistles seen in most financial dashboards. All the while anticipating extreme use-cases yet, baking in enough flexibility to accommodate the unforeseen.

On the backend, The sharing of data across bu’s allows for more relevant educational and engagement materials to be displayed. Encouraging the user to explore more of Prudential’s financial wellness services, like the many new tools and calculators currently in production.

The dashboard is centralized management. Where customers access all their products under one roof, a single-sign-in, authenticated experience. Prior to the dashboard, if a customer owned multiple products across businesses, they’d have to visit each one, login, check everything, logout and repeat.

Those days are no more. All products, notices and pertinent information can be accessed on a single page. A comprehensive message center keeps customers up to date with changes, updates, improvements, legal matters or any other material of impact. But it wasn’t all that easy. With the bu’s joining at different times, and moreover, adding products at different intervals, the greatest challenge was to plan months in advance for what might come along. We established a core card structure opting for space and breathability and simple typography over a lot of bells and whistles seen in most financial dashboards. All the while anticipating extreme use-cases yet, baking in enough flexibility to accommodate the unforeseen.

On the backend, The sharing of data across bu’s allows for more relevant educational and engagement materials to be displayed. Encouraging the user to explore more of Prudential’s financial wellness services, like the many new tools and calculators currently in production.

The dashboard is centralized management. Where customers access all their products under one roof, a single-sign-in, authenticated experience. Prior to the dashboard, if a customer owned multiple products across businesses, they’d have to visit each one, login, check everything, logout and repeat.

Those days are no more. All products, notices and pertinent information can be accessed on a single page. A comprehensive message center keeps customers up to date with changes, updates, improvements, legal matters or any other material of impact. But it wasn’t all that easy. With the bu’s joining at different times, and moreover, adding products at different intervals, the greatest challenge was to plan months in advance for what might come along. We established a core card structure opting for space and breathability and simple typography over a lot of bells and whistles seen in most financial dashboards. All the while anticipating extreme use-cases yet, baking in enough flexibility to accommodate the unforeseen.

On the backend, The sharing of data across bu’s allows for more relevant educational and engagement materials to be displayed. Encouraging the user to explore more of Prudential’s financial wellness services, like the many new tools and calculators currently in production.

dashboard-two-up

Some Tools

Municiple Works

Some Tools

Municiple Works

Some Tools

Municiple Works

Some Tools

Municiple Works

Some Tools

Municiple Works

Spanning multiple bu’s, the need to ideate, design and develop new tools to help customers learn about and manage their current and future financial lives was the next level of engagement with the goal of maintaining user-retention and promoting return visits.

Like infrastructure: water works, electrical grids, fire and safety. Systems in place helping people day in, day out, providing essential resources to aid them in bettering their financial lives. The new system of tools and calculators aims to aid consumers in developing a roadmap to financial wellness.

Whether its general fiscal assessment, managing debt, planning for retirement, finding life insurance or finding a financial professional to handle it all for you. We’re designing a highly iterative toolbox to help consumers navigate their financial lives. Currently in production are five new tools that advise customers and provide a level of self-management, enabling them to become more financially aware and self-sufficient.

After analytics of previously employed campaigns discovered a high rate of abandonment by users due, largely in part to visual incongruity, the decision was made to maintain a singular and cohesive style to all the tools. Tying the toolset together is playful and consistent illustration and iconography paired with useful, yet pleasant animation and micro-interaction patterns. Moving users through flows with ease and minimal distraction.

Spanning multiple bu’s, the need to ideate, design and develop new tools to help customers learn about and manage their current and future financial lives was the next level of engagement with the goal of maintaining user-retention and promoting return visits.

Like infrastructure: water works, electrical grids, fire and safety. Systems in place helping people day in, day out, providing essential resources to aid them in bettering their financial lives. The new system of tools and calculators aims to aid consumers in developing a roadmap to financial wellness.

Whether its general fiscal assessment, managing debt, planning for retirement, finding life insurance or finding a financial professional to handle it all for you. We’re designing a highly iterative toolbox to help consumers navigate their financial lives. Currently in production are five new tools that advise customers and provide a level of self-management, enabling them to become more financially aware and self-sufficient.

After analytics of previously employed campaigns discovered a high rate of abandonment by users due, largely in part to visual incongruity, the decision was made to maintain a singular and cohesive style to all the tools. Tying the toolset together is playful and consistent illustration and iconography paired with useful, yet pleasant animation and micro-interaction patterns. Moving users through flows with ease and minimal distraction.

Spanning multiple bu’s, the need to ideate, design and develop new tools to help customers learn about and manage their current and future financial lives was the next level of engagement with the goal of maintaining user-retention and promoting return visits.

Like infrastructure: water works, electrical grids, fire and safety. Systems in place helping people day in, day out, providing essential resources to aid them in bettering their financial lives. The new system of tools and calculators aims to aid consumers in developing a roadmap to financial wellness.

Whether its general fiscal assessment, managing debt, planning for retirement, finding life insurance or finding a financial professional to handle it all for you. We’re designing a highly iterative toolbox to help consumers navigate their financial lives. Currently in production are five new tools that advise customers and provide a level of self-management, enabling them to become more financially aware and self-sufficient.

After analytics of previously employed campaigns discovered a high rate of abandonment by users due, largely in part to visual incongruity, the decision was made to maintain a singular and cohesive style to all the tools. Tying the toolset together is playful and consistent illustration and iconography paired with useful, yet pleasant animation and micro-interaction patterns. Moving users through flows with ease and minimal distraction.

Spanning multiple bu’s, the need to ideate, design and develop new tools to help customers learn about and manage their current and future financial lives was the next level of engagement with the goal of maintaining user-retention and promoting return visits.

Like infrastructure: water works, electrical grids, fire and safety. Systems in place helping people day in, day out, providing essential resources to aid them in bettering their financial lives. The new system of tools and calculators aims to aid consumers in developing a roadmap to financial wellness.

Whether its general fiscal assessment, managing debt, planning for retirement, finding life insurance or finding a financial professional to handle it all for you. We’re designing a highly iterative toolbox to help consumers navigate their financial lives. Currently in production are five new tools that advise customers and provide a level of self-management, enabling them to become more financially aware and self-sufficient.

After analytics of previously employed campaigns discovered a high rate of abandonment by users due, largely in part to visual incongruity, the decision was made to maintain a singular and cohesive style to all the tools. Tying the toolset together is playful and consistent illustration and iconography paired with useful, yet pleasant animation and micro-interaction patterns. Moving users through flows with ease and minimal distraction.

Spanning multiple bu’s, the need to ideate, design and develop new tools to help customers learn about and manage their current and future financial lives was the next level of engagement with the goal of maintaining user-retention and promoting return visits.

Like infrastructure: water works, electrical grids, fire and safety. Systems in place helping people day in, day out, providing essential resources to aid them in bettering their financial lives. The new system of tools and calculators aims to aid consumers in developing a roadmap to financial wellness.

Whether its general fiscal assessment, managing debt, planning for retirement, finding life insurance or finding a financial professional to handle it all for you. We’re designing a highly iterative toolbox to help consumers navigate their financial lives. Currently in production are five new tools that advise customers and provide a level of self-management, enabling them to become more financially aware and self-sufficient.

After analytics of previously employed campaigns discovered a high rate of abandonment by users due, largely in part to visual incongruity, the decision was made to maintain a singular and cohesive style to all the tools. Tying the toolset together is playful and consistent illustration and iconography paired with useful, yet pleasant animation and micro-interaction patterns. Moving users through flows with ease and minimal distraction.

retirement-tool-all
debt-tool-all copy
life-tool-all

Design Director & Strategist / Prudential //

Design Director & Strategist / Prudential //

Design Director & Strategist / Prudential //

Design Director & Strategist / Prudential //

Previous //

Design Director / Liberty Tax // Director of Digital / Equinox Fitness // 

Design Director / Liberty Tax // Director of Digital / Equinox Fitness // 

Design Director / Liberty Tax // Director of Digital / Equinox Fitness // 

Design Director / Liberty Tax // Director of Digital / Equinox Fitness // 

Honorable Mentions //

Art Director / Walton & Isaacson / Degree campaign // Digital Design Director / Macy's // Interactive Art Director / Lorelli & Associates //

Art Director / Walton & Isaacson / Degree campaign // Digital Design Director / Macy's // Interactive Art Director / Lorelli & Associates //

Art Director / Walton & Isaacson / Degree campaign // Digital Design Director / Macy's // Interactive Art Director / Lorelli & Associates //

Art Director / Walton & Isaacson / Degree campaign // Digital Design Director / Macy's // Interactive Art Director / Lorelli & Associates //

© Derek Arrington 2017

© Derek Arrington 2017

© Derek Arrington 2017

© Derek Arrington 2017

© Derek Arrington 2017