TD Bank

Getting on the same page

Often original business case goals at the executive level don’t have enough detail, or and too high level for the project team, as the many stakeholders have different points of view for what success looks like.

• On complex Digital Transformation projects, Senior Enterprise IT UX/UI experts incorporate a Service Design approach, which helps drill down and distill the key “aha” moments to get everyone “on the same page”, setting a strong foundation for alignment.
• While there are many Design Thinking tools, the following tools were instrumental to create a “bespoke” set of strategic guard rails to ensure the project’s success.
• The following tools were chosen and approved by the project sponsor, a combination of “Best in Class” from industry leaders such as IDEO, IBM, Neilsen Norman Group, Deloitte, PWC.

Align: Competitive analysis, "Art of the Possible"

Showing different competitors and best practices helps orient Agile Pod stakeholders who are not used to starting with a "blank page".

• Great Design Thinking facilitators are skilled at creating an atmosphere about sharing pros and cons, to help team members get into a shared Agile mindeset, and builds by having everyone get on the same page and share expertise in a collaborative and inclusive workspace.

• 
  Best practice screenshots of leading competitor's experiences to stimulate design and lateral thinking, to help visualize target state goals

Align: Persona/Profiles

Personas and profiles are drawn from real research data, to visualize the types of customers, their wants, desires and Pain Points.

• As these were the first real set created for the bank, this helped created trust with the project team, and helped understand the gaps as well as the value and need for Design Thinking.
• By having real artefacts and deliverables in workshops, the project team was able to get Enterprise legitimacy and visibility, with greater participation and more detailed information from cross-department stakeholders who found an intrinsic desire to share in the project successs, and remove future roadblocks.

• 
  Sample of one of three customer segments to focus feature prioritization and KPI business value targets

Align: What is the size of the "breadbox"

Many stakeholders have different perspectives on what the project is trying to achieve; to help align the Business Vision, key starting questions were sent out.

• The help this Digital Transformation, key questions were sent from the CIO's email to the major stakeholders, to not only give visibility, but help start the Change Management process from a common starting point.
• Once these questions were answered and approved, the “Key Starting Questions” helped guide the general direction of the UX work, as well as defining “where we don't want to go”.

• 
  Key questions sent to major stakeholders, with results tallied and summarized with sign-off for the Business Vision

Align: Other

Concept Prototype

UX Strategy Heuristics

Journey Mapping

Design: Wireframe Prototypes, UX/UI User Psychology and Interaction Rules

Wireframe prototypes integrate UX/UI user psychology and interaction rules to create intuitive and user-friendly designs that effectively cater to user expectations and behaviors, ultimately enhancing the overall user experience; while

• Enterprise users are different from marketing or social media posts, so they need to have their layout and information specifically catered to how users think and go through tasks, which are capture both visually as Annotated Wireframes and with Interaction Rules in tools like Confluence and Storybook.
• An understanding User Psychology such as Fitt's Law, Miller's Law, and Csíkszentmihályi Flow State, are essential for success to have the right level of cognitive load and information density, as different products and their features need to be organized in different ways, as different producst are thought about in different ways by customers.
• Rather than generic page layouts, wireframes are created to optimized

• 
  Sample Wireframe Prototypes, based on UX/UI User Psychology and Interaction Rules

Design: Sitemap, Screen Flows, Content Architecture for Enterprise Scaling

Especially in Enterprise systems, it's important to understand the complete picture; along with Wireframes, Sitemaps and Screen Flows need to be aligned with technical workflow constraints using Content Architecture mapping, to establish a strong and scalable structural foundation, ensuring logical navigation, coherent user journeys, and organized content presentation for an optimal user experience.

• To visualize and help understand how to build solutions, Sitemaps and optimized Screen Flows were created to cater to each unique customer needs through to a Call To Action (CTA), covering 10+ products and business units.
• Aligning with the scalable Design System, these were mapped with a Content Architecture for the new CMS Content Management System, to be able to gain scale benefits from Design Pattern reuse, and ease and quickness for future iterative updates.

• 
  
• 
  Screenflows

Design: Enterprise Design System

Enterprise design systems offer standardized design components, guidelines, and principles that promote consistency, efficiency, and scalability across products, streamlining development processes and enhancing brand coherence for a cohesive user experience.

• To be effective, it follows the micro to macro Atomic design principles, of (1) Element (2) Component (3) Module (4) Page/Screen
• The first Design System for Enterprise Architecture applications, it was scaled to be used by many departments such as Online Banking, Call Center, Credit Cards, Mortgages, Loans, more...
• As a measurable KPI benefit, the Design System was instrumental so Agile teams using the Dev Platform can design, build and deploy Enterprise Apps in 2 months vs. 9+ months.

• 
  Responsive Design System with Navs, Buttons, Text, Form Controls, Modules, and more (Sample is before Accessibility Testing)