Right Menu
tastytrade’s platform features several independent menus: the top page header, present on all pages, serves as the primary control center; the left menu handles navigation and includes a bonus watchlist function; and the right menu acts as a supportive information panel tailored to what the customer is viewing on screen.
A primary hurdle with the right menu was that it previously mirrored the left menu, causing confusion about each menu’s purpose. Tabs and navigation were also positioned on the left side of the panel instead of docked to the right.
The platform’s color tokens were designed for focused surfaces: less important content used the “body” token (black), while more important or center-pane-related information used elevated or lighter colors.
Because the right panel supports the central content, the plan was to undock it from the right edge and redesign the UI to visually connect it more closely to the center pane while further differentiating it from the left navigation menu.
The final result tied the right panel’s UI/UX more closely to the central content in both importance and relevance. Additional refinements tightened spacing between elements, making the layout more compact while removing noise that previously made the panels harder to navigate.
