Cooperation with Dryg shows the value of partnership approach in software development. Initially our goal was to help with the development of a web service and the platforn’s mobile app (iOS, Android).
Dryg is a child product of a larger job board brand which goal at that time was to explore the field of blue collar employees. As a constantly and rapidly evolving platform Dryg started to struggle with inconsistency in the design and user flows. Our developers found out that the workflow with the design files was not as efficient as they are used to when working with our internal design team. We have reported those issues to Dryg and fortunately they were open to include our designers to try to optimize and improve the process as well as help to improve the general User Experience of the whole platform (Job board and Employer ATS).
UX Audit and Design deliverables review
To create any solutions we’ve had to start with gathering all of the necessary informaiton. We had to approach it in two ways
Review the existing user experience - which included assessing the ease of navigation throughout the service (information architecture, user flows), reviewing accessibility and UI ease of use (WCAG compliance check, UI elements review) and general User understanding of the communication and product (copywriting).
Review of the design files - we wanted to understand how the product and development teams were operating so we could spot issues and find areas of improvement.
UX Audit
We found seveal issuies with the User Experience which were mainly caused by rapid changes to the product in its early stages. We have identified platform user profiles and followed their paths to complete their goals.
Some of those issues included:
Not clearly distinguished flows for two types of users (employee and employer). Resulting in dead ends or large bounce rates on specific pages. The platform struggled to provide clear paths to Job Board user and Employer ATS.
Many hard to read (low contrast) texts and several too small UI action elements (e.g. buttons) that were causing strain to the user.
Not covered edge cases for some of the user flows, making the system behave unexpectedly and often add redundant steps in user flows.
Design deliverables review
We reviewed the design files (Figma) as well as other presnt articrafts (personas, product presentations, etc.) to seek inconsistencies and workflow improvements.
Most problems could be found in the Figma files, which contained styleguide and wireframes. The platform designs were using UI components from different libraries, scattered between different files. Grid appliance was inconsistent as well as the spacing system. It was hard to get the knowledge of “what is where” in the files without assistance of the deisgner.
The construction fo the UI component library was incoherent and hard to comprehend by the developers during hand-off.
The prototype features of Figma were not used at all, making it much harder to test the proposed flows with the users as well as show them to the developers.
With the incomming redesign of the mobile app, we have recomended to create proper UI component library that could be shared between web and mobile apps. This would make further design creation more consistent, easier and faster. The advantages would also apply to the development, additionally decreasing it’s cost.
Scalable and optimized design system
We worked closely with the developers to achieve a mutual understanding of our goals in terms of the hand-off and general UI construction. Before we would enter any UX improvements, we needed to have a solid fundament to build proposals for the new views.
We introduced 4px spacing system under which we aligned typography, icons and UI elements. This allowed us to work faster with placing and pairing different elements in the UI as well as achieve better harmony in the layout.To avoid any misinterpretations, we replaced naming system (colors, typography styles, UI elements and their states) to one that is more predictible and can be shared between design files and the code repositories.
We moved the styleguide, UI components, wireframes and prototype to one, collaborative file which allowed the team to reduce the need to communicate and seek the information. Making the further development time much faster and coherent with the design files.
Our design team significanlty reduced the number of used UI elements, using what’s left to the fullest. It streamlined the UX improvement ideation part as well as the development. The whole library was easier to navigate and understand.
The final change was to unify the UI elements between web application and mobile applications. Our client did not have a robust design team on it’s own and we knew it would be hard to manage several libraries with available resources. The management became easy when we hit the golden spot that allowed us to use the majority of the same components for all platforms (web, iOS app, Android app).
UX improvements
At the same time we worked closely on finding solutions to existing user experience problems.
Besides UX Audit, we’ve examined available analytical data and user feedback (Customer Support entries, User Ratings) to find other underlying issues.
Our main addressed areas included:
Clearing up user flow and better distinction between using the Job Board as a user actively seeking a new job and Employer ATS - that tracks applicants and job offers. We’ve created improved main navigation with clear login page showing the user to which part of the platform he is logging in.
System’s behavior improvements when using Job listing - We got rid of pagination allowing users to use infinite scroll. Getting into an offer page and returning to the listing would now return to the place where the user was before, with all of the filters selected. It was infuriating existing users before the change because there was no fast and efficient way to go back.
Improving event trigger areas - larger buttons, larger input spaces and other controls allowed users to be less precise about clicking/tapping and by that decreased the cognitive load with using the interface. The whole platform has become more acessible and easier to use.
Speeding up task completion time - we’ve tried to remove as many as possible of redundant steps in user flows, rethinking their purpose while still keeping an eye for current code’s architecture limitations. The need to jump around/scroll through the interface to e.g. reach critical buttons was significantly reduced in major tasks (like applying for a job).
Edge case coverage - we’ve worked closely with the development team to remove dead end’s and unlogical redirects in various situations which were not covered in the initial designs. For example we’ve changed the link building approach for job offers, which contained job category, when a user would enter an expired link to a job, the system would inform him about it and show similar offers from the same category.
