Grovo is a B2B SaaS company that provides a learning platform to improve employee and organizational performance. The product is two-fold. For employees, it’s an engaging experience that allows individuals to build their skills at work through micro-learning. For our clients and admins, the ability to create content tailored to their companies needs, assign out training and then track the progress of their employees is easy and straightforward.
Starting in Q1 of 2016, the product and engineering teams began working on the next version of the product. This meant a complete redesign, juggling new features with reaching parity with our existing product and an entirely new code base. On the product side, I played a lead role in the redesign, which was released in August 2017. All the projects shared on my portfolio are from this redesign.
My role: Lead on UX and Product Design
One area of the product that the team continued to struggle with was the navigation of our website. It went through a couple other iterations in the past but then my boss (VP of Product) asked me to lead another redesign, with the two other product designers on the team.
How we approached the project:
- The first thing I had the team do was competitive research, specifically try to find other examples of B2B enterprise products that had both a user-facing and admin-facing navigation to identify standards or patterns.
- Next we identified the pain points, which were mainly:
- For admins, in particular, it wasn’t easy to navigate back and forth between different pages. Also, it was difficult to get a sense of where you were in the product.
- Visually, the design was felt outdated and didn’t match with the new look we had in other areas of the product that we’d been working on.
- After brainstorming as a team, I took the lead on creating and iterating on designs.
The old design
This is a mockup of what the old navigation looked like. As time went on and we added more functionality, we continued to also add more top level links with drop downs.
Final redesign (and what implemented in the product)
To validate the designs, I interviewed and user tested several members of our Client Services and Sales team. The feedback we received made it clear that this approach was the right one:
- Part 1 of the solution: Learners get a top nav while Admins get both a top and left nav
- People really liked this approach because this made it clear to clients as to which “mode” they are in (admin or learner only).
- Most also felt that this look was much more modern and sleek.
- Part 2 of the solution: Remove drop downs and instead use a left nav with expandable sections
- The reaction to this was extremely positive. The CS/Sales team told us that clients would love this approach because they can now see very easily all the pages in the site (that they have access to) and quickly jump back and forth. As one person put it, they liked “being able to see the world”.
- Part 3 of the solution: We originally didn’t have this in scope but with the left navigation style and looking back at the research we had done, it felt really natural to let the left nav collapse so admins would have more real estate on the right side.