Hammock - Web app
UX and UI Design
Client: Hammock Project: Web app Role: UX/UI Designer
Hammock is platform for landlords to manage their properties finances. It provides bookkeeping, tax statements and property investment metrics.
During user research and usability audit it was identified a variety of issues across the platform. The strategy was to learn and improve the existing user journey and overall look & feel.
This project was to improve the design and overall user experience on the transaction’s screens.
- Improvements needed as result of user research and usability audit
- Introduction of new features
- Outdated designs
The main challenges of the process were the prioritization of issues to fix and keep the consistency across all the platform while doing improvements changes in specific areas of the web app.
After understanding the problem and defining how the improved user experience would look like, I’ve designs a few sketches and wireframes with potential solutions to solve the issues and started to discuss them internally with stakeholders, product, and development team.
To allow more space to the content, was created an expandable/collapsible side bar. User have the total control when he wants to see the navigation expandable.
Menu items name and reorder was reviewed based also on an update on the information architecture of the web app.
Hammock allows users to automate their bookkeeping, so they don’t have to add and categorize every single transaction. To take advantage of these feature, the user needs to connect his bank feed to Hammock and all transactions will be instantaneously displayed on the platform.
Once the transactions are on the platform, the user will be able to match similar transactions and easily track them all together.
Alternatively, user can add a transaction manually.
Once a bank feed is connected into the platform, all the bank transactions will be shown on the transactions table where the user can view, edit, track, match similar transactions, categorize, and link to a specific property or portfolio.
On the research stage, it was found that the filters were too busy and the user preferred to scroll down to find the transaction that it was looking for rather than using the filters options. For that reason, on this project was also improved the filters area.
This project started with research, where some issues were found and as strategy, the areas of improvement were prioritized.
On the optimization of the transactions screens, once all issues were found and analysed, I started defining all the user stories, scenarios, journeys and started to create the journey map and a new information architecture.
After defining how the improvements would look like, I started to sketch and wireframing some solutions and discuss them with the business, product, marketing and development teams so we could analyse solutions and understand which one would be the best to implement. Also, on this stage I conducted a few usability tests on a low fidelity prototype so we could also have the solutions validated by the user.
Once the best solution was found, I started creating the UI designs, update the UI kit with the new styles and create a high-fidelity prototype to have a new round of user’s feedback before handing the project to development.
This project was an iterative project, where after the implementation it was tested, and the performance measured again and new improvements were implemented.