Context

The City of San Juan, Texas relied on an outdated website that served as the primary digital hub for residents to:

Pay bills
Apply for permits
Find Civic Government jobs
Report civic issues
View public agendas and meeting notes
Stay updated on events and news
Feel a sense of pride and belonging to a city that cared for it's residents

the legacy website no longer matched modern expectations for government digital experiences.

My Role

Project Manager/WebMaster

UX Designer

Webflow Developer

Cross-Collaborators

City Leadership (Mayor, CTO, Department Directors)

Media Specialists

Cyber Security Admins

Problem

As the city expanded services and aimed to feel more approachable with a civic brand slogan "The Friendly City", the legacy website no longer matched modern expectations for government digital experiences.

Legacy Site Issues

Outdated, unstructured navigation; visual inconsistencies; mobile friction; difficult to maintain; cybersecurity risks from self-hosting (DDoS crashes).

‍

Core User Needs

Significant friction for the primary hub for residents to make payments, download and submit forms, and discover information.

‍

Branding Alignment

Minimal attention to appearances and missed branding opportunities.

‍

The Digital Troubles

The legacy site was suffering from a lack of structure which led to a disorienting navigation, and visual inconsistencies.

This led to unnecessary friction for residents needing quick access to essentials like utility payments, court fines, permits, job openings, or event info, especially on mobile.

Maintenance was a challenge as well, global style settings were untidy and caused for inconsistency in spacing, color and typography.

To top it off, due to poor foundation via self-hosting, the site would crash due to DDoS attacks, a major risk for cybersecurity.

Epiphany

Through my research I found Government websites succeed when they prioritized "task completion speed" over everything else.

Analyzed Google Analytics events

GA4 events showed that residents visit to accomplish 3 specific actions:

Pay Bills
Find/Submit a Form or Permit
Access Official Agendas or Minutes

Being Accessible and Easy to Navigate would help with our SEO.

More importantly, it would signal trustworthiness.

‍

Our Legacy site did not consistently follow design principles making navigating the site a challenging experience for users.

This site needed a Design System

Action

Create Effective Information Architecture

Restructured the homepage into clear, scannable sections. Consolidated repetitive links, added dedicated sections that followed department-specific logic, and ensured consistent UX Copywriting language.

Established a Cohesive Visual Language

introduced a consistent visual language with consistent typography, iconography

Enhanced Interactivity

Developed a prominent Site-Wide Search bar, created direct paths to essential resident functions (Payments, Agendas, Alerts, Reporting, etc.) and event dating for better visibility.

Prioritizing Searchability and Frequented Pages

Mobile-First

Provided a clean hierarchy and effective spacing to make a fast Task Completion Speed easy to attain.

Result

The updated site feels welcoming and professional.

Residents can now quickly find and complete high-frequency tasks without scrolling through clutter.

Key improvements include:

Faster access to payments and court services. Avg speed increase of 47s to task completion.
Clearer department overviews to connect with relevant administrations. 90% drop in fielding explanatory calls.
Engaging event promotion pages that made it easy to share on social media feeds. 500x Increase in Government sponsored event attendance.
Stronger transparency of official city business. 4x Attendance in civic participation.
Reduced support calls and Public Information Requests. 70% decrease in Public Information Requests

Overall, it positions the city as more professional, responsive and "friendly" to align with our city brand.

Government UX

Big Impact

AA

~70%