Client-Centered Design and the TD Ameritrade Merger

SUMMARY

Datek pioneered asynchronous market data updates for day traders. After the Ameritrade acquisition, integrating day traders' needs with long-term investors posed a challenge. After much internal deliberation, I was part of a small team to pitch a new trading platform to leadership in Omaha.

The pitch focused on integrating realtime data, rapid trading, and long-term investment goals while targeting Active Traders. After receiving the green light, and meticulous planning, client-centered design research, and sophisticated engineering, we launched Apex. It earned stellar reviews, propelling Ameritrade from 13th to second place in the annual Barron’s Online Broker Review, just prior to the TD merger.

CONTEXT

Role: UX Design Manager

Team size: 14 (5 interaction designers, 2 interface designers, 2 writers, 1 information architect & 4 front-end engineers)

SECTIONS

1. Key Learnings

2. From a Merger to a Pitch

3. Scaling a Team, Building Trust & HCD

4. An Attention to Detail

5. Closing the Trading Loop

6. Delivering Impactful Results

Key Learnings

1. Market Timing is Crucial - The online brokerage space was filled with hard-charging competitors; investing in the Apex initiative to simplify the brand promise and release differentiating innovation proved to be the right move at the right time.

2. Identify Overlooked Market Segments - Catering to Active Traders led to a tailored solution that product marketing could sell with a simple story. A thorough understanding of diverse client needs drove our strategic discussions, which informed system design and the interaction model.

3. Collaboration Drives Innovation - Our team had a wide variety of expertise, which facilitated shared leanings and an innovative moxy as we that was infectious. Our specialized roles enhanced deep and wide collaboration with both peers and business stakeholders, challenging assumptions and iterating best of breed ideas.

4. Human-Centered Design Works - Pursuing human-centered design principles, including just enough user research to model personas and write context scenarios, directly impacted how we supported our clients and informed leadership.

5. Stakeholder Engagement is Key - Navigating Ameritrade’s organizational hierarchies was difficult—it spoke finance as its core language, and didn’t perceive design as a business function, as we were buried at the bottom of the Development organization. That didn’t stop me from driving the definition of the Apex product by building bridges between departments and showcasing the value of our client-centered approach.

From A MERGER TO A PITCH

In 2002, practically all web transactions of data between humans and systems relied on form submissions and page refreshes. Datek Online's Streamer app broke ground by providing asynchronous, real-time data to the public, which was previously exclusive to industry day traders.

I was hired as an interaction designer to work on Streamer Suite, and just as we were releasing my first app, Command Center—only months after I joined—Ameritrade merged with Datek.

The prospect of a merger raised concerns in day trading communities; Datek innovated value for clients while Ameritrade was, at best, conservative with their offerings.

After months of maintaining two brand platforms, myself, Dan Saffer, and Tom Alison, with the blessing of Larry Szczech, Datek's SVP Strategy, flew to Omaha, NE to pitch Ameritrade leadership the design of a new trading platform. More importantly, we put a name to an underserved segment found between the two existing investor archetypes: Active Traders.

While day traders brought in a large commission-per-client ratio, Larry and David Whitmore, Director of Strategy, hypothesized that the number of active traders—defined as a client who makes 10-20 trades per month—dwarfed day traders as a market segment.

Leadership agreed.

We needed a platform that catered to actives while supporting the context scenarios of both day traders and long-term investors—a novel platform experience, with improved trading features, revamped visual language, and a new interaction model.

A new brand.

Scaling A Team, Building Trust & HCD

Upon receiving the green light, I was promoted from my role as an interaction designer to Ameritrade's first UX Design Manager, with a charge to scale the team to cover Streamer, Amerivest, and the new ‘Unified’ platform, later branded as Apex.

Within six months, I had hired a team of 10 specialists—UI designers, interaction designers, information architects, writers—along with taking our superlative team of front-end engineers under my wings.

To get the larger XFT moving in the same direction and with our clients at the center of our efforts, I flew in David Fore, VP at Cooper Design, to run a Goal-Directed Design workshop for my team, business analysts, and our engineering partners. I invited stakeholders to sit in with us as well, as no one at Ameritrade had ever designed a platform experience to meet specific user needs.

David reflected on the initiative in a recommendation for me:

“I have met few people who can equal Sean’s craft, professionalism, and passion. The work he directed during my collaboration with him was as complex at a domain level as it was at an organizational level. It was impressive to watch him oversee a two-fold innovation program that included dozens of staff and executives: he orchestrated a workshopping process where participants learned human-centered innovation methods and he had the team apply this knowledge to the redesign and re-development of key parts of the company's flagship offering.”

Once our cross-functional team could speak the same language we were able to align on our client-centered approach to identify and model user requirements.

We ran an exhaustive summative usability study to understand the pain points of both client bases, along with qualitative interviews to surface aspirational data—both contributed to our modeling of client archetypes.

With BAs identifying business requirements—from needle moving metrics to in-the-weeds regulatory details about differentiating trading features—we took to writing context scenarios, grounding the future experience holistically within a design vision.

Essentially, the Unified site needed to include all the features both client cohorts relied upon, yet delivered within a much more usable experience. Now aligned on how we were going to work together, we began sketching the key paths involved.

AN Attention to Detail

To impact metrics such as time-to-task, which is massively important when buying/selling in a time sensitive, price fluctuating market, we leaned into the Cooper design principle do not allow errors if they can be prevented.

In both legacy platforms, such a core tenet was an afterthought, leaving clients caught in form submission error loops. In the rush to ship, such simple design solutions are often overlooked.

We invested in javascript checks across all form fields to ensure valid data entry as the user moved from one field to the next, providing assistive prompts along the way if the user lost focus. This simple detail, along with well crafted content design, made the experience less frustrating, and by only activating the submit button once the system was happy with the user’s attention to detail, we drastically cut down on error loops — whether the form was as innocuous as a support form or as important as a trade ticket.

Sections such as Deposits & Withdrawals were streamlined from multiple-page form submissions to single interfaces conditionally exposed next options. These conditional interfaces might be a baseline pattern in today’s form UIs, but back then such front-end focus didn’t exist in the financial industry, let alone the majority of the web.

Task completion % improved and client complaints lessened — we were proving the value of human-centered design.

Closing the Trading Loop

While active traders transferred money in and out of their account, they were primarily engaged with their positions — buying, selling, and altering positions while the transaction is still open.

Our research provided insights into how important it was for our clients to manage their positions (e.g. trade type, amount, bid/ask, etc.), so we focused our attention on the context surrounding the trade ticket.

To a person, we recognized that the holy grail of smartphones were still years away from becoming a viable platform AND research told us that traders needed as much flexibility as possible in the research › trade › confirmation process.

This spurred ideation into how we might ensure that traders would always be one click away from moving on a position. What we came up with was SnapTicket—a nifty little trade ticket with features that supported both primary and edge cases of our active trader clients:

• The ticket was persistent in the footer, making it available at all times

• The user could get live quotes in the header, or pull up their watchlist

• A conditional design was implemented to shift the fields depending on the type of trade chosen — market trades are without a price field; trailing stops have multiple price, closing inputs, etc.

• After submitting a trade, SnapTicket collapsed to expose only the header w/ streaming quotes, allowing more room to engage above the fold

• Most importantly: SnapTicket could *snap* off the browser window, and live separately as a compact browser window in the user's display. This empowered users to research online wherever they chose while having immediate access to opening/closing their positions

Our desire to have dynamic representations of data, specifically live stock quotes, was limited by the out-of-the-box frontend frameworks of the day. That didn't stop my frontend team, though. They pushed the browser as far as they could. Teamed up with my IxDs, they cranked out skeleton prototypes of our key path scenarios, allowing us to get feedback from clients, middle and backend engineers, and stakeholders alike.

After a client enters a position, an optimal task flow would be to present a confirmation of the trade and a view of all/open orders, but neither legacy experiences behaved as such.

Open Orders was an important addition for clients across a handful of important scenarios:

• Primary: a highly accessible display of whether or not new positions have actually been submitted.

• When users trade after hours and on weekends they create a stack of open orders that can't officially enter the market until the opening bell. Confirming their existence and providing a mechanism to make changes is critical to keep support tickets down.

• After submitting a limit order at a specific price near the market price, a user will have a small window to make changes (price up or dow, cancel, replace, etc.). This interface needed to clearly present all affordances to reduce time-to-task as much as possible.

The UX brought the client to the open order interface post-trade, with the confirmation message presented just under the topical navigation. We used this pattern throughout the platform to communicate both synchronous and asynchronous system messages.

It’s not earth shattering innovation today in the world of Material UI Snackbars, but in 2004 few web services worked the interface as hard as we did to keep the user informed.

Delivering Impactful Results

This attention to client needs, along with our focus on the craft of solid interaction design, led me to the doorsteps of Theresa Carrey; a contributing editor at Barron’s Online. We had important business KPIs to hit—number of trades and new clients were on the top of the list—but scoring high on the annual Barron's Online Broker Review was deemed to be a mission critical goal.

With merger rumors in the air and Ameritrade holding a 2.5 stars rating (13th out of 15) the prior year, the pressure was mounting to receive a glowing review. Theresa’s review carried weight with potential clients and the industry in general. In the spring of '05, I flew out to Palo Alto with David Whitmore to present the new platform experience.

A quote from Theresa’s review:

“[…] Ameritrade, which swallowed up Bidwell & Co., Brokerage America, JB Oxford & Co. and Investex over the last year, earns four stars this year for its Apex offering. Ameritrade seriously overhauled the Website this past year, finally integrating the technology brought in with the 2002 Datek acquisition. The new site provides improved navigation, more tools and services, easier-to-find information, customization and better trading technology. […]”

Theresa's 4.0 star review rocketed Ameritrade to second place in the online broker space, and just a few months later, Ameritrade finalized the acquisition of TD Waterhouse.

The TD M&A was a play to accelerate a growth strategy through the acquisition of assets and new accounts—it would’ve gone through regardless of our efforts—but our work established a unified, responsive & polished consumer brand experience that served as the foundation for growth through acquisition.

When Ameritrade bought Datek Online, the two brands were completely disparate entities—from their brand promise to visual language to platform experience to trading features.

In just under 18 months I had scaled one of the first UX Design teams in the financial industry while my team and a host of colleagues across three states reimagined our trading platform with new trading features and an overhauled interaction model indexed towards usability.

By establishing working relationships across the leadership of Strategy, Business Analysts, Marketing, and Client Success, I helped the business understand what an investment in research and design could do for our clients.

Being a product designer is most fulfilling when what you make for the world is validated by the people who engage with your work and their lives are made better; when industry professionals agree, you’re in the bonus.