Rentrax Operational Dashboard
Rentrax, a leading rental management firm in Vancouver, offers cutting-edge cloud-based software that improves sales, inventory management and more. Despite its strengths, the complex structure makes navigation difficult. A redesign for simplicity is required.
My Role - UX Design, UI Design
Duration - 5 Months
Tools - Figma
Overview
Partnering with the Shumka Design4Startups program, we embarked on a five-month journey to redesign the software dashboard, aiming to create a simpler workflow and a more intuitive user experience. Our major improvement was reorganising the Product Catalogue display to match the inventory list's structure. The new hierarchy makes it significantly easier to manage a large number of products in the backend while simultaneously updating the customer-facing frontend.
Information Architecture
By beginning with an Information Architecture to decipher the intricate workflow, I gained two valuable insights. Firstly, our users' perception (mental model) of the dashboard did not align with the way information was presented on the screen. Products and attributes were displayed in separate tabs, causing a disconnection that negatively impacted usability.
Secondly, the workflow was plagued by loosely organised taxonomies, resulting in misunderstandings due to the use of inconsistent terms by the team. After clarifying and standardising the terms, we saw an improvement in team communication and user experience thanks to the unified taxonomy in the Information Architecture.
Component Library
To ensure a cohesive design style across all products, I created a Component Library that encompasses elements such as colours, typography, buttons, input fields, icons, and more. I also emphasised the importance of utilising this centralised source of design information to all teams, as it helps maintain consistency in the product's visual appeal. Reusability and scalability were also considered to reduce the need for duplicating design work and to accommodate new components as the product evolves and grows.
Solution - Hover
When the previous dashboard was developed, the team was aware of the fact that the Product Catalogue and the Inventory List were not displayed together as would be expected. However, they decided to proceed with the flawed design as they were facing difficulties in fitting all the information within the limited screen space.
To address this issue, I designed the Product Catalogue as interactive cards to maximise the use of its various states to display the maximum amount of information. Additionally, incorporating a hover state provides users with a cleaner and more organised information hierarchy. Secondary buttons are only revealed on the back of the card when the user hovers over it.
Solution - Drawer
The second challenge was to link Products with their Attributes (similar to tags). Each product can have up to 40 tags and sub-tags, making it impossible to display them all on the same screen.
To overcome this, I added a sliding drawer extending from the right side of the screen to host all the Attributes of any selected Product. This design reduces the cognitive load on the user by allowing them to easily call out and retract the drawer as needed. This solution was one of the most well-received by the team and was believed to greatly enhance the user experience.
