Desktop Staffing App
Surveys | User Interviews | Personas | Breadboard | Userflow | Wireframing | User Testing | UI | Prototyping
My assignment was to design a staffing app for tech companies
Bitovi is a tech consulting firm that creates digital products for outside clients. The executives have historically used spreadsheets and time-consuming meetings to track the staff they have in different departments of the company so they can compare staffing needs vs. the number of clients the company has.
The intention of the desktop app I worked on was to save the executives' time. By creating an app, the executives could eliminate the multiple spreadsheets they had and reduce the number of meetings they had to discuss staffing issues.
The staffing app is being created for Bitovi but will eventually become available to other companies as an open-source app.
The core team consisted of myself, a project manager, and many developers who rotated on and off the project. My UX team lead was also closely involved, and I collaborated with another UX teammate to get her input on user testing.
The core team had twice-weekly standups. Everyone's tasks were tracked in Jira and our documentation was kept in Confluence.
During the discovery phase of my project, I sent out a survey to three executives at Bitovi. I set up an online survey and asked them to fill it out. The survey was sent in a simple Google Survey.
I followed the survey with interviews I conducted to get a better understanding of the problem.
My interviews were conducted as short, informal conversations.
I interviewed three executives at Bitovi.
I asked about what information they had in their spreadsheets and what they discussed in their staffing meetings.
I was most curious about each executive's goals from a staffing app.
I concluded that the three executive's goals had enough in common that the staffing app would meet all their needs.
Based on the interviews and surveys, I created three personas.
The personas gave me and the team an overview of the goals, needs, pain points, and interests of the three executives.
After creating personas, I made a journey map of each person I interviewed.
I created a breadboard for the pages I was designing to get an overall view of what would be on which page and how pages would connect.
Next, I made a user flow for the entire app. The flow covers all the pathways the user can take.
Next, I iterated on low-fidelity wireframes that had been handed off to me by a previous designer who had been on the project before I took it over. This was done in Figma.
A much-debated part of the project was the interactions for the main dashboard. There were three concepts for the dashboard: using overlays, using an accordion, or using a hover state.
I went through multiple rounds of testing via UserTesting.com. First I tested all three dashboard prototypes. After the hover state was eliminated, I ran another test comparing the accordion version to the dashboard version.
The tests concluded that the accordion would be the best interaction for the dashboard.
Next, I brought the interface further into high fidelity. The designs were created by downloading the Chakra UI kit and styling it. I collaborated with my lead UX designer on this.
I created a handoff document in Confluence for the developers. It included the annotations for each page in the wireframes.
Finally, I created a clickable prototype to show the developers how the app would work.
The project is currently being developed and should be up and running soon. The long-term plan is to turn it into an open-source app that other companies will be able to use.
This project was a huge leap forward for me. I participated in requirements gathering more than I had in previous projects. I was able to go beyond wireframes and create UI. Plus I was able to work in UserTesting.com to test my own prototype.
Overall, getting to live through the entire UX process from start to finish was a great experience.