Articles tagged “guide”
29 articles about guide.
Figma Keyboard Shortcuts That Actually Speed Up Your Workflow
The Figma shortcuts worth memorizing — selection, editing, text, view, auto layout, and prototyping. Focused on speed, not an exhaustive list.
How to Add Animation to UI
A practical guide to adding animation to UI designs. Covers core principles like easing and timing, the best tools for the job, and when motion helps vs. hurts UX.
How to Build a Component Library in Figma
Step-by-step guide to building a Figma component library — naming conventions, variants, component properties, nesting, and publishing to a team.
How to Build a Research Repository
How to set up a centralized UX research repository for your team. Covers structure, tagging systems, templates, and tools like Dovetail, Notion, and Miro.
How to Choose a Website Builder
A decision guide for picking between Webflow, Framer, Squarespace, and Wix Studio. Covers use cases, skill requirements, pricing, and scaling considerations.
How to Create a Design System: A Practical Guide
Step-by-step guide to building a design system from scratch — what to include, what to skip, and which tools to use.
How to Create User Personas
Practical persona creation guide — what to include, how to get real data, and how to make personas your team actually references.
How to Design a Mobile App: End-to-End Process
Design a mobile app from scratch — user flows, iOS and Android frame setup, platform components, gesture navigation, prototyping, and handoff.
How to Design for Dark Mode
Practical dark mode design guide — semantic color tokens, WCAG contrast, Figma Variables for mode switching, and the mistakes to avoid.
How to Design Responsive Layouts in Figma
Responsive design in Figma — setting up breakpoints, constraints vs auto layout, mobile-first design, and translating specs to Webflow.
How to Do Unmoderated Usability Testing
A practical guide to running unmoderated remote usability tests. Covers task design, participant recruiting, analyzing results, and picking the right tool.
How to Do Usability Testing
A practical usability testing guide — moderated vs unmoderated, writing task scenarios, recruiting participants, and using Maze and Hotjar.
How to Get a UX Design Job
Practical UX job-search guide — what hiring managers look for, portfolio structure, case study writing, interview prep, and what to do without experience.
How to Hand Off Designs to Developers
Developer handoff best practices — Figma Dev Mode, layer naming, specifying interactions and states, and when to use Zeplin vs Dev Mode.
How to Learn UI Design: A Realistic Learning Path
A practical UI design learning path for beginners — the fundamentals to learn first, how to practice, portfolio building, and a realistic timeline.
How to Map User Journeys
User journey mapping guide — the components, how to gather data, when to use journey maps vs service blueprints, and the right tools.
How to Present Designs to Stakeholders
How to present design work effectively — choosing fidelity, using Figma presentation mode, managing feedback, and running async reviews.
How to Run a Design Sprint
A practical 5-day design sprint guide — day-by-day breakdown, tool setup for Miro and Figma, participant roles, and remote sprint adjustments.
How to Switch from Sketch to Figma
A practical migration guide — importing Sketch files, mapping Symbols to Components, moving team libraries, and comparing pricing.
How to Test Information Architecture
Guide to testing information architecture with card sorting and tree testing. Covers open vs. closed card sorts, analyzing dendrograms, and iterating on navigation.
How to Use AI for UI Prototyping
How to use AI tools like v0, Lovable, Bolt, Galileo AI, and Figma AI to speed up UI prototyping. Covers what each tool does best and practical workflows.
How to Use Auto Layout in Figma
Master Figma's Auto Layout feature — spacing modes, padding, fill vs hug, and real patterns like buttons, cards, and nav bars.
How to Use Figma Prototyping
Figma prototyping practical guide — smart animate, overlays, scroll, variable-driven logic, and when to move to ProtoPie for complex interactions.
How to Use Rive
Getting started with Rive for interactive animations. Covers the state machine editor, timeline animation, and exporting runtimes for web, iOS, and Android.
How to Use Spline
Getting started with Spline for 3D web design. Covers the interface, building 3D scenes, materials, exporting for the web, and embedding in React projects.
How to Use Variables in Figma
Learn Figma Variables — color, number, string, and boolean types — and set up a real semantic color system with light and dark mode.
Typography Guide for UI Design
UI typography fundamentals — type scales, line height rules, font pairing, responsive type, and common mistakes that make interfaces look amateur.
What Is UI Design? A Plain-English Explanation
What UI design is, how it differs from UX design, what UI designers do day-to-day, the skills you need, tools used, and how the role has evolved.
What Is UX Design? A Plain-English Explanation
What UX design actually means, the UX process from research to testing, how UX relates to UI, what UX designers do day-to-day, and how to get started.