UX/UI Designer and Artist — El Mirage, AZ
Niels Nielsen, UX/UI designer and artist in El Mirage, Arizona
I design bold, accessible interfaces and government-grade design systems — and make art that pushes them further.
Who I am
About me - Who I Am
Tool interface // Select a module
System online
Readout
Interface design
Figma
Collaborative design tool for wireframes, high-fidelity screens, prototypes and component libraries. It is the home of my design systems, including USWDS-based libraries for government work.
Hover or tap a tool to see how it fits my work
From the guitar to Disney and Pixar to Lockheed Martin, my path has always been about making things people feel and use.
Hi, I'm Niels C. Nielsen Jr., a UX/UI designer and artist based in El Mirage, Arizona. I design accessible interfaces and design systems for government and commercial teams, and I build what I design. Every project gets the same mix of an artist's eye, a coder's practicality, and a musician's sense of timing.
0+
Years of UX/UI experience
My journey
-
01
The session guitarist
It started with a guitar. Working as a session guitarist taught me to listen first, find the groove, and serve the song. I still bring that to every design.
-
02
The animator
From sound I moved to motion, working as an animator for Disney and Pixar, where timing, story, and craft decide whether something feels alive.
-
03
The builder
At Lockheed Martin I worked as a web developer and UI designer, which is where I learned to code the interfaces I design with HTML, CSS, SCSS, Bootstrap, Angular, and React.
-
04
The designer today
Today I bring it all together: accessible UX/UI, mobile experiences, and design systems across platforms like Salesforce, PeopleSoft, and Adobe AEM, plus illustration and art on the side.
Design skills
- UX/UI Design
- Mobile UX/UI Design
- Graphic Design
- Illustration
- Design Systems
- Accessibility (508 / WCAG)
Code and platforms
- Front-End Coding
- HTML
- CSS
- SCSS
- Bootstrap
- Angular
- React
- Salesforce
- PeopleSoft
- Adobe AEM
Skills
Systems thinker. Maker of things.
Government-grade UX on one side, commercial product and brand work on the other, and an artist's eye on both. Both show up in every pixel.
Government and public sector
-
01
UX Research
Understanding real users, their tasks, and the barriers between them and a public service.
-
02
Information Architecture
Structuring complex content and flows so people find what they need without guessing.
-
03
Wireframes and Prototyping
From low-fidelity sketches to clickable prototypes that stakeholders can test early.
-
04
USWDS Design Systems
Component libraries, typography, and spacing standards built in Figma on the U.S. Web Design System.
-
05
Accessibility
Contrast, focus states, and semantics designed in from the first frame, not patched in later.
-
06
Documentation
Living guidelines and Storybook components that keep design and engineering in sync.
Commercial and open sector
-
01
Web and E-Commerce
Shopping, product, and marketing websites for retail, automotive, and lifestyle brands.
-
02
Brand-Forward UI
Bold, expressive interfaces that carry a brand's voice instead of looking like a template.
-
03
Mobile App Design
App interfaces and interactions that feel native and are quick to learn.
-
04
Product Design Systems
Component libraries and design tokens that help product teams ship consistently and fast.
The artist
-
01
Illustration
Hand-built vector and sketch work with a bold, graphic point of view.
-
02
Digital Art
Painting, texture, and compositing that bring depth and mood to a concept.
-
03
Motion and Animation
Timing and rhythm in After Effects and GSAP that make interfaces feel alive.
-
04
Visual Identity
Marks, color, and type pulled together into a look people remember.
The full toolbox
Every tool in the modern UX/UI stack.
From research to shipped design systems, and now AI design agents working beside me. The right tool for each stage of the job.
Interface design
- Figma
- Sketch
- Adobe XD
- Penpot
- Framer
- Axure RP
- Webflow
- Affinity Designer
- Canva
AI design agents
- Figma Make
- Figma AI
- Claude
- ChatGPT
- Gemini
- Google Stitch
- v0 by Vercel
- Lovable
- Bolt
- Replit Agent
- Cursor
- Uizard
- Visily
- Relume
- Galileo AI
- Magic Patterns
- UX Pilot
- Framer AI
- Webflow AI
- Wix Studio AI
- Subframe
- Banani
- Builder.io
- Polymet
- Onlook
- Creatie
- Midjourney
- Adobe Firefly
- DALL·E
- Stable Diffusion
- Leonardo AI
- Ideogram
- Runway
- Khroma
- Attention Insight
Prototyping
- Figma Prototyping
- ProtoPie
- Principle
- Origami Studio
- Marvel
- InVision
- Bubble
Research and testing
- Maze
- UserTesting
- Lyssna
- Optimal Workshop
- Lookback
- Dovetail
- Hotjar
- Microsoft Clarity
- UserZoom
- Useberry
Design systems and handoff
- USWDS
- Storybook
- Figma Dev Mode
- Tokens Studio
- Style Dictionary
- Zeroheight
- Supernova
- Zeplin
- Chromatic
Accessibility
- Stark
- axe DevTools
- WAVE
- Color Contrast Analyser
- VoiceOver
- NVDA
- JAWS
Collaboration and workflow
- FigJam
- Miro
- Mural
- Whimsical
- Lucidchart
- Notion
- Jira
- Confluence
- Slack
- Loom
Motion and visual craft
- After Effects
- Rive
- Lottie
- GSAP
- Spline
- Illustrator
- Photoshop
- Procreate
- Blender
Services
What I design.
-
01
UX/UI design
Research-driven flows, wireframes, and polished interfaces that are clear, accessible, and built to be used.
-
02
Design systems
Component libraries, tokens, and documentation, including USWDS-based systems for government teams.
-
03
Websites and web apps
Bold, responsive websites and web applications, designed from first sketch to final handoff.
-
04
Mobile apps
Mobile app interfaces and interactions that feel native and are easy to learn.
-
05
Art and illustration
Original artwork and illustration for brands, posters, and digital products.
AI workflow
AI speeds me up. Craft decides.
I use AI design agents as fast collaborators for exploration, and I keep every decision about structure, accessibility, and taste in my own hands.
-
01
Frame the problem
Research, user needs, and constraints come from me. A clear brief is what makes AI output useful.
-
02
Explore with agents
AI design agents generate layouts, variants, and copy directions in minutes, so I can compare many ideas early.
-
03
Refine by hand
I pick a direction, then rebuild it in Figma with real hierarchy, spacing, and system components.
-
04
Verify and ship
Contrast, focus states, and USWDS standards are checked by a human before anything goes out.
The process, animated
From AI prompt to polished UI
Watch one screen travel the whole route: a prompt to an AI agent, a rough draft, a lo-fi wireframe I rework by hand, a polished interface, and the final checks.
Your guide · Step 1 of 6
Start here. Watch the brief being typed: the audience, the goal, and the constraints. Then press Next.
Illustrative example of my process. It pauses on hover; use the arrows or click a step.
Before and after
From rough AI draft to finished design
Illustrative example of the process. Drag the slider to compare.
Generic hierarchy, weak contrast, no system.
Clear hierarchy, accessible contrast, tokens and components.
Dashboard
Dashboard
Artwork
Niels Art Studio
Painting, digital art, and illustration. The same eye for color and form that shapes my interfaces.
Scroll to glide through the gallery. Click any piece to view it larger.
Art showcase
More art at nnart.co
My art lives on its own site. Step into the full collection of paintings, digital pieces, and illustration.
My art site
Niels Art Studio
Paintings, digital pieces, and illustration live on their own site. Come see the full collection, new drops, and the work behind the interfaces.
All work
Every project, one wall.
A full look at past projects. Select any image to open its story, details and gallery.
Use case
Government design system
A high-level design system for the government sector, built in Figma and grounded in the U.S. Web Design System (USWDS) — typography, spacing, and components that agencies can trust.
Client
Alpha Omega
Role
UX/UI Designer
Outcome
5 years on the project
Typography
Aa
The quick brown fox jumps over the lazy dog.
USWDS pairs open-source typefaces for clear, readable government interfaces.
- Public Sans
- Source Sans Pro
- Merriweather
- Roboto Mono
Spacing
Layout runs on a consistent 8px-based spacing scale, so every component lines up.
-
8px
-
16px
-
24px
-
32px
-
48px
-
64px
Components
A shared library of accessible, reusable interface parts, modeled on the USWDS component list.
- Accordion
- Alert
- Banner
- Breadcrumb
- Button
- Button group
- Card
- Checkbox
- Combo box
- Date picker
- File input
- Footer
- Header
- Modal
- Pagination
- Radio buttons
- Search
- Side navigation
- Step indicator
- Summary box
- Table
- Tag
- Text input
- Tooltip
Inside the system
A look at the design system as it lives in Figma and Storybook. Illustrative screens; swap in your own captures from the studio editor.
How the system fits together
Foundations in Figma
Typography, color, and spacing captured as shared styles and variables.
Components
USWDS components rebuilt with variants, states, and accessibility notes.
Storybook
Coded examples documented so design and engineering stay in sync.
Guidance
Usage rules and patterns teams can adopt without guesswork.
Use case — in depth
How I used USWDS to design for government
Scroll to walk through how the U.S. Web Design System became the backbone for patterns, components, and standards across multiple federal websites.
Design patterns
Patterns for every government journey
I used USWDS guidance to document repeatable UX patterns so every federal team solves the same problem the same way.
- Form and multi-step flows built on USWDS patterns
- Page layouts, navigation, and content hierarchy templates
- Accessible error, validation, and confirmation behavior
Component designs
A Figma library built from USWDS components
Each USWDS component was rebuilt in Figma with variants, states, and usage notes so designers can assemble screens with confidence.
- Variants and states for buttons, inputs, tables, and alerts
- Auto layout and variables tied to USWDS tokens
- Accessibility notes documented on every component
Design standards
Standards teams can actually follow
Typography, color, and the 8px spacing scale were captured as clear standards, replacing one-off decisions with shared rules.
- Type scale and font pairing rules from USWDS
- Spacing, grid, and padding standards
- Color contrast and accessibility requirements
Federal rollout
One system across multiple federal websites
The same foundations, components, and guidance were applied across several federal sites, keeping the experience consistent for the public.
- Shared library reused across agency websites
- Design and engineering kept in sync through documentation
- Guidance teams adopt without guesswork
03 / Live websites and historical projects
The breadth behind the craft.
Clickable destinations referenced in my earlier resume or recent project work. These are not guaranteed to show the original designs; newer teams may have changed the live websites.
Federal and public services
- Arizona Public Service
- Technical Assistance Center
- Alpha Omega
- SeKONhistoric employer
Retail, commerce and lifestyle
Agency, platforms and additional historical sites
- Grupo Gallegos / GALLEGOS United
- Blabwirehistorical
- Hass Avocado Board
- 1WorldSyncarchived sample
- 1WorldSync
- ZapTravelhistorical
- Lexus
Note: links point to current company sites, which may differ from the original work. Some archived pages may no longer be available.
The Journal
Notes from the studio
Thoughts on UX/UI, government design systems, accessibility, AI-assisted design, and the art that feeds my work.
No posts yet. New articles will appear here soon.
01 / Profile & current work
Design with intention. Systems built to scale.
Senior UX/UI and product design professional with 15 years of experience across government digital services and commercial brands in retail, automotive, and lifestyle. Specializes in accessible interaction patterns and design systems that bridge design and engineering, combining strong visual craft with hands-on front-end knowledge, responsive behavior, and complex information architecture.
Professional experience
Alpha Omega
UX/UI Designer
- Design federal digital interfaces, including TA Center directory discovery, page architecture, and search/filter interaction patterns.
- Design Figma component states for guided search, multi-select filtering, event/webinar cards, and accessible 360–1400px layouts.
- Translate requirements into low- and high-fidelity concepts, responsive specifications, and documented interaction states.
SeKON LLC
Lead UI/UX Designer
- Led UX/UI design for federal digital experiences, developing responsive patterns aligned with USWDS and Section 508 / WCAG requirements.
- Produced reusable Figma components, design-system patterns, and developer handoff guidance for Drupal-based federal websites.
- Developed wireframes, accessible interactions, and desktop-to-mobile content experiences in collaboration with federal stakeholders and engineers.
Paradigm / Arizona Public Service
Lead UI/UX Designer
- Designed responsive customer-facing interfaces for APS.com, including reusable content patterns and energy-estimation tools.
- Delivered detailed UX/UI specifications and front-end design guidance to distributed engineering teams.
Cool Events LLC
Lead UI/UX Designer · Contract
- Designed Salesforce Lightning-based interfaces and coordinated implementation of multiple branded event experiences.
Grupo Gallegos
Senior UI/UX Designer
- Designed and developed responsive experiences across Drupal/Pantheon properties, including English/Spanish sites for Hass Avocados.
- Supported automotive and e-commerce UI projects, including a Mazda comparison experience.
Cadient
Senior UI/UX Designer / Front-End Engineer
- Created responsive digital experiences and front-end prototypes for enterprise and commercial clients.
Google / Contract
Senior UI/UX Designer / Front-End Engineer
- Supported internal digital initiatives and interactive marketing experiences through interface design, prototypes, and front-end development.
Additional experience
- Apoorva / Stem Match (2014)
- Genesis Auctions (2013–2014)
- Blabwire Media (2013)
- Ciber (2012–2013)
- IntraSee (2011–2012)
Education
California State University, Fullerton
B.A., Computer Science
Representative design strengths
- Federal UX and government content architecture
- Design systems, component libraries, and state documentation
- Accessible interaction design and responsive behavior
- Search/filter flows, data display, event and calendar patterns
- High-fidelity UI craft and practical engineer collaboration
- Interface Design
- Design Systems
- Prototyping
- Accessibility
- Documentation
Full work history, education, and references live on my resume site.
Questions and answers
Quick answers about working with me.
The short version of who I am, what I design, and how to hire me.
- Who is Niels Nielsen?
- Niels C. Nielsen Jr. is a UX/UI designer and artist based in El Mirage, Arizona. He has 15 years of experience designing interfaces and design systems, with a focus on accessible government digital services.
- What services does Niels offer?
- UX/UI design, design systems, websites and web apps, mobile apps, and art and illustration. Each engagement runs from first sketch to developer handoff.
- Does Niels have government design experience?
- Yes. He is currently a UX/UI Designer at Alpha Omega, building a design system in Figma on the U.S. Web Design System (USWDS). He previously led UX/UI design for SAMHSA and CDC digital experiences at SeKON LLC, following USWDS and Section 508 / WCAG requirements.
- What tools does Niels use?
- Figma, Figma Make, Storybook, Sketch, Illustrator, Photoshop, After Effects, and GSAP. Components are documented in Storybook so design and engineering stay in sync.
- How does Niels use AI in his design work?
- AI design agents help him explore layouts, variants, and copy directions quickly. He frames the problem, chooses the direction, rebuilds it by hand in Figma, and checks contrast, focus states, and USWDS standards himself before anything ships.
- How is accessibility handled?
- Accessibility is designed in from the first frame: color contrast, focus states, and semantic structure that meet Section 508 and WCAG guidelines.
- Where is Niels based, and who does he work with?
- He works from El Mirage, Arizona, and takes on UX/UI, design-system, and art engagements for clients across the United States.
- How can I hire Niels or see his resume?
- Email niels@nielsn.com or use the contact form below, choosing a project type and budget range. The full resume is at nielsnresume.com and can also be downloaded as a PDF from this page.
Accessibility
Built to be usable by everyone.
Accessibility is part of my craft, not an afterthought. Here is what this site does, and the real contrast numbers behind its colors.
Color contrast, checked live
8/8
These ratios are calculated in your browser from the site's actual colors. WCAG AA needs 4.5:1 for body text; AAA needs 7:1.
- Body text on page background15.73:1AAA pass
- Body text on card background14.82:1AAA pass
- Gold accent on page background13.24:1AAA pass
- Button text on gold13.24:1AAA pass
- Dark text on white sections19.56:1AAA pass
- Secondary text (70% opacity)7.93:1AAA pass
- Tertiary text (55% opacity)5.24:1AA pass
- Muted gray on page background6.42:1AA pass
This is an automated check of text colors only. It does not replace a full manual audit with a screen reader and keyboard testing.
-
Skip link
Press Tab on load to jump straight to the main content.
-
Visible focus
Every link and button shows a clear gold focus ring for keyboard users.
-
Clear structure
Header, navigation, main, and footer landmarks with labeled sections.
-
Reduced motion
Smooth scrolling, the custom cursor, and most animation turn off if your device asks for less motion.
-
Image descriptions
Meaningful images carry alt text; decorative ones are hidden from screen readers.
-
Labeled forms
The contact form has visible labels, required fields, and announced errors.
Stay in the loop
Get notified about new work.
Drop your email and I'll let you know when I publish new projects, art, and journal posts. No spam.
Contact
Let's build something clear.
Open to UX/UI, design-system, and art engagements. Send a message and tell me what you're working on.
El Mirage, Arizona