Andrew

Verité Supply Chain Traceability Matrix

Website Design

SCOPE OF WORK

- Website


ROLE

- Web design, UI/UX design


DATE

- 2022


WEBSITE

traceabilitymatrix.org



Committed to ensuring safe, fair, and legal working conditions for individuals worldwide, Verité began, and continues to lead, an initiative called the Supply Chain Tracing and Engagement Methodologies (STREAMS) Project. As part of that initiative, The Verité Supply Chain Traceability Matrix was created to help governments and civil society advocates design feasible traceability systems that can provide the information needed to support human and labor rights efforts in the context of diverse global supply chains. The website needed to serve two purposes:


1. Provide traceability approaches that help combat forced labor

2. Identify relevant labor risks within specific supply chains that need increased transparency


As part of the Gravity Switch agency, my responsibility was to distill large amounts of information and long-form narrative content into an engaging, accessible, user-friendly experience that allows for site visitors to easily find and read through resources applicable to their supply chains. I used the following techniques and solutions to meet the site’s goals:


Build a simple, streamlined navigation that allows site visitors to easily research information relevant to their needs

Reduce the barrier to accessing information through a prominent search component in both the site navigation and faceted filter pages

Leverage accordion and tab panel components to reduce clutter and present blocks of data in a parseable manner 

Integrate visual graphics, such as linear pathways and icons, that reinforced and illustrated concepts being presented

Create a summary component highlighting a section’s key points to make long-form content easily scannable

Design a table of contents component to allow long-form content to be easily navigable

Homepage on desktop

Verité Supply Chain Traceability Matrix

Homepage on mobile (left); Navigation menu on mobile (right);

Verité Supply Chain Traceability Matrix


Homepage on tablet

Verité Supply Chain Traceability Matrix

Supply Chains Typology list on desktop (left); profiled product from the list on desktop (right);

Verité Supply Chain Traceability Matrix

Profiled product from the Supply Chains Typology list, displaying a tab panel component on mobile

Verité Supply Chain Traceability Matrix

Summary and highlight components for a profiled product on tablet (left) and desktop (right)

Verité Supply Chain Traceability Matrix


Traceability Technology list on desktop (left); profiled technology modal from the list on desktop (right);

Verité Supply Chain Traceability Matrix

Profiled technology modal from the list on tablet (left) and mobile (right)

Verité Supply Chain Traceability Matrix

Traceability Technology list on mobile

Verité Supply Chain Traceability Matrix


About page on destkop

Verité Supply Chain Traceability Matrix


Table component on mobile

Verité Supply Chain Traceability Matrix

Table component on desktop

Verité Supply Chain Traceability Matrix

Traceability Method Typology on desktop (left); profiled method on desktop (right);

Verité Supply Chain Traceability Matrix


Profiled method on tablet (back); table of contents on tablet (front);

Verité Supply Chain Traceability Matrix

Traceability Method Typology on mobile

Verité Supply Chain Traceability Matrix