Summary
Managing multiple accounts on mobile devices can be overwhelming due to cluttered interfaces, slow navigation, and poor accessibility. This project focused on redesigning the mobile account listing experience - for both Smartgistics' brokers and admins - to improve usability, efficiency, and accessibility.
Problem
Users found it challenging to quickly locate and manage their accounts due to an unstructured layout, lack of filtering options, and inefficient navigation. Additionally, administrators needed the ability to perform essential account actions on the go, such as changing or adding ownership of accounts, viewing shipment data, and other future enhancements, without delays or complex workflows. The goal was to create a seamless, intuitive, and visually optimized mobile account listing that supports both everyday users and administrators who need quick interactions while on the road.
Users
This app is designed for Smartgistics, a logistical tracking platform that helps manage trucks and shipments efficiently. The two primary user groups for the Mobile View of Account Listing are:
1. Brokers
Brokers are responsible for managing shipments, coordinating deliveries, and ensuring smooth communication between shippers and carriers. They need:
- A quick way to access multiple accounts for different clients and shipments.
- Fast search and filtering to find specific accounts or shipment details.
- Easy account switching to manage multiple ongoing transactions without friction.
- Mobile-friendly interactions to check shipment statuses and update account details on the go.
2. Admins
Admins oversee account management, user access, and overall logistics operations. Their responsibilities include managing multiple brokers, setting permissions, and ensuring smooth platform functionality. They require:
- Quick administrative controls to grant/revoke access, update account settings, and troubleshoot issues.
- Real-time tracking and visibility into various accounts for oversight and reporting.
- Efficient workflows for switching between accounts and making critical updates while on the road.
- A secure yet seamless interface to manage sensitive logistics data without delays.
By focusing on the specific needs of Brokers and Admins, the redesigned mobile account listing ensures a faster, more intuitive, and highly accessible experience tailored to logistical tracking workflows.
Goals
-
Enhance Usability & Speed – Optimize performance to ensure fast loading times and seamless navigation, allowing Brokers and Admins to access account details instantly without delays.
-
Streamline Key Workflows – Prioritize essential account management actions (switching accounts, searching, filtering, and administrative controls) while keeping the interface intuitive and mobile-friendly.
-
Ensure Consistency & Scalability – Maintain a cohesive experience with the desktop counterpart while designing a scalable framework that can accommodate future features and functionalities.
-
Improve Mobile Accessibility & Interaction – Design for touch-first interactions, including gesture-based actions, responsive layouts, and minimal taps, ensuring users can efficiently manage logistics while on the move.
Research & Insights
To better understand user pain points, I conducted:
- User Interviews & Usability Testing – Identified issues with cluttered UI, difficult navigation, and lack of quick actions.
- Competitor Analysis – Researched best practices for account listing UI across financial and SaaS platforms.
- Key Findings: Users preferred quick glanceable information, intuitive filtering, and gesture-based actions for better efficiency.
Challenges
Designing the Mobile View of Account Listing for Smartgistics posed unique challenges, particularly in delivering quick performance and streamlined interactions compared to its desktop counterpart. Since users—Brokers and Admins—primarily manage shipments and truck logistics on the go, the mobile experience needed to be:
1. Performance Optimization for Speed
- Mobile users expect instant access to account information, requiring optimized load times and minimal delays.
- Unlike desktop, where data can be displayed in complex tables, mobile needed a lightweight and efficient way to present key account details without overwhelming users.
- Large datasets (e.g., multiple accounts, active shipments) required smart data caching and progressive loading to prevent slowdowns.
2. Streamlined Screen Interactions
- On mobile, users have limited screen real estate, so traditional multi-column desktop layouts had to be restructured into concise, scannable list views.
- Interactions had to be touch-friendly, replacing mouse clicks with swipe gestures, tap-based actions, and dropdown selections for quicker usability.
- Reducing excessive taps and navigation depth was crucial, ensuring users could perform key actions in fewer steps.
3. Balancing Functionality with Simplicity
- While the desktop version allows for complex workflows and detailed account management, the mobile app needed to prioritize the most essential features without compromising usability.
- Advanced filtering and search tools had to be redesigned to work efficiently within a compact UI, ensuring users could still find accounts quickly.
- Security and administrative controls had to be accessible yet not intrusive, allowing admins to manage accounts without cluttering the interface.
4. Ensuring a Seamless Cross-Platform Experience
- Users frequently switch between desktop and mobile, requiring data consistency and UI familiarity across both platforms.
- The challenge was to maintain core functionalities while adapting layouts and interactions to be mobile-first without losing essential desktop features.
- Responsive design principles ensured that critical account details were always accessible, even on smaller mobile screens.
By tackling these challenges, the redesigned Mobile View of Account Listing delivered a fast, efficient, and intuitive experience tailored for on-the-go logistics management, empowering Brokers and Admins to work with greater speed and ease than ever before.
Multi-Phase Designing
When adapting the Mobile View of Account Listing from the desktop version, it was crucial to prioritize key workflows that users rely on daily while ensuring scalability for future needs. Not every desktop feature could be replicated one-to-one on mobile, so we focused on essential actions like account switching, quick search, and administrative controls, streamlining them for a touch-friendly, efficient experience.
Clickable prototype.
This one was built out in Figma. If you have any issues viewing the embedded version, let me know and we can walk through it.
Key Takeaways
- Mobile-first design requires prioritizing critical information while maintaining a clean, minimal layout.
- Gestural interactions can improve efficiency but require onboarding for new users.
- Admin users need quick, seamless workflows for managing accounts remotely.
- Continuous testing and iteration are essential to refining the experience.