Enterprise UX Work - Walkthrough

Part 1/10 - Define: nswering a key question: Different Design for different Platforms?

What Do We Want to Be - Art of the Possible

Business leadership was not sure if it's best to only design for Mobile devices, or if a Real Time Web based Cross Platform strategy was possible.

By comparing how other industry leaders approach online offerings, we were able to align and approve a Cross Platform strategy based on current technology constraints.

Part 2/10 - Define: Vision Alignment

UX Roadmap

As Agile Sprint development was new to the organization, as I had the most experience, it was easier for the team to have a UX Roadmap to be able to plan for Development and Capacity Planning.

It was easier for the organization to understand what customers will do with the products, rather than the standard of "throwing" technology solutions in search of a customer problem

"The journey of a thousand miles begins with one step."

- Lao Tzu

Part 3/10 - Define: Journey Mapping, Personas

What are the current customer problems?

"You can't really understand another person's experience until you've walked a mile in their shoes"

- Ancient Proverb

To understand customer problems, it was necessary to see the current state of trading, using UX Design Thinking Tools

Findings:

• Journey Maps, Personas were created so that it was clear that there are different types of users
• There is an opportunity to cater to a segment of Active Traders, Options Traders, as well as the Casual segment
• For Mobile Trading, it was found that it took 8 minutes to complete a trade on the current Mobile App, using the iOS Native Framework
• This helped understand that for trading, customers have a different need than basic iOS apps capabilities

Journey Map Example

Persona Example

Part 4/10 - Design: Stakeholder Mapping

Who needs to be on the team for success?

Before development could start, I lead Organizational Design sessions to help understand who we need to be successful, and how.

• We mapped out all the stakeholders, along with their roles and responsibilities
• Together, we were able to align and get "buy-in" for the Stakeholders/Pod/Agile Team/Experts as needed
• This was essential as the project needed to move into a modern Agile Framework

Part 5/10 - Design: Prioritizing, Grouping Feature Requests

Understanding what we want to build and how

Using Design Thinking techniques, the next step was to still a business design phase, where we mapped out features.

• Together we prioritized what we want to offer customers
• We had the right mix of stakeholders participating in the Design Thinking Sessions
• Able to create Sitemaps and basic User Flows as well as how customers will interact with the new trading platform
• This was a big time saving opportunity in our planning sessions and helped manage the Agile Sprints

Part 6/10 - Design: Story Cards, Detailed User/Screen Flows

Iterative Design of Elements on the Screen

The next step was to create Story Cards and User/Screen Flows.

After taking a feature from the prioritization list, we used the "Solution > Value > Challenge Solved" model to create Story Cards; quick Wireframe mockups were made during workshops to help visualize each Story Card.

It's a common misconception that only User Stories can suffice; for apps that need Information Density for Productivity Decisions, User Stories on their own don't provide enough context for more visual and interactive heavy applications.

More detailed User/Screen Flows were created to detail how to satisfy the Story Cards.

These deliverables are especially important for both front-end and back-end Developers so they can plan out their development process, as well as Business Operations staff to plan and execute on Product and Customer Support needs

Together, these help understand how many story points and prioritization for development Sprints

Part 7 - Develop: User Stories

Start the Development Process

Once the Story Cards were complete, I created User Stories, based on the standard model: As a "type of user" > I want "some goal" > so that I can "some reason or outcome"

Sample User Stories

• As a user, I want to be able to place buy and sell orders quickly and easily, ensuring efficient execution of my trades
• As a user, I want to be able to create a personalized Watchlist of stocks, so I can easily track the performance of my chosen investments
• As a user, I want to receive real-time stock price updates and alerts, so I can make informed decisions on when to buy or sell
• As a user, I want access to detailed stock charts and historical price data, so I can analyze trends and patterns
• As a user, I want to be able to set up customized alerts for specific price levels or news events, so I can be informed and react accordingly
• As a user, I want access to more than basic financial news and analysis, so I can stay updated on market trends and company performance
• As a user, I want to be able to view and compare key financial ratios and indicators for different stocks, so I can do investment research and decision-making
• As a user, I want to be able to view my portfolio holdings and track performance, so I can have regular performance reports
• As a user, I want to have a secure and user-friendly platform with robust authentication and encryption, so I can monitor my personal and financial information

Part 8/10 - Develop: Wireframes

Sample Wireframes

Part 9/10 - Develop, Refine: Build Prototype, Usability Testing

Confirming Assumptions with Real User Feedback

With the Interactive Prototype and code versions, we start rounds of Usability Testing.

A Usability Testing plan created so that we could get direct input and feedback from users, as we iterated through different versions during Sprints.

With the Interactive Prototype and code versions, we executed, reviewed and iterated in round of Usability Testing.

Using experienced Usability Testing facilitation techniques, we created a testing script, as well asking users to talk “out loud” of what they are doing and thinking, explain to them that it is useful to do this as "we can't see inside your head", which they were happy to comply.

Sample Testing Session

Part 10/10 - Develop, Refine: UX and Developer and Documentation

Confirming Assumptions with Real User Feedback

As development Sprints continued, the team constantly received updated UX Documenation.

In an Agile way, when technical constraints were found, the iterative Wireframing and Prototyping fed into the documentation to keep everyone up to date

Sample Design System and Developer Documentation