Noxit (Saas) - The company
Noxit is a company that offers a Software as a service product focused on enabling companies to succeed with their OKRs (Objectives and Key Results) seamlessly by bridging the gaps between individuals and teams. The product is designed to optimize their team’s collaboration and drive successful execution towards the company goals.
Lessons learned
This flow was created in a fast moving start up company. There isn't always time to think too hard on design decisions - sometimes you just have to create an MVP that can deliver the necessary value to the busniess so the business can keep growing.
With that in mind, I have some things I would have done differently:
- The menu of the board is hidden behind the three little dot icon and I would make it more visible to the users, so they don't have to go look for it.
- The modal window where the user can both add and remove users is not optimal when it comes to good UX. Next time I would solve this by having these features in separate modals or in a menu.
Step 2: Add Board
A modal window pops up with an option to choose to add the new board as a private board, before adding it.
We inform Deena that the board is only visible to her, the creator of the board and the users she chooses to add to the board.
Step 1: Choose template
The first thing Deena does is to click on the "Add" button, and then this view will show. For now we decided to put the private board as a dynamic board.
Deena clicks on "Add Template".
Noxit Case Study:
Add Private Board
Meet Deena
Deena is a CEO at a well known company and she uses OKR (Objectives and Key Results) as a goal setting method. She has tried different kinds of OKR solutions, but none as good as the one Noxit provides. It's easy, fun and effective!
As a Noxit user, she can add different kinds of boards, a dynamic board where she can cascade the company's goals to teams and employee levels, and an Action list board, where she and her colleagues can decide on which actions should be prioritized. These boards and goal cards are visible to everyone in the company, at all levels.
Now she really would need a private board, so that she could document and execute the performance reviews with her employees.
Step 3: Board menu
The private board is shown among the other boards, with an added lock to clarify that it's a board only visible to those who have access to it.
If Deena clicks on the three little dots, a smaller menu shows. She can rename the board, start a new cycle for the board, archive it, manage it and its users, export the board as files and delete the board.
Step 4: Add users to the board
When Deena wants to add users she write the names of the employees, as they are already in the system. They added users will get immediate access to the board.
Step 5: Add several users
Deena can add several users to the board at once, by clicking the + button in the centre of the modal window.
She can also decide to remove users from the board. This design with options to add and remove users in the same modal window was not an optimal solution, but due to time and budget restrictions, we needed to get this out quickly.
Step 6: The overview
When Deena has added members to it, they are visible to all the board members at the top right corner.
There is an "Add users to board" button next to it, so that Deena easily can add users to the board.
If there are more than three users, a number of how many and an addition sign show up. If the users click on it, they will get a list of all the members of this board.
Next step:
Performance review
Deena gave us some useful feedback, so we changed the flow so that the private board was visible next to the other boards we offered and we decided that the employee would be in charge of this board.
Now Deena could add a private board, but for the purpose of the Performance review, we decided to make that accessible to the employees.
Step 1: Add Board
We kept the design for the modal window for adding a new board, but removed the checkbox, since this specific template only could be a private board.
Step 2: Performance review
When Deena's employees has created a Performance review board, they add her to the board.
I added some bread crumbs to ease the navigation in the system.
I wanted to create an intuitive UI so the employee can fill out the form and it will automatically be saved.
Step 4: Meeting Notes
When Deena and her employee execute the performance review, they can add notes that they both easily can access afterwards.
Feature: OKRs and Actions
The OKRs and Actions are already in the product, so we decided to give Deena and her employee access ton the employee's personal OKRs and Actions so that they could discuss the current ones and add new ones during the performance review meeting.
Step 7: List of users
When Deena sees the list of the members of the board, she can easily click on them and remove them if they need to. Otherwise she can click on the x button in the top right corner.
