Designer, wears a lot of hats (metaphorically & literally)
Infinite Campus is a Minnesota-based School Information System (SIS) provider with millions of customers. Infinite Campus came to Bust Out wanting a completely new design direction, and we delivered.
The Infinite Campus site is primarily for prospective customers, but is also a place for parents to learn about the software and log into their district. We spent a lot of time talking with different departments within Infinite Campus to learn about what they wanted out of a new site as well as any pain points that we needed to improve.
One of the challenges of working on this site was dealing with extremely high traffic. Every school year, millions of people visit the Infinite Campus site and the vast majority were parents just trying to find the login process.
On the old site the login flow for parents was slow and complicated. We spent some time reworking that experience to be much more streamlined — dramatically speeding up the login process for millions of people.
Beyond the login process, most of the design and UX focus was on creating a flexible and expressive design system. We worked closely with the marketing team to figure out all the different pieces they might need to build out anything they wanted content wise. The site was built with the headless CMS Storyblock, so the design system was built to be as modular as possible.
👤 Roles
Strategy, UX, Design
📆 Timeline
4 months
🛠️ Tools & Technologies
Figma, Storyblock (Headless CMS)
The project started with a a series of complex wireframes, laying out the different pages they needed. One big focus was on addressing a major pain point: directing most of their traffic to the district login search feature. At this stage we also started to plan out the different components that would make up the design system. There were a lot of pages to build, and dozens of different blocks to make that possible.
Infinite Campus came to us with a high level brand direction but not much else. Our challenge was to help them define and grow what it looked like going forward. We decided to show them two different directions to see how the brand could evolve — stick with a minimalist approach, or expand it into a softer direction.
The first direction was exactly what they asked for — only using the green that came with and keeping everything minimalist and simple.
The second direction and extended their brand try softening their image a little bit. We introduced several more colors and reworked the typography to make it more friendly.
After deciding to keep it minimalist, I got to work building out the design system. The Infinite Campus site had a lot of content and a lot of complex design needs – so having a flexible system was critical. Many of the components were built with multiple variants so that the Campus team could swap out pieces to build the best pages possible. The District Search also got a huge upgrade to make the login process much easier for parents to use.
IllustrationsSeveral spots throughout the site called for custom illustrations – this phone was rendered in Blender to be animated floating in place.
Component LibraryThe Infinite Campus team came to us with a logo and the neon green. From those pieces I built an entire design system for handling content need they could come up with.
Animation