The navigation really highlights the complexities of the new architecture. The app's sitemap grew threefold. The navigation update included: 1) separating the utilities from the navigation categories, 2) creating a secondary side nav to accommodate an infinite number of navigational tiers within an audit, a framework, and the new evidence library (which I also designed), 3) redesigning the header to emphasize the product name and equipping it to handle a new partner experience, 4) creating a secondary header for program experiences so that users can switch between what program they’re viewing while remaining in the experience they were currently in, and 5) updating the UI with line icons.

Originally, the homepage was a list of a user's current audits. When creating their new architecture, Shujinko introduced the concept of programs into AuditX. This was a feature requested from auditors, potential enterprise clients, and startups that had more advanced knowledge of audits.

Given the fact that each program has a framework assigned to it and houses many audits, it was only a natural progression that Programs would become the new home base for users. The new dashboard needed to include the most pertinent information about the audits and framework that was included in the selected program, while still being easy to use. 

After conducting user interviews with both companies and auditing firms, we found that they were requesting more helpful information in the audit overview so they could get a better picture of their audit's progress. We found overlapping interests in several data points from those interviews and used that information in the audit overview page. Adding team activity and notifications was planned as a fast follow in build.

This overview also serves as an example of how I updated the color palette in the app. At the time I joined, the brand colors and app colors were not aligned. I reworked the brand guidelines, which included the color palette. I then applied those colors in a more meaningful way to provide clarity. It proved especially helpful in the dashboard and overview pages. 

Something that was lacking in the current product was any sense of user direction/guidance within the app. Meeting with a customer success rep was essential for each AuditX customer to understand how to use the product. Something that the new app design includes is onboarding and guidance from the app itself, ensuring better success and a better impression for first time users. 

I created onboarding flows using the same UI pattern for adding a new program, audit, scope, and integration. I also created an onboarding flow for frameworks that leads straight into a framework builder tool I designed.

These are some select components that made it into the design system I created in Figma. You'll also notice some anatomy and explanatory image below. These were not included in the design system, but were made for developers and other internal team members to reference.

I created an illustrative language for Shujinko's brand. Those illustrations made their way into AuditX's empty state pages, as well as marketing materials (graphics, website, ebooks, whitepapers, pitch decks, etc).

I also collaborated with leadership to expand their brand guidelines. I refined their color palette and defined illustration and icon styles. Two versions of brand guidelines were made: one was external-facing that could be handed to agencies and another that was internal, where the company strategy and brand wheel was included. I also created a design system in figma specifically for product work.

Along with working on Shujinko's branding, I updated their marketing website to fit their business pivot, as well as designed the graphics for and laid out whitepapers, ebooks, and printable materials.