Roles
UX researcher, UX designer, visual designer
Tools Used
Sketch, Figma
Time Frame
2 weeks
Problem
I moved into South Campus Commons, an apartment complex on the UMD campus in senior year. Logging into the page, it looked like this:
Despite all text and sections, there were only two things that I’d ever used the website for: paying rent and sending in a work order (telling the maintenance team that something needed to be fixed). And both of these areas left a little to be desired.
Paying Rent
Considering that one of the main functions of the website is to collect rent, it took up a very small part of the home page. It also made tracking past transactions and possible late fees very difficult.
Communicating on Work orders
One week into living there, my roommates realized that our washing machine had a funky smell that wouldn’t go away. Throughout the semester, we called the maintenance team three separate times, each time having to re-explain the same problem to them. Not to mention, the workers came without any warning, giving us a scare every time we walked in to a stranger standing in our kitchen.
Interviews
We conducted semi-structured interviews with six students who had lived in Commons for one semester to two years.
100% of the interviewees noted that they used the portal mostly to pay rent and submit work orders.
100% of interviewees noted issues when communicating with the maintenance staff. Many wanted more updates about when maintenance would be conducted after a work order had been placed. Many noted that sometimes, maintenance staff would come by and claim to fix the item, but they would come back to realize that it had not been fixed. They wanted some way to follow up with the maintenance staff and give additional feedback.
50% noted that the drop down menu on the work order form was confusing and too long
Analysis using Miro
“No, our oven’s still broken. We just let it go.”
“I dunno what the tabs are, I just click around until I find stuff.”
“They never told me I had a late fee, I had to pay separately. ”
User Flows
We used this user flow to plan out how to adjust the experience of work orders, which statuses would be most helpful, and and how feedback could be given to the staff about maintenance. We wanted the process of revising work orders to be as simple as possible.
Submitting and editing work orders work flow
Wireframing
After going through each page and identifying the issues of the original site, Disha and I modified the user interface to suit our new solution.
Clickable Prototypes
Give them a try!
Final Solution
Information Hierarchy on the Homepage
Pain points addressed: small type, difficulty finding information
From our interviews, we learned that like me, there are really only two functions that residents use: paying rent and submitting work orders. We moved these two actions to the home page, and made them the most prominent features. They can also see the latest information on rent and work orders at a glance, without clicking off the page. This way, everything can be done instantly.
Adding statuses and feedback to work orders
Pain points addressed: lack of control over work orders
Adding statuses to work orders keeps residents in the know, thy are less likely to get frustrated because they think they were left in the lurch. It gives them the control of keeping track of their order, and staying informed. Adding scheduled dates to the status prepares the residents for a visit from a stranger, and gives them some time to plan in case they want to be there during mainentance.
After a visit, our system automatically asks the resident if the order was done to their satisfaction. This saves the resident some work of filling out a new order from scratch, and allows the maintenance team to keep track of what solutions had already been tried before.
Simplifying and consolidating rent pages
Pain points addressed: keeping track of payment history, breakdown of balance
Previously, seeing the rent balance, paying the rent, and seeing the statement were all split onto different pages. We let the user see the balance from the home page, and pay it directly should they want to. If they need more details, they can click in to see the current balance and a much clearer table of previous transactions. This lets the user decide how much detail they want to see.
