This is a comprehensive reference for building UI in Unreal Engine, covering UMG widgets in C++, the BindWidget pattern, and Common UI plugin integration. It walks you through lifecycle management, input mode switching, and concrete examples for buttons, text blocks, progress bars, and virtualized lists. The code samples are production-ready and include the gotchas you'd normally hit, like when BindWidget refs become valid, why you need Transient on animation bindings, and how SetText wipes Blueprint bindings. If you're wiring up menus, HUDs, or any screen-space UI and want to avoid the usual UMG pitfalls, this gives you the patterns that actually work. The Common UI section is incomplete but points to separate setup docs.

skills.sh installs
1.5K
GitHub stars
446
last updated
Aug 21, 2026

Install

$ npx -y skills add quodsoler/unreal-engine-skills --skill ue-ui-umg-slate --agent claude-code

Installs into .claude/skills of the current project.

Files

UE UI: UMG, Slate, and Common UI

Target engine: UE 5.8. APIs below are verified against the 5.8 headers; older forms are listed under "Deprecated — do not use".

UMG is the runtime UI framework (UMG module, Engine/Source/Runtime/UMG/Public) built on Slate (Slate, SlateCore). Common UI (plugin, production in 5.8) adds cross-platform input routing, activation stacks and platform-aware buttons. Model View Viewmodel (plugin, Beta in 5.8) adds declarative data binding on top of FieldNotification.

Context

Read .agents/ue-project-context.md if it exists (module names, conventions, enabled plugins, GAS/networking setup). Do not stop if it is missing.

Identify the area from the request and the codebase. Ask only when two plausible readings would produce different code.

Sponsors

Details

Repository
github.com/quodsoler/unreal-engine-skills
Categories
Frontend Development, Game Development
First seen
Jun 3, 2026

More from quodsoler/unreal-engine-skills

All 27
1vercel-labs avatarvuevercel-labs/json-renderVue 3 renderer for json-render. Use when building Vue UIs from JSON specs, working with @json-render/vue, defining Vue component registries, or rendering AI-gen1.4Kskills.sh installs
2itechmeat avatarreact-testing-libraryitechmeat/llm-codeReact Testing Library: user-centric component testing with queries, user-event simulation, async utilities, and accessibility-first API. Use when writing React 1.4Kskills.sh installs
3next-safe-action avatarsafe-action-hooksnext-safe-action/skillsUse when executing next-safe-action actions from React client components -- useAction, useOptimisticAction, handling status/callbacks (onSuccess/onError/onSettl1.2Kskills.sh installs
4vercel-labs avatarsveltevercel-labs/json-renderSvelte 5 renderer for json-render that turns JSON specs into Svelte component trees. Use when working with @json-render/svelte, building Svelte UIs from JSON, c1.2Kskills.sh installs
5zarazhangrui avatarfrontend-slideszarazhangrui/frontend-slidesCreate stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PP1.2Kskills.sh installs
6pixel-process-ug avatarui-ux-pro-maxpixel-process-ug/superkit-agentsUse when the user needs full UI/UX design intelligence — styles, palettes, fonts, UX guidelines, chart selection, and accessible, performant implementation acro1.2Kskills.sh installs