USDA Food Safety & Inspection Services Brand & Website Redesign
United States Department of Agriculture, Food Safety and Inspection Services
-
Role
Lead UI Designer
Brand Designer -
Team
Project Manager
Product Owner
Lead UX Researcher
Lead Engineer
2-3 Rotating Engineer -
Timeline
1 year
(Oct 2019 - Oct 2020) -
Tools
InVision
Drupal
Sketch
Miro -
Skills
Stakholder Engagement
Design Systems
UX Workshops
Prototyping -
Key Results
Brand Overhaul
Web & Accessibility Standards Updated
Updated to United States Web Design System
-
Background
United States Department of Agriculture - Food and Safety Inspection Service (FSIS) is a sub-agency of USDA that handles the food safety requirements and information for meat, poultry, pork and egg products for the American public. Their main priority and brand messaging is to assure the public that food safety is top priority.
-
The Challenge
USDA Food Safety and Inspection Service failed to meet federal accessibility guidelines, lacked responsive and intuitive design and was missing cohesive branding throughout the site. Users found the site hard to navigate, especially for those needing to access imperative information on job sites through various devices.
-
Understanding the Problem
Our team proposed solutions through user testing, research, strategic design ideation, a centralized design system and fleshed out branding and visual language.
-
End Result
The result was a complete update of the website using an atomic design approach to use a design system to globalize design elements while minimizing technical debt. The site is now using best practice standards such as accessibility requirements, contrast compliance, 21st Century IDEA properties, United States Web Design System elements and mobile-first design structure.
-
Research
In order to properly prep for the redesign overhaul, it was imperative to speak to the right people and do our due diligence with the USDA team, its stakeholders and top user pool and audiences. From there we were able to gather critical feedback of what the internal team needed, connect to other sub-agencies, connect with key stakeholders on feedback of our research and discovery and provide a great direction to move forward with the site.
-
Design Audit
Through the design audit, I compiled all current pages, templates, components and any design elements currently used on the site. I did an analysis of other sub-agency sites under USDA to see how FSIS would be fitting amongst the family brand. Research based on competitors and relative agencies for design inspiration were also gathered, evaluated and discussed with the client for feedback and direction.
User Personas
Next, the team was able to sit down with users and the client to gain feedback on the current site and generate potential user pools from this data. We were able to create three main user personas according to this data.
-
Ideating Structure
Through ideation leveraging the design process, we were able to maximize idea generation. We were able to go wide with our ideas and provide innovative solutions of the foundation of the website in order to start prototyping from there.
-
Building Wireflows
We explored the current setup of the site and iterated different, potential flows through exercises such as: card sorting, user flows, and IA structure setup.
-
Wireframing
We explored the current setup of the site and iterated different, potential flows through exercises such as: card sorting, user flows, and IA structure setup.
-
Branding & Visual Language
For branding, it was important to keep a balance between FSIS having its own, unique brand, while following USDA branding standards and requirements. Through many conversations and Style Tile Design exercises, we were able to fine-tune the design down to a single, cohesive visual language.
-
Design Systems
Our team proposed solutions through user testing, research, strategic design ideation, a centralized design system and fleshed out branding and visual language.
