Challenge
- The original table display was fixed in width and height, not adjusting to different screen sizes.
- The devices used on-site by staff are mostly vertical tablets or mobile phones, rather than desktops.
- Although users wanted me to optimize the overall user experience, this platform was already in operation before we joined. Thus, there was considerable resistance when communicating changes to the user flow.
Solution
- To avoid horizontal scrolling to view table information, I adjusted to a column design to adapt to different screen sizes and set overflowing information to wrap.
- On the vertical tablet interface, I changed the original table to display information using info cards. Although it cannot provide quick same-column browsing like a table, it avoids horizontal scrolling. Paired with detailed filters, it effectively balances user experience and information browsing functionality.
- In the app's usage flow, we implement more of mobile device features such as common mobile gestures (long press to select, tap blank space to exit, etc.)
Benefits
The most favored design by users in this project was the login screen we designed for them. The design concept used the shapes and lines of the project itself, paired with stable colors, keeping the palette simple to make the screen look both designed and formal. This design allowed users to set the visual style for future series projects.
Takeaways
This project was unique in that it was mainly used on tablets, making the design process very refreshing. In user experience optimization, it was also unique in focusing on a group less familiar with digital products. I learned a lot about the details that need attention for this group, such as many users not knowing that table headers can be clicked. Therefore, if you want to design table headers as filters, more obvious buttons are needed to prompt them, and so on.
