SSOLoginPageMockup-ShortTerm_NewPattern.jpg

Custom Groups

Custom Groups

Responsibilities:

Mockups & interactive prototypes; unmoderated & moderated usability testing (all remote); delegating some work to our junior-level designer; presenting to internal teams for feedback; working with developers on final styles; etc.

Timeline:

Mid-2021 to early 2022

Other Contributors:

Neil Estacio (early mockups before I joined GG); Marissa Manalo (assisted with the Quick Policy Creation feature, not shown here)


Custom Groups was my first large project as the Lead UX Designer for GoGuardian’s Admin product (GGA.) GGA is a filtering & monitoring tool that is often used by IT Administrators at the district level. Typically, an admin can only filter students by Organizational Unit (OU). These are used differently by each account, but a common use case would be one OU per school site or grade level. Custom Groups allows an Admin to adjust filters for smaller groups of students without creating a whole new OU for them. It’s a fairly complex feature, so I’m going to keep this write-up focused more on the process than on the feature, but please feel free to reach out to me if you’re reading this and you’d like to chat about any of it in more detail!

When I joined the GGA team, this project had just been kicked off. Initial user research and requirements gathering had been completed by our Product Manager, and we had a set of features that seemed to fit the needs we were hearing. My manager, Neil, had done some early mockups to aid in conversations. Using that as a starting point, I began working on an updated set of static mockups. These were mostly pretty simple, as we could use UI patterns that already existed in other parts of GGA. After gathering some initial user feedback on informal interview calls, I converted the static mocks into interactive prototypes in Figma. The one section that needed a bit more iteration and experimentation after those first calls was the workflow of creating a custom group. The updates went through a few rounds of internal feedback and unmoderated usability testing before ending up in the final version. 

One of my favorite parts of this project was working very closely with our Customer Success Managers. We got feedback from them every step of the way, and even made one large pivot based on the needs of the accounts that they managed. It was a big enough change to put us behind on schedule slightly, but I advocated for it. In the end, we did make the change, and heard great things from our users about it.

The thing I am absolutely most proud of is seeing the real-life use cases after the feature launched. Throughout the entire process, we used the example of a high school robotics team - saying maybe there was a team that needed access to YouTube to upload footage of their robot for a competition, where normally the district wouldn’t allow YouTube as it could cause too much distraction. Though this was a fictional example, one of the group names that came up in the very first data pull we did one week after launch was “217 - Robotics Team 2022-23.” Even more exciting, there were two different groups specifically named in a way that indicated usage for students who spoke english as a second language (“Allow Google Translate” and “ABCYa (for MS ELL”)). Our team went into this not knowing that some students had found a workaround to use Google Translate as a proxy, and were using it to access sites that would normally be blocked. Having a custom group titled “Allow Google Translate” implies that the Admins are placing students into that group who may need it to understand, and may have been missing out previously on crucial context. Supporting the diverse needs of students is incredibly important to me, and honestly, seeing those group names may have just been the proudest moment of my career so far.

Custom Groups launched at the end of August, 2022. Though there are pieces we plan to go back and iterate on, overall the feature has been a great success and met its goal of allowing for more granularity and flexibility in GGA’s filtering abilities.

Customer feedback after launch:

"We appreciate having more opportunities to provide more flexibility and customization to schools' needs. The Auto-remove feature is absolutely amazing!!! The little details that you have included really improved the functionality, even things like the ability to have a description to describe the Custom Group. This, combined with color coding the policies (which are attached to a group) help with organizing the information. The process of migrating from Penalty Box to Custom Groups was so easy! I believe that most schools will appreciate how easy the upgrade will be!"

“I am a District tech at [district name removed for privacy.] I Have been playing around with Custom Groups "New Penalty box" and think it is an amazing upgrade!! I have already pulled apart Policies, and groups for each school, and played around with transferring ownership, and adding people to help monitor and add students! LOVE IT!!!!!!! ( I can not put enough exclamation marks for you to understand my excitement, and love of this feature.)”

“I am so excited that the changes to the penalty box have finally been implemented! I supported this idea almost 3 years ago, and I audibly shouted “Yes!” today when I upgraded and saw that I can apply existing polices to a group of students without needing to change their OU. THis will give so much more flexibility in the ability to give students the appropriate amount of freedom while limiting those who need some extra help. I am excited to get this configured.”

A screenshot of a presentation showcasing the need for this feature

An activity that we performed remotely with users & internal stakeholders to help determine permission structures

Original mockup for adding a user, when we required them to select one Organizational Unit for the group

Live version of adding a user - we pivoted from restricting a group to one OU to allowing cross-OU groups

One of the multiple versions of the group creation flow that we experimented with

Live version of creating a group

An update to the student details page that shows if they are in a group, and shows group details on hover

Feedback from our unmoderated usability test, done using Maze