Beaconforce
Converting Web Experience to Mobile App (iOS)
Background
Beaconforce is a people management platform that provides real-time insights on employees’ level of engagement. Employees answer 2 questions a day, and managers are then provided with data on their team members’ motivation and state of mind.
This data is presented in 3 charts:
Problem
Multiple elements from the desktop site were missing from the mobile app. Managers should be able to view their own data as well as their team’s data. But in the app currently, managers are only able to view their own data.
Our challenge was to convert the full web experience to the mobile app and improve the presentation of data to make it more intuitive.
Methods
Competitive Analysis, Interviews, Hand Sketching, Wireframing, Prototyping, Usability Testing
Role
UX Designer
The team also consisted of 1 other UX Designer.
Understanding the Company and Competitors
We first familiarized ourselves with the company and its competitors by performing a competitive analysis. This helped us understand what features competitors offered and how Beaconforce compared.
Through the competitive analysis, we realized Beaconforce was lacking some features that were offered by competitors. While Beaconforce had a mobile app as well as real-time feedback, it didn’t have recommendations, a warning system, or employee recognition.
Uncovering Pain Points
Next, in order to uncover the pain points and frustrations of managers using Beaconforce, we needed to perform interviews.
Through interviews, we wanted to learn:
• How managers use Beaconforce
• How managers manage their team
• How managers monitor their team’s engagement and challenges they face
However, current users of Beaconforce were in Italy and it was difficult to find those who could speak English. Due to the time constraints, we worked around this by interviewing with managers in the US first.
While we were unable to have face to face interviews with managers currently using the app, we were able to receive answers to our questions via e-mail.
Guiding Our Design
Based on what we learned from our research, we created a primary persona to help guide our design decisions. Our primary persona is Cassie, who wants to be a mentor to her employees and help them grow.
While managers do care about their team, it isn’t always easy for them to tell whether their employees feel engaged or not. Beaconforce provides data about employee engagement for managers, but it doesn't alert managers when their employees' level of engagement is dropping.
Therefore, the following themes guided our design. How might we:
• Help managers more effectively manage their team’s engagement?
• Help managers be more informed about their team’s engagement?
• Help managers be a better manager?
Viewing Team Data
One feature that was missing from the mobile app was the ability for managers to view their team’s data.
From our research, we learned that managers would typically:
1) Go through each of their team’s data one by one or
2) Search for a specific employee, such as prior to a 1-on-1 meeting or if they noticed changes in an employee’s engagement.
Since managers have different needs, we wanted to accommodate this by allowing them to search for a specific employee or view by team.
Improving Data Presentation
One of our biggest challenges was figuring out how to better present the "Flow" chart. The chart shows whether an employee's challenges at work match their skill level. Since the mobile app currently only shows that person's own "Flow" chart, we had to determine how to show data for a manager's teams.
Issues:
1) Colors
Usage of the various colors seems arbitrary and needs to be explained before users understand what each color represents.
Purple/red area: Stressed (challenge > skill)
Yellow area: In the flow (challenge = skill)
Green/blue area: Bored (challenge < skill)
2) Date
Each "bubble" represents the data for a particular day. Orange represents the current day while white represents previous days. However, it is difficult to tell which day each bubble represents until you tap on it.
Our redesign:
To show data for all members of a manager's team, we used a horizontal bar graph which indicates the number of employees in each zone. Managers can then tap on a bar to view a list of employees in that zone. Finally, if they want more details about a specific employee, they can tap on the employee name to further drill into that employee’s data.
Currently, depending on which chart you are viewing, the default view is set to either:
• Current day (for “Pillars” and “Flow”) or
• 2 months (for “Trust”)
In order to allow managers to view trends and changes over time, we added the ability to view by year, month, week, or day. Being able to view trends easily can help them determine if any action needs to be taken.
Keeping Managers Updated
For managers, it is essential that their employees answer their 2 questions a day since this feeds into the charts regarding their engagement level.
As a result, we proposed having the app automatically land at the “Questions” screen if employees haven’t answered their questions for the day. This not only makes it easier for the employees but hopefully also encourages them to take action and answer it.
If they have already answered their questions for the day, the app would open to the “Dashboard” screen since that is what users would be most interested in viewing.
Currently, managers determine whether they need to dig deeper into issues regarding their team's engagement levels manually. They do this by going through each of their team's data then viewing each individual employee. To make it easier for managers to stay updated on their employees' engagement, we added an "Activity" section that include "Recent Activity" and “Take Action” sections.
Recent Activity
The Recent Activity section consists of status updates about their teams and employees. With these notifications, managers can easily track issues and whether certain team members are too stressed or bored.
Take Action
This provides guidance to managers by recommending certain actions to help improve employee engagement. It can include links to articles related to managing or recommendations like organizing a social event or showing recognition to their team.
Results and Reflections
One of the toughest parts of this project was figuring out to better present the “Flow” chart, which was also where we spent the most time. My teammate and I researched different ways to present data before finally deciding on a bar chart, which also kept it consistent with the “Pillars” chart.
One issue that would need to be worked on in future iterations is scalability. Namely, it will get overwhelming if a manager has many team members. If we had more time, I would also like to explore more different variations of the “Flow” chart.
Client Testimonial
Our product team had the pleasure of working with Jessica for a UX project to convert a web (desktop) application to an iOS app. Her research and attention to detail were above expectations. Not only was she able to bring our users’ voice forward, and addressed their needs in the features they recommended, she also closely worked with our product manager and ensured that her solutions helped achieve the business objectives we’ve defined. What I personally appreciated the most was the honest feedback and assessment on how our product was perceived in the market, compared with our competitors.
A++ for Jessica When can we work together again?
- Anna Supnet, Co-Founder and Director of Product at Beaconforce