Web Design: UI, UX, colour, type & branding

Free generators and in-depth articles — UI, UX research, typography, colour, icons, design systems, motion, branding, AI for design and the creator business.

Web Design articles

UX & Research

10 Best Usability Testing Tools for Small Teams

Compare ten approachable user testing platforms for small product teams, from recorded usability sessions to prototype tests, and learn what to check before inviting participants.

Inside this article

Quick picks
How we picked
Flexible testing platforms
Interviews and observed sessions

Noor HaddadRead the article

UI Design

15 Best Free UI Kits for Figma

Explore fifteen useful free Figma UI kits for websites, apps, and prototypes, with a quick guide to choosing a kit that suits your project and avoids unnecessary setup.

Theo Okafor

Branding & Business

Sell Digital Assets: Build a Free-to-Premium Business

Plan a sustainable free-to-paid asset business with useful entry tools, clear licensing, realistic unit economics, and measurable customer upgrade paths.

Piotr Kowalski

AI for Design & UX

AI Heatmap Analysis and Usability Test Recordings

Use AI to organise usability recordings and heatmap evidence without inventing motives. Build a reviewable workflow for consent, transcripts, themes and product decisions.

Maya Lindqvist

Branding & Business

Personal Branding for Designers and Developers

Define a credible personal brand through positioning, a restrained visual identity and consistent language, then apply it across profiles, proposals and everyday communication.

Inside this article

Start with a useful positioning sentence
Choose a name and verbal signature
Build a small visual identity you can maintain
Make your promise visible through evidence

Arjun RamanRead the article

Motion & Animation

UI Animation Principles: Duration, Choreography, Purpose

Give interface motion a clear job, choose useful timing ranges, and choreograph transitions that preserve context without delaying tasks or overwhelming users.

Aiko Tanaka

Design Systems

Build vs Buy a Design System: An Evaluation Framework

Evaluate building, adopting, or extending a component system using real workflows, ownership costs, compatibility tests, licensing checks, and a reversible pilot.

Maya Lindqvist

Icons & Illustration

SaaS Hero Images: Illustration, Photo or 3D?

Choose SaaS hero imagery by the job it needs to do. Compare illustration, photography and 3D through product clarity, credibility, responsive crops and maintenance costs.

Aiko Tanaka

Icons & Illustration

Illustration Style Guide for Product Teams

Document a repeatable product illustration language with clear rules for geometry, palette, composition, asset delivery and review, supported by concrete examples.

Inside this article

Define the system's purpose and boundaries
Specify geometry and construction
Define color, lighting and composition
Make examples and accessibility part of the guide

Mateo FernándezRead the article

Typography & Colour

Superfamily Fonts: Build a UI With One Typeface

Build a coherent interface with one type family or a related superfamily. Evaluate useful styles, define clear text roles, and know when a second family is justified.

Noor Haddad

Typography & Colour

Font Weights for UI: Regular, Medium, Semibold and Bold

Assign regular, medium, semibold and bold to clear interface roles. Build a practical weight map, avoid synthetic surprises and test emphasis in real UI components.

Arjun Raman

UX & Research

UX Research Screener: Recruit the Right Participants

Plan a practical recruitment screener, collect reliable evidence, and turn findings into focused product improvements while keeping assumptions and research limits visible.

Noor Haddad

Jump to a web design topic