The UX/UI Design Fixes for Route4Me Web
Product
Route Planner “Route Optimization Software” Logistics Management Software Founded in 2009, Route4Me has helped thousands of small business owners plan & optimize all of their routes in seconds. The world’s most used route sequencing and dynamic route optimization software is available on the iPhone, iPad, Android, and on the web.
UX/UI Problems
I think most of user pain in Route4Me web interface happens in extra modal windows and some mistakes. User experience needs to be more simple and intuitive, then user can be happy with service and he can recommend it to others.
Routes List
The page layout is not neat, some functions has difficult user experience. Extra filters has two views: in modal window and in a page. Icon is inside the search field. User can see two views of extra filters in the same time. When user see row with extra filters, he can click on cross icon to delete all extra filters and close the row.
As a solution I work with page layout and simplify some functions. Left menu has small and big view for large displays, user can manage state by click on menu button. All filters button is separate from search to be more clear to user, on click second filters row shows/hide directly, no need extra window. If some of filters active the main icon turns blue as a indicator for user. Route in table opens by click on row, except click on other interactive elements, as like in Gmail. Pagination is fixed on the bottom, click on “Load More” button add 10 more rows on page.
Plan New Route
When the user clicks the “Plan New Route” button, they are taken to this view. Action buttons are displayed in the modal window, and they are also duplicated on the page.
Instead of working in modal popup windows and change page layouts I suggest user experience can be better if user works in the same layout. File menu can be adaptive by user needs on the page, some functions can be disabled. If user hover cursor over “Route Settings” button the tooltip is showing, same for other icons. Left menu is collapsed.
Interactive Map Editor
When the user enter “Interactive Map Editor” he works in second modal window. The layout is new again, with two primary active buttons with different functions.
The user works on the page instead of popup modal window. If user click on “Cancel button”, he will return to “Plan New Route” page. When user add new address Google map can zoom in/out as before.
Route View
The Activity Feed function gets page layout complicated. User can click on specific address and see extra details of the stop.
The Activity Feed function opens in modal window this is more consistent for layout, user can see counter on button if any new activity happened. Address detail opens by click on new icon or by clicking on specific address as before.
This is a test task from Route4Me team. I want to say for this task I do not do research about user needs, just fix problems with UX/UI design.
Thank you for your time and consideration.
Sincerely,
Igor Suslikov
