Achieving Design Coherence

This presentation showcases how I am working to create design coherence across multiple, previously silo-ed platforms as Art Director over the last two years for the Wells Fargo digital sales experience.

I continue to combined my focus areas expertise in experience direction, art direction, strategy, and management and work with designers, developers, product management, brand specialist, and corporate executives to unify the design for the customer facing experience.

Due to confidentiality, the most sketches in this document represent high-level visuals of the designs currently in development.

Overview

As recently as 2016 the digital customer experience suffered from disjointed design systems and dated interaction. Over the last two I have focused my efforts on unifying the Brand expression and bridging the gaps of the customer flow. This includes:

Intricately crafting digital brand foundation guidance
Creating new, top to bottom, scalable design systems across multiple platforms
Continuously partnering with our Customer Insights (usability), Technology, Product Management, and Executive Leadership teams for critical support.

Homepage Overview (shop)

One of my main projects of 2017 was redesigning the wellsfargo.com homepage. As art director and project lead, I solved for immediate customer needs, strategic business goals, and a visual design that strongly positioned the Brand as an industry leader and supportive partner. Tasks and outcomes included:

Competitive analysis and deep insights to customer behavior on existing page
Extensive testing program including a benchmarking study with four distinct design directions, approximately 1,800 participants, and consisted of a series of questions, A/B selections and a visual heat map with verbatim feedback
New design produced an increased marketing engagement by 153% and improved page load time by 12%

Focus areas

Experience Direction: performance solutions, extensive user research and testing, personalization plan
Art Direction: multiple design iterations and refinement, brand and marketing integration, image and color strategy
Strategy: creation of customer and business goals, feedback and planning workshop, marketing considerations, socialization
Management: project lead planning, team resourcing

Overview

With the redesign of the homepage, the continuing evolution of the Service experience, and the upcoming platform redesigns for Buying and Fulfillment, it became increasingly necessary to create overarching guidance for foundational digital brand expressions. This initiative overlapped with the Buy Transformation work (covered on the next page). My efforts included (but were not limited to):

Identifying the required global elements, optional elements, UX colors and patterns
Actively applying and testing guidance to live designs, and feeding new design work back to be included in requirements
Reviewed and provided feedback for refinements and considerations

Buying Experience Overview (Buy)

Focusing on applications for all of WF digital products, this is transforming the entire customer flow by simplifying the experience dramatically, serving as a leading example of new digital brand direction, and implementing features making it much easier for customers to apply for products. Tasks included:

Three day “protothon” with partners from diverse disciplines to examine the existing experience and identify actionable concepts that could result in positive transformation for the user and the business
Comprehensive look at design, interaction and content of 17 product applications with customer and business goals in mind, taking into account other projects usability testing, customer feedback, accessibility and technical constraints
Full accessibility usability on new form design and interaction requiring close partnership with development

Key Tasks

Experience Direction: created application best practices, extensive customer testing plan, new feature implementation
Art Direction: established color strategy with limited color palette, applied brand fonts, created new form interaction
and design
Strategy: building and maintaining new design system for scalable use
Management: connection points for multiple projects to use new system, established and supported design SME

Fulfillment Overview (fulfill)

The Fulfillment space serves as a critical bridge between customers acquiring products and WF servicing those products. It allows for essential communication and guidance on digitally reviewing, uploading and signing material. Tasks included:

Conducted a “design shootout” with lead visual designers to kick-start design explorations
Overall modernization including design alignment, increased scan-ability, voice and tone update, personalized updates and guidance, task focused design with progress indicators
Solutions for task model needs of understanding where customers are in the process, know what’s next, completing required tasks, and finding helpful information and communication

Focus areas

Experience Direction: task model alignment, required tasks services, dynamic dashboard, extensive usability plan
Art Direction: interpret Digital Brand Foundation guidance, leverage shared libraries from Buy experience, transitional design into Service experience
Strategy: Building and maintaining new design system for scalable use
Management: Connection points for multiple projects to use this design, established and supported design SME

Onboarding Experience Overview (Onboard)

An often overlooked space within the customer journey is the point of onboarding where essential package communication, account creation, and activation (among other tasks) occurs. Our recent project kickoff has initiated strategic planning, leadership sponsorship, and in depth experience research. Our goals include executing against three work streams:

Identify and solve for near term common flows
Conceptualize long term vision work for future banking experience
Continued ideation, prototyping, validating and road mapping for project integration

Before and After