WOMEN IN INFORMATION AND COMPUTER SCIENCES AT UCI
WICS Website Redesign
Redesigning an accessible, scalable digital home for UCI’s Women in Information and Computer Sciences at UCI.
ROLE
UI/UX Designer
TIMELINE
Dec 2025 - May 2026
TEAM
2 designers
4 developers
TOOLS
Figma
Project Context
WICS had outgrown its website.
WICS serves students through mentorship, outreach, conferences, committees, and community engagement. However, its digital presence had room to better reflect the welcoming community behind it all.
During our initial audit, we identified:
an existing accessibility score of 33/90
pages with large amounts of text
limited visibility for upcoming events and RSVP pathways
a homepage that felt visually blocky and difficult to navigate
opportunities to make WICS’s programs and personality more visible
Problem Statement
So we asked…
How might we make WICS’s growing organization of programs and resources easier to discover, access, and maintain?
RESEARCH
Understanding what WICS needed next.
Before designing, our team audited the existing experience to understand where the website could better support WICS's growing community.
Content-heavy
Information was difficult to scan.
Hard to navigate
Opportunities were difficult to discover.
33/90
Accessibility needed attention.
Who are we designing for?
Across audiences, the website needed to make WICS easier to understand, explore, and engage with.
Prospective Members
"What is WICS, and how can I get involved?"
What makes an opportunity easy to find?
We reviewed websites from similar organizations to understand how they handled navigation, content hierarchy, and calls to action, paying close attention to how quickly a first-time visitor could find something to get involved in.
A single consistent link pattern ("Found in our events") tied every opportunity back to one central resource
Clear separation between what's happening and why it matters, pairing each opportunity with a short line of context, not just a title
Clear intro cards explain why each project matters before showing it
Every project uses the same simple format: screenshot, name, one-line description
Design decisions
Verifying color contrast
With the existing site scoring 33/90 for accessibility, accessibility couldn’t be treated as a final polish pass.
We treated accessibility as a measurable design constraint, not an assumption.
We used the Contrast Figma plugin to check text and UI color combinations against WCAG contrast guidelines, iterating on colors that didn’t meet accessibility standards.
Designing for legibility
We evaluated typography options for readability and digital accessibility, considering typeface characteristics alongside size, spacing, and contrast before establishing our type system.
Atkinson Hyperlegible
Urbanist
“The Atkinson Hyperlegible font focuses on letterform distinction.”
— Braille Institute
“Urbanist's neutrality makes it a versatile display font for print and digital mediums.”
— Google Fonts
Final designs
Home
Key Takeaways
What WICS Website Redesign taught me.
Design thoughtfully
Working with developers pushed me to think about consistency, implementation, and maintainability earlier in my process.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Accessibility is a process
I learned to validate design choices as I made them, rather than relying on accessibility as a final checklist.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
Title
One line to describe the vibe.
thanks for stopping by~
© emma narvaez 2026