Loading...
Claudia Zayas

Front-end Developer

Webmaster

Freelancer

UX designer

Claudia Zayas
Claudia Zayas
Claudia Zayas
Claudia Zayas
Claudia Zayas

Front-end Developer

Webmaster

Freelancer

UX designer

Use Case: EDUHelpdesk — School IT Support Portal

  • Client: : NYC Department of Education
  • Role:: UX/UI Design, Frontend Development
  • Year:: 2025
  • Tools:: HTML5, CSS3, JS
See Demo
Sharing is caring! :)

Overview

EDUHelpdesk is a centralized, responsive portal built to streamline IT support and service requests for schools under the New York City Department of Education. The goal was to create a single, accessible entry point for staff and administrators to reach their school’s helpdesk quickly — reducing confusion and response delays.

Problem EDUHelpdesk comes to solve

Before EDUHelpdesk, schools relied on scattered communication methods — emails, phone calls, or spreadsheets — leading to slow response times and poor tracking of IT issues. The challenge was to design a simple, visually consistent, and inclusive web interface that aligns with DOE standards while improving user experience.

Solution EDUHelpdesk provides

I designed and developed a responsive, accessibility-first landing portal that connects users to their school’s IT helpdesk in just a few clicks. The page emphasizes clarity, visual hierarchy, and user trust, featuring DOE-aligned colors, typography, and branding.

Key Features

  • 🎨 Consistent Branding — Clean layout reflecting NYC DOE’s identity
  • ⚙️ Simple Navigation — Two clear call-to-action buttons for school selection
  • Accessibility Built In — Semantic HTML, ARIA roles, focus states, and color contrast compliance
  • 💫 Polished Animation — Subtle fade-in effects on page load for smoother visual flow
  • 🔍 SEO Ready — Complete metadata, Open Graph, and Twitter Card tags for visibility
  • 📱 Fully Responsive — Optimized for desktop, tablet, and mobile users

Technology Stack

  • Frontend: HTML5, CSS3 (Flexbox, variables, animations), Vanilla JavaScript
  • Accessibility: WCAG 2.1 standards, keyboard navigation, screen reader compatibility
  • Performance: Optimized assets, font preconnects, minimal scripts
  • Deployment: Configurable for DOE subdomains (e.g., 328.eduhelpdesk.com, 223.eduhelpdesk.com)

Results

  • ✅ Reduced support request friction — users reach the correct portal in two clicks
  • ✅ Achieved 100% accessibility compliance via Lighthouse tests
  • ✅ Consistent DOE branding across multiple schools
  • ✅ Scalable template for future NYC DOE use

My Role

UX/UI Designer · Frontend Developer · Accessibility & SEO Optimization

Takeaway

This project strengthened my focus on functional minimalism — designing with simplicity, performance, and inclusivity at the core. EDUHelpdesk demonstrates how thoughtful front-end development can improve real-world institutional workflows while maintaining brand integrity.

Screenshots

Screenshot of the EDUHelpdesk School IT Support Portal homepage showing NYC Department of Education branding, helpdesk buttons, and accessible layout.
The EDUHelpdesk web portal provides a centralized accessible and responsive interface for NYC public schools to manage IT support requests efficiently

Sharing is caring! :)