The objective of this project was to enhance the user experience of a web app used by prominent UK restaurant chains to manage customer feedback, reviews, and complaints. With competitors offering more user-friendly solutions and expanding functionality, it became clear that a redesign was necessary to keep the client competitive.
Resolve issues from the current system
Incorporate findings from research study
Incorporate findings from research study
Faster high fidelity screen design
Atomic design system & components
User flow & micro interactions
Collaborate with UI designer
Design for mobile and tablet breakpoints
I was responsible for redesigning the app's Inbox screen to improve usability and streamline how restaurant teams respond to and resolve customer issues. The Inbox serves as a hub, collecting customer communications from multiple channels, including Facebook, Instagram, Trip Advisor, Twitter, and email. The Inbox includes a wide range of features, such as tagging, priority flagging, assignee management, filters, voucher offers, templates, and more. With so many features to accommodate, my challenge was to create an intuitive interface that enabled quick, efficient handling of customer queries while working within the constraints of limited screen space. This led to the design of over 150 interface states, ensuring that each user interaction was smooth, accessible, and effective.
User research, conducted by Full Clarity, involved interviews with actual users of the current app to identify specific pain points. These insights were compiled into a document, which became the foundation for my design work.
I also created the atomic design system in Figma for this project. This system ensured consistency across the app and allowed other designers to collaborate on the same file seamlessly.
The work was divided into two key areas. I was responsible for the UX and interaction design in greyscale, while a UI designer was later brought in to apply the client’s branding. By using an atomic design system, the UI designer could style each component directly within the library, which would then update across all instances in the file. This streamlined process allowed both of us to work simultaneously while I focused on creating detailed user flows and interactions for various features, the UI designer could customise the components to match the client’s visual identity.
.png)
.png)
We conducted regular design reviews with the client to ensure the solutions aligned with the pain points identified during user research. Each iteration of the design was validated against real user needs, confirming that the issues surfaced during the research phase had been effectively addressed.
One of my final responsibilities was designing how screens and interactions should behave on smaller mobile breakpoints. This not only ensured that the app remained functional and user-friendly on mobile devices but also provided clear guidance to developers on how the design should respond across different screen sizes.
