Front-end UI designer
Fully Remote
Description

The Front-End UI/UX Designer is a specialized user interface designer and frontend developer responsible for designing, prototyping, and implementing intuitive, user-centric, and accessible web interfaces across the National Water Prediction Service (NWPS) platform. This position bridges scientific hydrologic modeling outputs (river observations, RFC forecasts, National Water Model guidance, Flood Inundation Mapping, and NOAA Atlas 15 precipitation frequency estimates) with modern, high-performance web and mobile user experiences.


Operating within the NWS Enterprise Cloud (NEC) Amazon Web Services (AWS) environment and collaborating with specialized geospatial UI/UX partners, the Front-End UI/UX Designer translates complex scientific requirements, Figma wireframes, and stakeholder feedback into responsive, touch-centric web components. The role prioritizes streamlining information discoverability, optimizing interactive map and hydrograph displays, enforcing strict WCAG 2.1 AA and Section 508 accessibility compliance, and maintaining cohesive design systems across desktop, tablet, and mobile platforms.



Requirements

• UI/UX Design & Figma Prototyping: Create high-fidelity wireframes, interactive UI prototypes, user flow diagrams, and design specifications in Figma for new NWPS features, including NOAA Atlas 15 interactive charts, Flood Inundation Mapping (FIM) dual-tier public/power-user views, and Western Water Supply dashboards.

• Responsive Mobile & Tablet Optimization: Design and implement touch-friendly, adaptive layouts specifically optimized for mobile phones and tablets, ensuring complex map layers, data tables, and time-series hydrographs remain legible and performant on smaller viewports.

• Geospatial & Hydrograph UI Building: Construct dynamic frontend UI components, map control panels (layer toggles, opacity sliders, boundary filters), and interactive chart widgets using HTML5, CSS3/Tailwind, JavaScript/TypeScript, and modern web mapping libraries (MapLibre, OpenLayers, or Esri ArcGIS API for JavaScript).

• Section 508 & WCAG 2.1 AA Compliance: Ensure all designed and developed frontend components strictly comply with federal Section 508 and WCAG 2.1 AA accessibility mandates. Incorporate semantic HTML, ARIA live regions, explicit keyboard focus states, and high-contrast color palettes for dynamic graphics.

• Design System & Component Curation: Establish and maintain a standardized OWP design system and component library, aligning with the U.S. Web Design System (USWDS) and OWP branding guidelines to ensure visual and functional consistency across all web properties.

• User Research & Usability Evaluations: Analyze user feedback from Integrated Work Teams (IWTs), regional River Forecast Centers (RFCs), and public web forms to identify usability bottlenecks, conduct A/B usability evaluations, and refine navigation hierarchies.

• Agile Collaboration & Testing: Collaborate closely with full-stack developers, geospatial data engineers, and QA testers in Agile sprint cycles (VLab GitLab/GitHub) to ensure implemented code matches approved Figma designs and satisfies the mandatory =80% statement test coverage requirement.


Experience Required

• Education: Bachelor’s Degree in User Experience (UX) Design, Human-Computer Interaction (HCI), Computer Science, Graphic Design, or a related computational/design discipline.

• Professional Experience Benchmark: Minimum of 3 to 5 years (with 5+ years preferred) of professional experience designing and building public-facing web interfaces, data dashboards, or geospatial applications.

• Geospatial & Data Visualization Portfolio: Demonstrated portfolio showcasing responsive web designs, interactive data visualizers (charts/maps), design systems, and Figma wireframes for complex data-heavy platforms.

• Federal Accessibility Experience: Practical experience applying Section 508 and WCAG 2.1 AA accessibility guidelines to dynamic, canvas- or SVG-heavy web interfaces.


Technical Skills Required

• UI/UX & Prototyping Tools: Advanced proficiency in Figma, Canva, Adobe Creative Cloud, user story mapping, and wireframing methodologies.

• Frontend Languages & Frameworks: Strong proficiency in HTML5, CSS3 / SASS / Tailwind CSS, JavaScript (ES6+), TypeScript, and modern frontend frameworks (React, Vue, or Svelte).

• Geospatial & Data Charting Libraries: Hands-on experience integrating web mapping frameworks (MapLibre GL, OpenLayers, Leaflet, or Esri ArcGIS JS API) and charting tools (D3.js, Chart.js, or Plotly).

• Accessibility Standards & Auditing: Expertise in WCAG 2.1 Level AA, Section 508, ARIA attributes, color contrast verification, screen-reader compatibility (JAWS, NVDA), and automated audit tools (Axe Core, WAVE).

• Design Systems & Frameworks: Familiarity with the U.S. Web Design System (USWDS), design token management, and mobile-first responsive design principles.

• Agile & Version Control Tooling: Proficiency with Git repositories (VLab GitLab / GitHub), component testing frameworks (Jest / Cypress), and Agile issue tracking tools (Jira / VLab Redmine).