Product Design
Lay of the Land
In late 2020 I joined the team helping bring Charles Schwab’s new retail trading research experience out of beta phase. The research section of Schwab’s retail trading platform is used by customers all over the world to help them make wise trading decisions. I led the design of 30+ trading research modules’ responsive behaviors.
Success
- After a successful release from beta into full production, Schwab has implemented the experience on their retail trading research site.
- As a result of creating a set of responsive guidelines, Schwab will be able to continue to design modules that are useful no matter the screen size
- Created responsive designs for each research platform module
- Led collaborative design consistency workshops
- Led weekly design reviews with Schwab’s business stakeholders, internal design teams and developers
- Provided continual support for the Schwab engineering team during the development cycle leading to deployment
Responsive behavior of Schwab’s trading research platform
The challenge
Our task was to help the Schwab team establish a coherent responsivity ruleset for a wide variety of informational modules. We needed to get stakeholder buy-in on each modules' viability so that development could create these modules in the allotted timeframe before launch.
Approach
Based on Schwab stakeholders' goals (make this happen as fast as possible) and timeframe we took a module-by-module approach to tackling each different circumstance of responsive design. We worked together with Schwab’s stakeholders and internal design team to verify each modules’ viability in terms of usability and scope of development.
Research
As a part of our initial design approach we conducted a competitive analysis of other banks' and brokerages' responsive designs to determine a best-practice approach.
A small selection of the 30+ responsive modules needed for the platform
Whiteboard workshops with stakeholders helped us to develop guidelines depending on the module/data type.
Creatively Working Together
As our team encountered each new responsive challenge we began to compile a working list of our rulesets. We used Invision whiteboard to collect, categorize and consistently bounce each of these responsive rulesets off of Schwab stakeholders and their own internal design team. Our stakeholders were wowed and loved the flexibility and clarity a tool like a digital whiteboard gave to the process.
Coherence & Complexity
Various tables, charts, graphs, and visualizations all needed a unique design touch. Some modules were just simple tables that could easily use wrapped content with a scroll. Others, like complex charting, needed a more nuanced touch to maintain usability.
Our design work was not only in creating various configurations of data visualization that fit multiple screen sizes, but also in codifying and implementing comprehensive responsivity guidelines that applied to all modules across the Schwab Retail Research website (now and into the future). These guidelines needed to take into account potentially complex data displayed in various ways including tabular data and charting of various kinds. Because the site is a retail trading platform, usability was also paramount to the non-professional traders who use it.
Desktop
Tablet
Mobile
Results
As our team encountered each new responsive challenge we began to compile a working list of our rulesets. We used Invision whiteboard to collect, categorize and consistently bounce each of these responsive rulesets off of Schwab stakeholders and their own internal design team. Our stakeholders were wowed and loved the flexibility and clarity a tool like a digital whiteboard gave to the process.
Jeremy Hamann
Lay of the Land
In late 2020 I joined the team helping bring Charles Schwab’s new retail trading research experience out of beta phase. The research section of Schwab’s retail trading platform is used by customers all over the world to help them make wise trading decisions. I led the design of 30+ trading research modules’ responsive behaviors.
Success
- After a successful release from beta into full production, Schwab has implemented the experience on their retail trading research site.
- As a result of creating a set of responsive guidelines, Schwab will be able to continue to design modules that are useful no matter the screen size
- Created responsive designs for each research platform module
- Led collaborative design consistency workshops
- Led weekly design reviews with Schwab’s business stakeholders, internal design teams and developers
- Provided continual support for the Schwab engineering team during the development cycle leading to deployment
Responsive behavior of Schwab’s trading research platform
The challenge
Our task was to help the Schwab team establish a coherent responsivity ruleset for a wide variety of informational modules. We needed to get stakeholder buy-in on each modules' viability so that development could create these modules in the allotted timeframe before launch.
Approach
Based on Schwab stakeholders' goals (make this happen as fast as possible) and timeframe we took a module-by-module approach to tackling each different circumstance of responsive design. We worked together with Schwab’s stakeholders and internal design team to verify each modules’ viability in terms of usability and scope of development.
Research
As a part of our initial design approach we conducted a competitive analysis of other banks' and brokerages' responsive designs to determine a best-practice approach.
A small selection of the 30+ responsive modules needed for the platform
Whiteboard workshops with stakeholders helped us to develop guidelines depending on the module/data type.
Creatively Working Together
As our team encountered each new responsive challenge we began to compile a working list of our rulesets. We used Invision whiteboard to collect, categorize and consistently bounce each of these responsive rulesets off of Schwab stakeholders and their own internal design team. Our stakeholders were wowed and loved the flexibility and clarity a tool like a digital whiteboard gave to the process.
Coherence & Complexity
Various tables, charts, graphs, and visualizations all needed a unique design touch. Some modules were just simple tables that could easily use wrapped content with a scroll. Others, like complex charting, needed a more nuanced touch to maintain usability.
Our design work was not only in creating various configurations of data visualization that fit multiple screen sizes, but also in codifying and implementing comprehensive responsivity guidelines that applied to all modules across the Schwab Retail Research website (now and into the future). These guidelines needed to take into account potentially complex data displayed in various ways including tabular data and charting of various kinds. Because the site is a retail trading platform, usability was also paramount to the non-professional traders who use it.
Desktop
Tablet
Mobile
Results
As our team encountered each new responsive challenge we began to compile a working list of our rulesets. We used Invision whiteboard to collect, categorize and consistently bounce each of these responsive rulesets off of Schwab stakeholders and their own internal design team. Our stakeholders were wowed and loved the flexibility and clarity a tool like a digital whiteboard gave to the process.
Jeremy Hamann
Lay of the Land
In late 2020 I joined the team helping bring Charles Schwab’s new retail trading research experience out of beta phase. The research section of Schwab’s retail trading platform is used by customers all over the world to help them make wise trading decisions. I led the design of 30+ trading research modules’ responsive behaviors.
Success
- After a successful release from beta into full production, Schwab has implemented the experience on their retail trading research site.
- As a result of creating a set of responsive guidelines, Schwab will be able to continue to design modules that are useful no matter the screen size
- Created responsive designs for each research platform module
- Led collaborative design consistency workshops
- Led weekly design reviews with Schwab’s business stakeholders, internal design teams and developers
- Provided continual support for the Schwab engineering team during the development cycle leading to deployment
Responsive behavior of Schwab’s trading research platform
The challenge
Our task was to help the Schwab team establish a coherent responsivity ruleset for a wide variety of informational modules. We needed to get stakeholder buy-in on each modules' viability so that development could create these modules in the allotted timeframe before launch.
Approach
Based on Schwab stakeholders' goals (make this happen as fast as possible) and timeframe we took a module-by-module approach to tackling each different circumstance of responsive design. We worked together with Schwab’s stakeholders and internal design team to verify each modules’ viability in terms of usability and scope of development.
Research
As a part of our initial design approach we conducted a competitive analysis of other banks' and brokerages' responsive designs to determine a best-practice approach.
A small selection of the 30+ responsive modules needed for the platform
Creatively Working Together
As our team encountered each new responsive challenge we began to compile a working list of our rulesets. We used Invision whiteboard to collect, categorize and consistently bounce each of these responsive rulesets off of Schwab stakeholders and their own internal design team. Our stakeholders were wowed and loved the flexibility and clarity a tool like a digital whiteboard gave to the process.
Whiteboard workshops with stakeholders helped us to develop guidelines depending on the module/data type.
Coherence & Complexity
Various tables, charts, graphs, and visualizations all needed a unique design touch. Some modules were just simple tables that could easily use wrapped content with a scroll. Others, like complex charting, needed a more nuanced touch to maintain usability.
Our design work was not only in creating various configurations of data visualization that fit multiple screen sizes, but also in codifying and implementing comprehensive responsivity guidelines that applied to all modules across the Schwab Retail Research website (now and into the future). These guidelines needed to take into account potentially complex data displayed in various ways including tabular data and charting of various kinds. Because the site is a retail trading platform, usability was also paramount to the non-professional traders who use it.
Desktop
Tablet
Mobile
Results
- After a successful release from beta into full production, Schwab has implemented the experience on their retail trading research site.
- As a result of creating a set of responsive guidelines, Schwab will be able to continue to design modules that are useful no matter the screen size