Online Education made easy!

South Carolina’s oldest and most prestigious insurance training school, Brewer Insurance Information Service is founded on a tradition of excellence that students have trusted for many years.

The Challenge

Design a site that makes it easier and intuitive for users to navigate the site and find what they need easier and faster.

Users have extreme difficulty navigating the current site, which leads to the client's team spending way too much time taking phone calls. It isn't easy to find the courses a user needs and what information they need to fulfill their obligations as either a current insurance agent or one trying to get a license. In addition to that, the client has had to contact our team time and time again to get things such as notifications set up.

My role

UX/UI Designer and Information Architect

My main task was to restructure this entire site and develop a plan that would make things much easier for users to get to what they wanted. This wasn't a task that I could do alone, so I had several in-person and zoom conversations with the client's team to understand their business. Through our conversations, I was able to formulate a plan.

In addition to structuring the site, I was in charge of creating wireframes, high def mockups, and prototypes. I also worked with our developers to ensure that designs were being faithfully recreated and give UX advice on the site's admin side.



To get a good handle of what I needed to do, I had many discussions with the client's team. I needed to understand the users' needs, and with this particular project, there wasn't just one type of user. Users were looking to get into the business, ensuring they knew what they needed to get licensed was crucial. Some users had been in the businesses for a while and didn't care too much about using the web to schedule their continuing education courses. We had to accommodate walk-ins.

I also perused the internet looking for successful online education websites. I analyzed what they did in common and took notes on where I thought they were successful and appropriated that into my designs.


After researching, I began working through structuring the website. It took a couple of versions, but we narrowed it down to the following design. Of course, things change throughout the process. We had to restructure the course flow even more. Sometimes, you don't get all the info you need all at once, and it trickles in through the process. You have to adapt, but it's much easier to adapt to the unexpected at this early stage.

Sitemap version 1

Updated course flow


One of my favorite steps in the process is wireframing. It can go by fast, but you can really start to see things coming to fruition. I like not worrying about images or colors but focusing completely on layout and getting that right. The following are a few of the wireframes presented. Of course, when presenting, I used Adobe XD's prototyping feature, so it gave the effect of an actual website.

Desktop wireframes

Sign Up Process and Login wireframes

Mobile wireframes

Style Tile

After approval of the wireframes, I began focusing on the aesthetic of the website. In this step, I worked through the color palette and some common components that would be used throughout the site. This was never the be-all-end-all, but it definitely helped the client see the direction I was taking.

Style tile

Hi-Def Mockups and Prototype

Fun time! Let's make a website. The style tile had been approved, and it was now time to implement the aesthetic across the layouts that I had created in the wireframes. Of course, nothing is paint-by-numbers, and a few things were changed or emphasized. A mixture of imagery, custom-designed iconography by yours truly, and third party illustrations were used to pull this whole thing together. The main goal was to create a compelling and engaging look and feel that would delight users.

You will notice there is an embedded prototype of the project. You can scroll through and click throughout the site to get an idea of what was presented.

Responsive Mockups

High-Def Mockups

Adobe XD Prototype

Closing Thoughts

This process has engendered a healthier and more trusting relationship with this client. We've partnered with them to create a site that works best for them and their targeted audience. I am proud of the strides we have made in this project and look forward to the positive impact this newly designed site will do for Brewer.


Information Architecture
Content Strategy
Wireframing and Prototyping
Visual Design
Responsive Design

Front-End Development
CMS Development
Checkout System
Event Scheduler
User Dashboard
Online Chat/Email System

Messaging, Voice, and Tone


Project Management
Johnnie Matthews
Dana Watkins

Front-End Development
Ryan Menner
Gary Mozingo

April Cassidy
Gary Mozingo

Gary Mozingo

Back-End Development
Jesse Maloney
Matt Breeden
Ryan Menner

Dana Watkins
Johnnie Matthews
Jesse Maloney
Ryan Menner
Gary Mozingo