Updating a Legacy System
I came into this project with some wireframes already developed but with no testing completed. As the only designer on our product team, I was tasked with creating prototypes, conducting usability studies on the existing wireframes, making iterations to the wireframes based on results, and finally implementing our company’s UI styling.
ResearchAfter having discussions with one of our biggest clients, we knew which tasks are most common in a day-to-day setting for a customer service agent that uses the current system. At this stage, I didn’t need to design any additional wireframes.
I designed seven prototypes based on different scenarios that might come up. Tasks included refunding a payment, adjusting a payment, finding an order without a name, etc. Knowing that these tasks are realistic helped us to focus the results of the testing on user pain points with the program itself.
The design process was simplified due to staying within the brand identity, but that’s where the simple part ended. We were essentially building this from the ground up, and I needed to showcase that I was a new set of eyes looking at the existing wireframes. Fortunately, the data we gathered during the user testing really helped me hone in on what issues needed to be prioritized most, what the issues were, and subsequent meetings with my product team helped me figure out how to address them.
Although I was able to walk into a situation where some wireframes were built, it turned out that those largely needed to be redone. The wireframes were used for the usability testing, and the issues that arose required sweeping changes to the layout and information architecture. I redesigned the wireframes, maybe small iterations after some meetings, and moved on to applying the UI.
The flow below shows one of my favorite features, since it involves each of our three products. It allows an agency to put out free passes for select user based on email address. This is great for students at a university.
I learned a lot during this project. I was really glad that we were able to use wireframes for the usability testing, because I believe that gave us the greatest insight into what we needed to really design.
My favorite part of the project was collaborating with the rest of the product team after all of the usability tests had been completed. We spent an entire day pitching ideas, iterating on old ideas, and the entire time I was making magic happen in Figma for all to see, just waiting eagerly for the “Mmm I don’t think that works…” or “Yes! This!” comments from my teammates.
Ultimately, the goal of this overhaul was to make the user experience better for the customer service representatives. Although each part of my job is important to me, this one was particularly close to me as I’ve worked with similar software in the past in a previous position, and I know personally how frustrating it can be to falter because of a poorly designed interface while trying to help a customer solve their own issue.
The updated software was rolled out in late summer 2021 and we’re going to be issuing surveys and interviews later to determine the next wave of pain points. I’m proud of what we built, but nothing is perfect and I look forward to being able to improve upon it in the future.