Nestle Sales Application
Redesigned the sales representative's application to resolve product issues faster, and using 62% fewer screens.
Tools Used
User Research
Initial user research was done by interviewing current sales representatives and their managers to get an overall view of where the application needs improvement and where it works well. After doing interviews, more research was done on what the experience is actually like during their work in-store. Due to Covid, only the design lead was able to follow a sales representative in the store.
Insights
-
Internet connections were poor, an offline mode was needed
-
Add a visual indicator showing which opportunities have been completed
-
Add indicator for required opportunities, and how many per store and department
-
Reduce number of screens needed to complete an opportunity in store
-
Be able to provide information to department managers
-
Reduce the amount of unique applications used in stores
Image of sales rep trying to manage the multiple devices needed to do his work on the old application.
User Persona
I created the user persona below based off the ideal solution from all of the information we received during the meetings with individual sales representatives and managers.
Low Fidelity Designs for Custom App
Based on the feedback gathered from the interviews we a set of features that would be beneficial for the sales reps. I took those ideas and make quick mock-ups to present back to the sales reps in order to make sure I was going in the right direction and these changes were improving their experience. I started off building the "home" page where the rep would select which store they are going into.
Features
1
2
3
4
5
Store Selection/Progress: Rep can choose which store to go to based off progress in that store which is shown by the green bar indicator.
Notes: To reduce the number of apps used I added in a built-in note taking feature. This allows reps to note when a manager was gone, or something they need to come back to later. These can be tagged to specific stores or departments.
KPI's At-a-Glance: Performance metrics are very important to sales reps, and while they have a dedicated dashboard, I wanted to show some key metrics on the home page. This allows the rep to quickly see how they are performing when in the field.
Department/Sub-Department Selection: This feature was completely new to the reps. For the first time they could actually select the department they want to visit and the sub-departments that have opportunities.
Drag-n-Drop: I learned reps tend to go around the store in a single direction, so I designed a way they could rearrange the order of the departments to match the layout of each particular store.
Refining Homepage - Pivot to PowerApps
After confirming the direction of the designs with the users I had built out the entire flow of the application. However, I felt that the homepage, one of the most complex and often used pages, was not quite meeting the needs of the users. I had trouble finding what the users actually wanted, as they kept thinking in regards to how the old app was. They didn't know what was possible and provided me with vary vague answers that I had to work around and come up with a creative solution. So I took some time and came up with different variations of the homepage.
Layout on selecting one day at a time and seeing the stores scheduled for that day in their routing order.
Layout showing all days of the week at the same time with a horizontal scrolling list of stores. User could swipe though the horizontal list and select a store for the current day.
Design based on typical calendar-like apps. Current day is highlighted and enlarged, but other days work is still visible.
Consolidated view showing all stores for all days in once glance. Easy to drag-n-drop stores to other days of the week.
Final Design
After the platform to build the application was finally confirmed, I was able to then create my final designs based off the possible limitations of Power Apps. Without having the total freedom and feature available for a custom app, I had to prune off certain features for the initial release of the app and prioritized what was a priority for the users.
Store Selection - Homepage
Department Selection
Opportunity Selection
Product Details
Flow Diagram
All Opportunity Page: Designed for small stores in mind, the all opportunity page allows a rep to quickly see all the opportunities in a store. This is especially useful when there are only a handful of opportunities scattered across many departments.
Feedback: Each opportunity has a feedback the sales rep must finish. Since this is the last step in the process, I made the app take the user back to the opportunity selection page so they can quickly start the next opportunity.
Power Apps Style Guide
Completed Opportunity
Feedback Survey
Increased Efficiency
62%
Reduction in Screens
By using my new screen flow in the app I was able to reduce the amount of screens needed by 62%. This greatly decreased the time needed to do each opportunity and provided more time in store to address more opportunities which increases revenue.
New App Screens for Completing 2 Opportunities
** Red line indicates finishing one opportunity and starting the second
Old App Screens for Completing 2 Opportunities
Lessons Learned
Be Flexible
I had to change my designs many times during this project to align with the final tool being used to build the app. Initially the custom app gave me a lot of freedom, but changing to Power Apps changed how I had to prioritize and design the app.
Ask Users
While I had gotten a lot of insights from users during the initial user interviews, there was a lot that came up during the design process that I needed to ask them about. This consistent communication allowed me to ensure all designs and features would actually help in stores.
Prioritize
In many cases there are multiple ways you can improve an application, but when using a tool with limited features, it can get difficult to remove features. I had to learn what to prioritize and what was the most important from the user's point of view. I also had to take into consideration the development time versus the end return.