design

Name: design
Availability: InStock
Author: gustavscirulis

Implement Apple platform UI design with Liquid Glass effects and animations.

114|8|Updated Mar 4, 2025

Search Tags:#animation #ui design #swiftui #appkit #uikit #liquid glass

Ready to run

npx skills add https://github.com/gustavscirulis/snapgrid --skill design-gustavscirulis

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design
Source: https://github.com/gustavscirulis/snapgrid/tree/main/.claude/skills/skills/design
Command: npx skills add https://github.com/gustavscirulis/snapgrid --skill design-gustavscirulis

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides comprehensive guidance and patterns for implementing modern Apple UI design systems, focusing on Liquid Glass effects and fluid animations.

Core Features & Use Cases

Liquid Glass Implementation: Learn to use SwiftUI's .glassEffect() and AppKit's NSGlassEffectView for translucent, interactive UI elements.
Animation Patterns: Master SwiftUI animations, including springs, PhaseAnimator, KeyframeAnimator, and SF Symbol effects for dynamic interfaces.
Use Case: Implement a visually rich settings screen with frosted glass panels and smooth, physics-based transitions between different options.

Quick Start

Use the design skill to implement a Liquid Glass effect on a SwiftUI button.

Frequently Asked Questions about design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I implement Liquid Glass effects in SwiftUI?▼

To implement Liquid Glass effects in SwiftUI, use the `.glassEffect()` API to create translucent, interactive UI elements. This modern Apple platform design system provides patterns for building visually appealing frosted glass interfaces.

Can I use Liquid Glass effects in AppKit?▼

Yes, you can implement Liquid Glass in AppKit using `NSGlassEffectView`. This allows you to create translucent, interactive UI elements within macOS applications alongside standard SwiftUI implementations.

What's the best way to create fluid animations in SwiftUI?▼

The best way to create fluid animations in SwiftUI is by using `PhaseAnimator` and `KeyframeAnimator`. These APIs enable physics-based springs and dynamic transitions for highly interactive user experiences.

Does this support UIKit for modern UI design?▼

Yes, this covers UIKit alongside SwiftUI and AppKit frameworks. It details APIs for creating visually appealing, interactive user experiences across modern Apple platforms.

How do I build a settings screen with frosted glass panels?▼

Build a settings screen with frosted glass panels by applying `.glassEffect()` to your UI elements. Combine this with `KeyframeAnimator` for smooth, physics-based transitions between different options.