Tech Skills

UI/UX Design

User research, Figma, wireframing, design systems, prototyping and usability

9,968
lessons
Skills in this topic
View full skill map →
UX Research
beginner
Facilitate a usability test session
UI Design
beginner
Create a consistent 8pt spacing grid
Prototyping
intermediate
Build a click-through prototype in Figma
AI Design Tools
intermediate
Generate and iterate on UI concepts with AI
All Reads (1,780) Articles (755)Blog Posts (845)Tutorials (163)Research Papers (2)News (15)
Building Accessible Form Patterns with React and ARIA: A Practical Frontend Tutorial
Dev.to · Rizwan Saleem 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Building Accessible Form Patterns with React and ARIA: A Practical Frontend Tutorial
Building Accessible Form Patterns with React and ARIA: A Practical Frontend Tutorial ...
5 Things That Look Terrible as Plain Text (And How OpenUI Fixes Them)
Dev.to · shogun 444 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
5 Things That Look Terrible as Plain Text (And How OpenUI Fixes Them)
Most AI products still respond like it's 2023. You ask a question, a cursor blinks, and you get...
How I Built a Dark Cinematic Restaurant Landing Page Template and Listed It For Sale
Dev.to · Andy Cycod 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
How I Built a Dark Cinematic Restaurant Landing Page Template and Listed It For Sale
I'm 18 years old, based in Lagos, Nigeria, and I just launched my first digital product — a premium...
Stop Over-Engineering Your UI: Material 3 for Blazor (Without the JS State Management Nightmare)
Dev.to · Kouros Zirak 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Stop Over-Engineering Your UI: Material 3 for Blazor (Without the JS State Management Nightmare)
If you have built a web app in the last five years using the dominant JavaScript frameworks, you...
State.js Tutorial: Creating Reusable UI Components with Pure CSS Reactivity
Dev.to · iDev-Games 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
State.js Tutorial: Creating Reusable UI Components with Pure CSS Reactivity
Modern frontend frameworks treat components as JavaScript objects, classes, or functions. But what if...
Stop Using Global State: Master Localized React Context ⚡
Dev.to · Prajapati Paresh 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Stop Using Global State: Master Localized React Context ⚡
The Over-Globalized State Trap When building highly complex UI elements—like an advanced Kanban...
From Figma to production React, with AI in the loop
Dev.to · shadcncraft 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
From Figma to production React, with AI in the loop
The four pieces of the new design-to-code workflow: shadcncraft in your project, the shadcncraft...
md - context menu
Dev.to · pjdev2d 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
md - context menu
# Context Menu System – Architecture Review Notes ## Current Architecture Score | Area | Score...
Why I Built @editora/ui-react?
Dev.to · Ajay Kumar 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Why I Built @editora/ui-react?
After building multiple SaaS products, admin dashboards, AI tools, and enterprise platforms, I kept...
DEV Community support article for www.similarsites.com
Dev.to · jordit schwend 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
DEV Community support article for www.similarsites.com
This DEV.to / Forem article points readers toward an important Tier-1 resource for discovery and...
Visual Search Optimization
Dev.to · Joseph Anady 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Visual Search Optimization
Originally published at thatdevpro.com. This framework reference is part of the 14-tier Engine...
Form Optimization
Dev.to · Joseph Anady 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Form Optimization
Originally published at thatdevpro.com. This framework reference is part of the 14-tier Engine...
I Built a Free Sticker Maker Because Every Other One Hid the Export
Dev.to · MakeMyStickers 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
I Built a Free Sticker Maker Because Every Other One Hid the Export
Every "free" sticker and label maker I tried did one of three things: forced a signup, stamped a...
🪄 Form Arrays: The Senior Way to Build UI in Angular
Dev.to · ABDELAAZIZ OUAKALA 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
🪄 Form Arrays: The Senior Way to Build UI in Angular
Static forms break down as applications become workflow-driven. Learn how senior Angular developers use FormArray to build scalable, composable, enterprise-grad
Fix the Notch: How to Stop macOS Hiding Your Menu Bar Icons
Dev.to · Shawon Saha 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Fix the Notch: How to Stop macOS Hiding Your Menu Bar Icons
The notch on modern MacBooks gives us beautiful, near-borderless displays. But for heavy...
Drawing with CSS: Creating Complex Icons Without Using SVG
Dev.to · Nick Benksim 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Drawing with CSS: Creating Complex Icons Without Using SVG
Drawing with CSS: Creating Complex Icons Without Touching SVG Grab your coffee, pull up a chair, and...
I Got Tired of Heavy Design Tools… So I Built My Own 😩
Dev.to · Mohamed Ibrahim 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
I Got Tired of Heavy Design Tools… So I Built My Own 😩
Like the title says, I got tired of heavy design tools… so I built my own. I wanted something...
Build a streaming UI without overcomplicating it
Dev.to · Vimal 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Build a streaming UI without overcomplicating it
If you are building a UI that needs to show progress, logs, or live updates, you do not need to jump...
Mathematical Functions in CSS: clamp, min, max and How They Simplify Responsiveness
Dev.to · Nick Benksim 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Mathematical Functions in CSS: clamp, min, max and How They Simplify Responsiveness
The Math Cure for Your Layout Headaches Grab a cup of coffee and let's have a real talk about...
Google redesigned 13 Workspace icons last week. Here is where to grab the new SVGs.
Dev.to · GDS K S 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Google redesigned 13 Workspace icons last week. Here is where to grab the new SVGs.
On May 18 Google started rolling out new gradient icons for thirteen of its Workspace apps. Gmail,...
Using Custom Properties for Dynamic Theme Changes
Dev.to · Nick Benksim 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Using Custom Properties for Dynamic Theme Changes
The Ultimate Guide to Dynamic Theme Switching with CSS Custom Properties Grab your coffee, pull up a...
Add Your Own Component to Bombie in 5 Edits
Dev.to · Amith Moorkoth 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Add Your Own Component to Bombie in 5 Edits
This is the third post in the Bombie series. The first post was an intro, the second covered the...
Why I Got Tired of Class-Heavy UI Code and Started Building Around Attributes
Dev.to · Drew Marshall 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Why I Got Tired of Class-Heavy UI Code and Started Building Around Attributes
One thing that slowly wore me down over the years of frontend development wasn’t JavaScript. It...
How to Start with React Flow and Build an Advanced Workflow Builder Step by Step
Dev.to · Azim-Ahmed 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
How to Start with React Flow and Build an Advanced Workflow Builder Step by Step
Modern SaaS products are becoming more visual. Instead of asking users to fill out long forms, many...
Accessibility - This looks like a job for a developer advocate!
Dev.to · Andy Haskell 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Accessibility - This looks like a job for a developer advocate!
At the beginning of last year, I started a new role as an accessibility-focused frontend engineer....
Design decisions behind my “Irregular German Verbs” iOS app
Dev.to · Roman Voinitchi 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Design decisions behind my “Irregular German Verbs” iOS app
A pet project is, first of all, a way to learn something new in your own field. I have a 9–5 job, but...
🌃 Dark Mode Architecture That Doesn't Leak: A Design-System Approach for Angular
Dev.to · Abdelaaziz Ouakala 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
🌃 Dark Mode Architecture That Doesn't Leak: A Design-System Approach for Angular
Dark mode is not a UI toggle. It's a design-system architecture problem. Here's how to build scalable theme infrastructure in Angular using design tokens, a cen
Reading Log #0 — Manga Was a Democratization Device for Cultural Capital
Dev.to · machuz 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Reading Log #0 — Manga Was a Democratization Device for Cultural Capital
Taste is formed by class and history (Bourdieu). But in Japan, manga worked as a democratization device for cultural capital. How aesthetics rises from a place
Why Some Developers Are Moving Away From Tailwind CSS in 2026
Dev.to · pickuma 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Why Some Developers Are Moving Away From Tailwind CSS in 2026
A fair examination of the real technical arguments against utility-first CSS, why Tailwind still dominates for many teams, and who should actually reconsider it
I rebuilt my little corner of the internet
Dev.to · Somay 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
I rebuilt my little corner of the internet
Spent the last day redesigning my github + portfolio until they finally started feeling like me...
How I build Sanity Portable Text custom components in Next.js
Dev.to · Nayan Kyada 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
How I build Sanity Portable Text custom components in Next.js
Learn how to build Sanity Portable Text custom components in Next.js — code blocks, callouts, embedded forms, and captioned images with full TypeScript types.
Vicinage, type-safe and zero-runtime UI styling, right in the markup.
Dev.to · chbyb 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Vicinage, type-safe and zero-runtime UI styling, right in the markup.
Write your styles as typed objects directly on your JSX markup and get zero-runtime atomic CSS. Built...
Audio That Sees Itself
Dev.to · Giovambattista Fazioli 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Audio That Sees Itself
A Mantine-native audio player for React with waveform visualisation and a live spectrum analyser,...
What Does Vue 3 `ref()` Compile to in React with VuReact?
Dev.to · Ryan John 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
What Does Vue 3 `ref()` Compile to in React with VuReact?
VuReact compiles Vue 3 code into standard, maintainable React code. In this article, we will focus on...
Why "Good Enough" Design is the Solo Developer's Secret Weapon
Dev.to · The One-Man Framework 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Why "Good Enough" Design is the Solo Developer's Secret Weapon
I spent years looking at websites like Stripe or Linear and feeling depressed. I would try to...
LumaBride: Unified Wedding Visual Design in One Platform
Dev.to · zhang 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
LumaBride: Unified Wedding Visual Design in One Platform
LumaBride is a one-stop premium wedding visual design platform for couples who want a consistent...
How to Fix Common WCAG Color Contrast Failures
Dev.to · Romain 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
How to Fix Common WCAG Color Contrast Failures
Color contrast is the most common WCAG violation — detected on 81% of homepages per WebAIM. Six repeatable patterns close most of them. Code examples in Tailwin
Crazy Egg vs. Contentsquare: Each Tool’s True Strengths
Crazy Egg Blog 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Crazy Egg vs. Contentsquare: Each Tool’s True Strengths
Trying to choose between Crazy Egg and Contentsquare? Crazy Egg is a better UX and conversion rate optimization platform if you want heatmaps, session recording
Why I Stopped Designing Websites and Started Designing Flows
Dev.to · Drew Marshall 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Why I Stopped Designing Websites and Started Designing Flows
At one point, most of my thinking around software revolved around pages. landing...
⛔Stop Putting Logic in Templates: A Senior Angular Architect's Guide to Clean UI Contracts
Dev.to · abdelaaziz ouakala 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
⛔Stop Putting Logic in Templates: A Senior Angular Architect's Guide to Clean UI Contracts
Stop Putting Logic in Templates: A Senior Angular Architect's Guide to Clean UI...
Can Vue Be a React Authoring Language?
Dev.to · Ryan John 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Can Vue Be a React Authoring Language?
Introduction Have you ever been in this situation? You love Vue's Composition API and the...
12 Networking Fundamentals
Dev.to · Ashutosh Sarangi 🖌️ UI/UX Design 1mo ago
12 Networking Fundamentals
Personal Note:- Foundational Concepts (Single Server to Secure Zones) The video starts by following...
How to Build a Next.js App in 30 Languages (Without Losing Your Mind)
Dev.to · Iurii Rogulia 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
How to Build a Next.js App in 30 Languages (Without Losing Your Mind)
Next.js i18n with App Router at production scale — routing, type-safe translations, hreflang, and the formatting traps no tutorial warns you about.
Building True Vector PDF Export in the Browser with fabric.js
Dev.to · morestrive 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Building True Vector PDF Export in the Browser with fabric.js
Building True Vector PDF Export in the Browser with fabric.js https://yft.design/...
Day 0 — visual concept for a small cloud platform
Dev.to · Danilo Eduardo Lopez Corozo 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Day 0 — visual concept for a small cloud platform
Day 0 — visual concept for a small cloud platform I’m starting a small project around cloud hosting...
Part I: Don't Wait for Data. Render What You Know.
Dev.to · Pratik Goswami 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Part I: Don't Wait for Data. Render What You Know.
Part I of the series "Don't Let the User Wait - Render Quickly to Keep Their Attention." ...
Web3 Design: Why Beautiful Interfaces Are Also the Most Usable
Dev.to · soma ryuu 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Web3 Design: Why Beautiful Interfaces Are Also the Most Usable
There is a persistent myth in product design that usability and aesthetics are in tension. That...
Web3 Design Principles for DeFi Dashboards
Dev.to · soma ryuu 🖌️ UI/UX Design ⚡ AI Lesson 1mo ago
Web3 Design Principles for DeFi Dashboards
DeFi dashboards are some of the hardest UI problems in product design. You are asking people to make...