Loading
Loading
You probably walked in a restaurant, cafe, … and saw a touch screen kiosk. Lots of people these days use these devices to order their food and other items. This project has two different sections, one section which is the front face of the product that actual users see this and order foods from it, the other face is back-end that users who buy this product for their restaurants or cafes can manage their kiosks which are just one type of hardware that can be managed through this system. I was responsible to create a solution for the back-end management system.
This is one of my projects as a user experience designer for a company which focuses on hospitality business. I was responsible to solve the complex problems, creating wireframes, designing visual comps and redlines for managing, editing, creating profiles, menus, items for different types of devices like kiosks, waiting displays, terminals, …
Creating and managing menus in POS systems are hard and very time consuming. Users who are using and managing these devices are not very tech savvy and want to create a good looking pages for their services fast and easy. We needed to find a better and easier solution to help users manage their POS dashboards.
Our biggest challenge was limited amount of data about our users and how they are using our devices or competitor products. Since I was new and unfamiliar with POS systems, plus lack of dedicated researcher, I started planning some preliminary user research to get some insight about this sceanrio.
My approach involved initial planning for user research, followed by the creation of rough sketches. These were then discussed with product owners to iterate on ideas. When we reached a state that was suitable for research, I proceeded to design a fully functional prototype. This prototype was instrumental in conducting user tests, allowing us to gather essential feedback and insights.
After initial user research, collaborating with product managers and engineers, I found these initial findings about our product, limitations and users:
In this section after interviewing the users we understood that they want to see all of the kiosk's profiles that they can manage in a very clean interface. They need to see all profile names which in this case are POS hardware, state of the hardware either it’s active or inactive without going deeper into profile view (which we added a colored tags in the table for them to easily scan through all items), menus that specific profile is using, type of the hardware that this profile is registered to, last updated date and the last person who has updated this profile.
After our research we found that users had difficlutly with filtering through these kiosk prfiles. So I decided to update the fitlering to address this issue.
I moved the filter options to a single location which can easily be activated by clicking on button and users can change multiple options at a same time and see results immediately.
This is before research concept:
This is after research concept:
Here are the designs and redlines for kiosk profiles:
We decided to create a wizard experience editor to help user with a step by step guide to create a new profile. Becuase it was a new product, users didn’t know anything about how they can create a new profile, how to attach a menu to profile, edit menu items and change its properties.
Using this method we managed to help users easily understand how they can create a new profile step by step and at the same time they can see how their profile is going to look in the actual hardware. we added auto save functionality to this section to help users understand that they won’t lose any of their data while they are creating this profile.
After research we found out that users had a hard time understanding the logic of each step in creating a new profile, each section was at the left sidebar and it didn’t present itself as a section manager for each profile.
I moved the sections manager to the top and with use of Microsoft's Office ribbon design we solved this problem completely.
This is before research concept:
This is after research concept:
Here are the designs and redlines for new profile:
Same as creation a new profile, we decided to create a wizard experience editor to help user with a step by step guide to create a new menu.
When users tried to add new items to a menu, the search result was covering the previously added items and they didn’t see the changes while they were adding the items because newly added items covered by search drop down results.
We solved this by moving the search bar to the right side and make the results panel smaller, this way they can easily see previously added items and search results at the same time.
This is before research concept:
This is after research concept:
Here are the designs and redlines for new profile:
