Case study

Center for Work
and Democracy

UI / UX ∙ Web Development

Toolkit
Drupal ∙ Miro

Timeline
Oct 2022 – Feb 2023

A hub of research and impact

The Center for Work and Democracy was founded in 2019 to connect university knowledge production to the challenges facing working people in our increasingly unequal and exclusionary society.  Center members conduct research with organizations whose missions are to increase the voice and power of the working class in order to support greater social change.

Leading the project in design and development, I helped give the Center an online presence that showcases their work and informs users of events.

Free_MacBook_Pro_1-1

Built from the ground up

Prior to the completion of this project, the Center for Work and Democracy owned only a single page under a larger center's website. 

With their team and research growing to an impressive size, they needed help organizing their content into an easily digestible and interesting site.

Key objectives

1
Transform all the Center's content into an intuitive organized hub of information

2
Keep the structure as simple as possible, eliminate unnecessary submenus

3
Create a bold, innovative, visually interesting online presence 

A clear sitemap

The center had a lot of information that needed to be organized into a cohesive structure. I worked with the director and research assistant to finalize a sitemap that met their needs for a simplified yet intuitive navigation.

maps-05

Know the users

As a growing research center, this site would attract those who are committed to learning and participating in the center's mission. I developed two user personas and defined their entry points to the website, mapping out the key aspects of their journey and anticipating their actions.

maps2-06

Refine, refine, refine

I communicated the user journeys and navigation with our stakeholders. They know their content and mission better than I do, so it was important to frequently check in with them and walk through my thinking for the user experience.

We also conducted user testing by allowing center affiliates to navigate the early prototypes of the website, gathering their feedback and answering their questions through design refinements.

Intuitive pages

After continuous testing and refining with site structure, I built the webpages in ASU's drupal page builder and developed custom HTML/CSS solutions as needed to meet our stakeholder's design needs. Buttons, breadcrumbs, and links were placed in key areas to help users navigate the site seamlessly.

mockups-07
mockups-08-1

Outside the box

A bold and modern design style was chosen to reflect the innovation and impact done by the center. 

I created a styleguide and block templates that fulfilled this style while still fitting within the university's branding, developing custom HTML/CSS solutions as needed.

What's next?

A2BUI / UX

DayglowInterface Design / Web Development

GreenHouseInterface Design

Poster in MotionAnimation

PSAidAnimation

BigelowPrint Design

© 2024 Alyssa Herrera    [email protected]