The client wanted to make their activity page responsive, bring in a “spending analyzer”, and update the overall design to make it more modern.
Redesigning the UX without any true problem acknowledged. We were designing to solve a problem without knowing what the problem really was.
Even with an understanding all of the different states and use cases, we struggled to find a new way to incorporate the spending chart without using tabs. Between viewing transactions, spending habits, with the ability to control any time frame and search, we weren’t sure how to incorporate all the new functionality without de-prioritizing transactions, which were the main concern/focus/purpose of the activity page. However, the client was concerned that a tabbed approach was too similar to what was already live (during the time of the project).
We ended up designing a few variations of tabs, mostly with what the main use case would be for the overall view. In one version, the date was the upmost factor in determining the data on the page. In another version, we determined that spending could span across multiple time frames and that since transactional data was determined by a specific time frame, the type of data, therefore, drove the data and time frame shown per page.
Once the client was happy with the major focus of the timeframe, which was implementing summaries and spending charts, we moved forward with their version of an agile project. This means slowly wire framing out as the developers decide, rather spontaneously, what they needed in order to finish a sprint. The beginning of this project began just as desktop, and as it progressed, was forced into a responsive layout. However, while most solutions on desktop were relatively mobile friendly, they weren’t intended to be mobile optimized. The client felt that we needed to begin again starting with mobile, and ensure that the user has the exact same experience across all viewports, even with the most minor of details, not realizing that a more adaptive approach would be more effective for this type of project.
In this instance, a more adaptive approach, rather than true responsive, is more user friendly due to the vast amount of functionality and information provided on the page. As one of the most visited pages in the entire site, the user comes to the page in order to find specific information immediately. However, on different viewports that information may be prioritized differently. For example, if the user is on their mobile phone checking their credit card activity, they are checking the most recent and immediate transactions, and are most likely checking for fraud since something may have gone awry when they do not have access to their desktop.
If the user is checking their transactions on their desktop, they are most likely looking for a full snapshot of their recent activity, trying to figure out when in time transactions occurred, how much they should pay, and overall how they are spending their money. Although most users are spending more and more time on mobile phones, the client’s main demographic still relies most heavily on their desktops and would rarely use their phone for the same type of information, as multiple rounds of usability testing verified for us on this project. One of the major issues with this long term project was that it changed hands on the client’s side many times, leaving previously resolved issues to be resolved based on the new project manager’s opinion, rather than relying on testing results and what the users truly want.