Legacy applications and integration inventory
Total Quality Logistics (TQL)
Navigation for a Multi-App Logistics Platform
- User problem
- Sales-floor users moved between logistics applications through a legacy ribbon that competed with dense operational screens for space.
- My responsibility
- Senior Product Designer responsible for the shell navigation, user research, interaction patterns, and engineering handoff.
- Main constraint
- Preserve familiar favorites and role-based access while moving WinForms navigation into a web-based, multi-application shell.
- Project status
- Vertical-menu direction approved and presented to developers for technical scope and architecture.
- Outcome
- Established the approved vertical-menu direction and reusable navigation patterns for the multi-application shell.
Research
Understand what the shell needs to carry.
I interviewed sales leaders and their assistants and shadowed daily work to understand how they moved between applications. I documented screen placement, use cases, and recurring problems rather than evaluating the navigation in isolation.
That operational context informed the shell architecture, application access, and menu behavior.
Exploration
Test the horizontal direction before committing.
I gathered sales-floor feedback on the horizontal-menu iteration before moving to a vertical drop menu. The comparison made screen-space trade-offs visible.
Design decisions
Give operational screens more room.
Feedback on the horizontal ribbon led me toward a vertical drop menu. Screen space was valuable across the applications, so I changed the navigation direction while preserving familiar favorites.
The trade-off was to concentrate application choices in an expandable menu while leaving more of the working view available.
Design decisions
Separate the shell from the applications.
The shell’s responsibility was navigation and application access, rather than rebuilding the applications themselves. I tracked how each application opened so the team could identify the connections needed for the web-based shell.
I partnered with engineering on interaction behavior and presented the approved direction to developers to work through technical scope and architecture.
Delivery
An approved direction for technical planning.
The vertical-menu direction was approved and presented to developers for technical scope and architecture. The handoff included navigation behavior, application access, and reusable patterns.
Delivery
Carry the rationale through development.
I presented and defended design decisions in whiteboard sessions with developers, working through interaction details and technical constraints.
I worked alongside development and reviewed implementation for visual and functional fidelity. That partnership was part of delivery, not just a final Figma handoff.
Supporting evidence 4 original artifacts
Complete boards and additional screens behind the selected details above. Enlarge any artifact to inspect it at full size.
Research and horizontal-menu exploration
Iteration and feedback board
Approved header and vertical-menu direction