Asset Assist is an asset manager dedicated to provide our users with a clear and organized method to keep track of their assets in case something happens to them. Whether used for personal or professional use, Asset Assist will act as an organizational tool to allow users the security and peace of mind knowing that all their asset information is guaranteed to be stored in a safe and secure location.
Over the course of 10 weeks, our team worked rigorously through multiple stages of development to complete the current iteration of our app. Our team conducted user research, user testing, A/B testing, and heuristic evaluations alongside other UX designers to design a functional yet intuitive app.
Needfinding & User Research
At the beginning of our project, we were presented with a design theme to create a project for users over the age of 40. Our first course of action was to step outside of our comfort zones and try to understand what it was like in our target audience’s perspective. This process included interviews, behavioral observations, and diary studies.
After individually gathering new insights and perspectives from different users, we went over reoccurring issues our potential users had. We realized that an overlying issue they had was a lack of organization and security with their assets — especially as they grow older.
To better understand our users’ perspective, we created a persona and wrote storyboard of different scenarios our persona experienced with our app. Our persona was heavily based on a particular user that was heavily-reliant on physical documentation of all his assets. Like the other interviewees, he had difficulties keeping his personal items organized and easy to find.
Through our research, we realized that it was important for us to create an app that could facilitate the way older users who own assets organize and keep track of everything they own. Our goal is to make an app that is clear, fast, and easy to use.
With an overall goal in mind, our team decided to start working on a flow chart to decide how to design the app. During this process, we faced a difficult design decision as to how users would navigate through the app. This difficult decision will continue to be a topic of debate as we reiterate the design of this app again and again.
As we came up with our flow chart, we were debating on the navigational tools we would use. We were particularly interested in the differences between hamburger icons versus a tab bar. On one hand, hamburger menu options have been around for a while, so they should be well-known. On the other hand, they’re used so often that new designs have tended to stray away from them. Tab bars are always present icons for users to see, but there is also the issue of users not knowing what each icon means and how small those icons are.
Because our target demographic consist of much older users, we thought it would be best to stick with a hamburger menu icon with large text. In that way, users would easily be able to read their options and never second-guess what an icon might lead to.
We then created a paper prototype so we could receive a heuristic evaluation from other UX designers. Our main goal from this feedback was to figure out which heuristics we violated and how we could improve our design based on that feedback. Some examples of the feedback we got include:
- Visibility of System Status — After selecting an image to upload, there’s no status of whether an image was successfully uploaded or not.
- Match Between System and Real World — The “log out” button looks more like a “power off” button, so it might not be the most intuitive to our target audience.
- User Control and Freedom — There is no way to exit from the menu bar after you’ve clicked on it, so what if it’s pressed on accident?
- Consistency and Standards — One of the search pages has a search bar whereas the advanced search option does not have the functionality but has a bar there. Either include the bar with the functionality or don’t have the bar at all.
- Error Prevention — When filling out an asset, there are no required fields, so users will automatically assume everything is needed.
- Recognition rather than Recall — There is no option to view all assets, so users will be forced to look up assets. If this app is meant to help people find assets, they should have the ability to browse through everything right from the home screen.
- Flexibility and Efficiency of Use — The home screen is plain and uses up more than 50% white space. Perhaps more having only the important features as buttons could help users.
- Aesthetic and Minimalist Design — The home screen is a bit redundant having all the same buttons as the hamburger dropdown menu.
- Help Users Recognize, Diagnose, and Recover from Errors — Currently, there are no error messages if there are issues. If something happened to the app, there should be a draft/autosave feature.
- Help and Documentation — There are no help pages or tutorials, so you go into this app completely blind.
Prototyping and Graphic Design
After receiving feedback from the heuristic evaluation, we set out a list of tasks we wanted to make sure users could accomplish with our app. To ensure we had the correct idea of the app in mind, our team came together with a quick wireframe.
Our team began coding our app using Bootstrap. While the coders on our team focused on development, I began working on the organizational and design aspects of the project. I created a Development Plan to create a structured template for when to have certain parts of our project completed. Click here to see the full development plan.
I also began working on creating graphics for the app, including the success, delete, and overall app icons. During this time, I went over different color schemes to help create a branding for our application. I went with a blue, yellow, and orange color scheme displayed throughout our app.
These colors were chosen to represent the calm but optimistic attitude we wanted our users to feel when tracking their assets. They should feel secure knowing that their items are safely stored away in our databases, and if anything were to happen, they have quick and easy access to file for any and all issues.
This led to me pitching the idea of naming the app “Asset Assist” to further emphasize our brand.
After we finished the core functionality of the app and completed a few basic designs, we decided to start going through our first two rounds of user testing. During this time period, we would continue to reiterate the design of the app, fine-tuning different functions.
Our main goal from user testing was to figure out if there were any major breakdowns users had. To ensure that our user tests experienced the same type of scenarios, I created a testing protocol. Click here to look at our testing protocol.
One of the breakdowns a user faced was the failure of the app to accept the fields he inputted for “Asset’s Price”. He attempted to fill in the price using a dollar sign ($) and also attempted while inputting a comma (,). Both were not acceptable formats, but the error message did not help him recognize or recover from his error. The message stated “Please provide the asset’s price.
Additionally, the error messages were not intrusive enough for users to see what some issues were. One breakdown involved a user inputting all of the required fields and pressing “Submit”. However, nothing happened after the user pressed the button. Since there was no animation for feedback either, the user continued to press the button a few times before scrolling down and seeing an error message.
Aside from other minor breakdowns, there was only one other topic we wanted to cover while finalizing development on the app.
We found that quite a few users did not find it intuitive to scroll down to see more options for buttons to press. This hindered the way we designed the app because they missed out on a lot of the core functionality by not seeing the option to “Search for Asset” or “View all Assets”.
This resulted in a difficult decision to redesign the navigation layout of our page. We noticed that several of our older users did not utilize the hamburger icon menu. Thus, we wanted to ensure we optimized the home screen so users could clearly navigate through our app.
Our potential redesigns were based on the desire to have all button options visible to the user at all times. However, this led us to creating button layouts that were smaller. We decided that we would leave a navigation bar at the bottom of the screen because other apps utilize this type of design.
With a new idea for a potential redesign, we wanted to try doing A/B Testing to see whether or not we were right about making this major design change. We predicted that more users would click on the “Search” button (that was previously unnoticed by users unless this scrolled down for more options) with our redesign.
I began testing as many users as I could within a week and checked the results through Google Analytics. This allowed us to run an experiment that randomized the page each user saw to avoid potential biases. After roughly 6 days of user testing, I gathered roughly 46 experiment sessions and recorded the qualitative feedback alongside the quantitative measures done by Google Analytics.
There was an overwhelming negative reaction to our redesign that we did not foresee. Majority of our users were hesitant to use the bottom navigational bar and none of them used it to search for items specifically. In all testing sessions, I noticed that users used it to “View All Assets”, but would rely on the top hamburger menu. Our redesign had the opposite effect than we predicted.
I also conducted a chi-squared test to see whether our results had any significant impact, and it seemed that our redesign had no significant difference than we desired. It seems that our redesign had less than 0.05% having a statistically significant impact on users. In fact, both of our designs were rather unsuccessful according to the data.
Reiterations and Onwards
Based on some of our qualitative feedback and the results of our Google Analytics experiment, we plan on making reiterations of the home screen and continuing A/B Testing to see which designs work best. One of our ideas is to make use of the white space that’s currently on the home page. We want to try a redesign similar to the original but without the logo taking up a third of the screen.
Our design process has been and will continue to be about creating the most efficient and intuitive experience for our users. We’ll continue to keep our target audience’s needs in mind as we go through the process of reiterating our design.