Need
Liquid Glass UI API
Default options
SwiftUI 의 glassEffect, GlassEffectContainer, 글래스 버튼 스타일
Why it's needed
이 스킬에서는 이러한 네이티브 API를 우선 사용해야 합니다. 그러면 Codex가 머티리얼 시스템을 따로 구현할 필요 없이 커스텀 블러 레이어를 제거할 수 있습니다.
Codex use case
Liquid Glass 도입하기
Codex로 iOS 26 API와 Xcode 26을 활용해 기존 SwiftUI 앱에 Liquid Glass를 적용하세요.
Difficulty Advanced
Time horizon 1h
Codex와 Build iOS Apps 플러그인으로 기존 iPhone 및 iPad UI를 점검하고, 직접 구현한 블러 효과나 여러 겹으로 쌓은 머티리얼을 네이티브 Liquid Glass로 교체하세요. iOS 26 API의 사용 가능 여부를 확인하고 시뮬레이터에서 결과를 검증해 안전하게 마이그레이션하세요.
Best for
- 대략적인 디자인 개편 방향을 넘어 iOS 26 Liquid Glass를 도입할 구체적인 계획이 필요한 기존 SwiftUI 앱
- Codex에 커스텀 카드, 시트, 탭 바, 도구 막대, 액션 버튼 점검을 맡기고 이어서 마이그레이션도 작은 단위로 나누어 맡기려는 팀
- 이전 iOS 버전도 계속 지원하므로 `#available(iOS 26, *)`로 버전을 구분해 이전 버전에서는 기존 UI를 제공해야 하는 앱
Contents
Liquid Glass 도입하기
Codex로 iOS 26 API와 Xcode 26을 활용해 기존 SwiftUI 앱에 Liquid Glass를 적용하세요.
Codex와 Build iOS Apps 플러그인으로 기존 iPhone 및 iPad UI를 점검하고, 직접 구현한 블러 효과나 여러 겹으로 쌓은 머티리얼을 네이티브 Liquid Glass로 교체하세요. iOS 26 API의 사용 가능 여부를 확인하고 시뮬레이터에서 결과를 검증해 안전하게 마이그레이션하세요.
Advanced
1h
Codex와 Build iOS Apps 플러그인으로 기존 iPhone 및 iPad UI를 점검하고, 직접 구현한 블러 효과나 여러 겹으로 쌓은 머티리얼을 네이티브 Liquid Glass로 교체하세요. iOS 26 API의 사용 가능 여부를 확인하고 시뮬레이터에서 결과를 검증해 안전하게 마이그레이션하세요.
Advanced
1h
Best for
- 대략적인 디자인 개편 방향을 넘어 iOS 26 Liquid Glass를 도입할 구체적인 계획이 필요한 기존 SwiftUI 앱
- Codex에 커스텀 카드, 시트, 탭 바, 도구 막대, 액션 버튼 점검을 맡기고 이어서 마이그레이션도 작은 단위로 나누어 맡기려는 팀
- 이전 iOS 버전도 계속 지원하므로 `#available(iOS 26, *)`로 버전을 구분해 이전 버전에서는 기존 UI를 제공해야 하는 앱
Skills & Plugins
- SwiftUI Liquid Glass, SwiftUI UI 패턴, 시뮬레이터 디버깅 스킬을 활용해 iOS 화면에 네이티브 글래스 효과를 적용하고 디자인을 개선하세요. iOS 26 시뮬레이터에서 결과를 확인하세요.
| Skill | Why use it |
|---|---|
| Build iOS Apps | SwiftUI Liquid Glass, SwiftUI UI 패턴, 시뮬레이터 디버깅 스킬을 활용해 iOS 화면에 네이티브 글래스 효과를 적용하고 디자인을 개선하세요. iOS 26 시뮬레이터에서 결과를 확인하세요. |
Starter prompt
Build iOS Apps 플러그인과 해당 플러그인의 SwiftUI Liquid Glass 스킬을 사용해 이 앱에서 자주 쓰이는 플로우 하나에 Liquid Glass를 적용해 주세요.
제약 조건
- iOS 26과 Xcode 26을 기준으로 마이그레이션하되, `#available(iOS 26, *)`를 사용해 이전 iOS 버전에서는 글래스 효과가 없는 UI를 유지해 주세요.
- 먼저 플로우를 점검해 주세요. 커스텀 배경, 여러 겹의 블러 레이어, 칩, 버튼, 시트, 도구 막대 중 네이티브 Liquid Glass를 적용할 요소를 짚어 주세요. 효과 없이 콘텐츠만 표시할 영역도 명시해 주세요.
- 커스텀 블러보다 시스템 컨트롤과 `glassEffect`, `GlassEffectContainer`, `glassEffectID`, `.buttonStyle(.glass)`, `.buttonStyle(.glassProminent)` 같은 네이티브 API를 우선 사용해 주세요. 한 형태에서 다른 형태로 자연스럽게 바뀌는 전환이 플로우를 실제로 개선할 때만 `glassEffectID`와 `@Namespace`를 함께 사용해 주세요.
- 레이아웃과 시각 효과를 지정하는 수정자 뒤에 `glassEffect`를 적용하고 도형을 일관되게 사용해 주세요. `.interactive()`는 실제로 터치에 반응하는 컨트롤에만 적용해 주세요.
- XcodeBuildMCP로 앱을 빌드하고 iOS 26 시뮬레이터에서 실행해 주세요. 마이그레이션한 플로우의 스크린샷을 찍고, 사용한 스킴과 시뮬레이터, 수행한 검사 항목을 정확히 명시해 주세요.
결과물
- 해당 플로우의 간단한 마이그레이션 계획
- Liquid Glass를 적용한 부분의 구현 코드
- iOS 26 이전 버전을 사용하는 기기에서 대체 UI가 동작하는 방식
- 시뮬레이터에서 수행한 검증 절차와 검증에 사용한 스크린샷
Build iOS Apps 플러그인과 해당 플러그인의 SwiftUI Liquid Glass 스킬을 사용해 이 앱에서 자주 쓰이는 플로우 하나에 Liquid Glass를 적용해 주세요.
제약 조건
- iOS 26과 Xcode 26을 기준으로 마이그레이션하되, `#available(iOS 26, *)`를 사용해 이전 iOS 버전에서는 글래스 효과가 없는 UI를 유지해 주세요.
- 먼저 플로우를 점검해 주세요. 커스텀 배경, 여러 겹의 블러 레이어, 칩, 버튼, 시트, 도구 막대 중 네이티브 Liquid Glass를 적용할 요소를 짚어 주세요. 효과 없이 콘텐츠만 표시할 영역도 명시해 주세요.
- 커스텀 블러보다 시스템 컨트롤과 `glassEffect`, `GlassEffectContainer`, `glassEffectID`, `.buttonStyle(.glass)`, `.buttonStyle(.glassProminent)` 같은 네이티브 API를 우선 사용해 주세요. 한 형태에서 다른 형태로 자연스럽게 바뀌는 전환이 플로우를 실제로 개선할 때만 `glassEffectID`와 `@Namespace`를 함께 사용해 주세요.
- 레이아웃과 시각 효과를 지정하는 수정자 뒤에 `glassEffect`를 적용하고 도형을 일관되게 사용해 주세요. `.interactive()`는 실제로 터치에 반응하는 컨트롤에만 적용해 주세요.
- XcodeBuildMCP로 앱을 빌드하고 iOS 26 시뮬레이터에서 실행해 주세요. 마이그레이션한 플로우의 스크린샷을 찍고, 사용한 스킴과 시뮬레이터, 수행한 검사 항목을 정확히 명시해 주세요.
결과물
- 해당 플로우의 간단한 마이그레이션 계획
- Liquid Glass를 적용한 부분의 구현 코드
- iOS 26 이전 버전을 사용하는 기기에서 대체 UI가 동작하는 방식
- 시뮬레이터에서 수행한 검증 절차와 검증에 사용한 스크린샷
iOS 26을 기준으로 시작하기
Liquid Glass 도입은 iOS 26과 Xcode 26으로 마이그레이션하는 작업부터 시작하세요. iOS 26 SDK로 앱을 다시 빌드하고 표준 SwiftUI 컨트롤에 어떤 변화가 자동으로 적용되는지 확인하세요. 그런 다음 여전히 입체감이 부족하거나 시각적으로 무거워 보이거나 시스템 UI와 어울리지 않는 커스텀 요소를 Codex에 다시 디자인해 달라고 요청하세요.
앱이 이전 iOS 버전도 지원한다면 처음부터 이 조건을 명시하세요. Build iOS Apps 플러그인의 SwiftUI Liquid Glass 스킬은 #available(iOS 26, *)로 버전을 확인해 iOS 26 이상에서만 새로운 글래스 전용 API를 사용해야 합니다. 이전 버전의 iOS를 사용하는 기기에서도 화면을 읽기 쉽도록 대체 구현을 유지해야 합니다.
iOS 플러그인 활용하기
Codex로 SwiftUI 화면을 수정하고 시뮬레이터에서 결과까지 검증하려면 Build iOS Apps 플러그인을 사용하세요. Liquid Glass를 도입할 때는 Codex에 플로우 하나를 점검하고 그 안에서 몇 가지 UI 요소만 마이그레이션해 달라고 요청하세요. 이어서 Codex에 iOS 26 시뮬레이터에서 앱을 실행하고 스크린샷을 캡처해 달라고 요청한 뒤 작업 범위를 넓히세요.
이 플러그인에 포함된 SwiftUI Liquid Glass 스킬은 다음 원칙을 기본으로 합니다. 프롬프트에도 이 원칙을 반영하세요.
- 커스텀 블러 뷰보다 기본 제공
glassEffect,GlassEffectContainer, 글래스 버튼 스타일,glassEffectID전환을 우선 사용하세요. - 레이아웃과 시각적 속성을 조정하는 수정자를 먼저 적용한 뒤
.glassEffect(...)를 적용하세요. 그래야 원하는 최종 모양에 맞춰 글래스 재질이 입혀집니다. - 여러 글래스 요소가 함께 표시될 때는 서로 관련된 요소를
GlassEffectContainer로 묶으세요. .interactive()는 실제로 터치에 반응하는 버튼, 칩, 컨트롤에만 사용하세요.- 요소마다 글래스 효과를 다르게 주기보다 기능 전체에서 모서리 모양, 색조, 간격을 일관되게 유지하세요.
- iOS 26 이전 버전용으로 글래스 효과를 사용하지 않는 대체 구현을 유지하세요.
플러그인과 스킬을 설치하는 방법은 플러그인 및 스킬 문서를 참고하세요.
WWDC 세션 시청하기
실제 서비스의 플로우를 Codex에 리팩터링해 달라고 요청하기 전에 다음 WWDC25 세션을 참고하세요.
마이그레이션 계획을 요청한 뒤 일부부터 구현하기
Liquid Glass 마이그레이션은 Codex에 “어디에 글래스 효과를 적용하면 좋을까?”라고 묻는 단계와 “이제 코드를 모두 작성해 줘”라고 요청하는 단계를 나누면 더 수월합니다. 먼저 간단한 점검을 요청하세요. 그런 다음 독립적으로 구현할 수 있는 부분 하나를 에이전트에 맡기고, 구현 결과까지 시뮬레이터에서 검증해 달라고 요청하세요.
실전 팁
글래스 효과는 필요한 곳에만 적용하기
Liquid Glass의 역할은 콘텐츠 위에 컨트롤을 명확히 구분해 표시하는 것입니다. 모든 카드를 빛나는 패널로 바꿀 필요는 없습니다. Codex에 시스템 재질과 어울리지 않는 장식용 배경을 제거하고, 가독성이 중요한 콘텐츠는 단순하게 유지하며, 색조는 의미를 강조하거나 주요 동작을 표시할 때만 사용해 달라고 요청하세요.
자주 사용하는 플로우 하나부터 시작하기
처음에는 앱 전체를 한꺼번에 마이그레이션하기보다 탭의 루트 화면, 상세 화면, 시트, 검색 UI, 온보딩 플로우 중 하나를 선택하는 편이 좋습니다. 이렇게 하면 변경 사항을 검토하기 쉽고, Liquid Glass를 적용한 방식 중 어떤 것을 재사용 가능한 컴포넌트 패턴으로 만들지도 분명해집니다.
대체 구현의 동작 확인하기
최소 배포 대상 버전이 iOS 26보다 낮다면 Codex에 대체 구현과 Liquid Glass 구현을 나란히 보여 달라고 요청하세요. 두 구현을 함께 검토하면 이전 버전에서 사용할 수 없는 API를 실수로 호출하는 문제를 발견하고, 최신 시뮬레이터에서만 동작하는 변경 사항을 배포하는 일을 피할 수 있습니다.
Tech stack
Need
Default options
Why it's needed
Need
기준 플랫폼
Default options
iOS 26 및 Xcode 26
Why it's needed
Liquid Glass는 iOS 26 SDK부터 제공됩니다. Codex는 Xcode 26으로 앱을 컴파일하고 이전 OS 버전에서 대체 UI를 사용하도록 코드에 명시해야 합니다.
Need
시뮬레이터 검증
Default options
Why it's needed
UI를 마이그레이션할 때는 앱을 빌드하고 실행해 스크린샷을 찍고 로그를 확인하는 과정이 중요합니다. 다양한 화면 크기에서 여러 UI 상태를 검토할 때 특히 유용합니다.
| Need | Default options | Why it's needed |
|---|---|---|
| Liquid Glass UI API | SwiftUI 의 glassEffect , GlassEffectContainer , 글래스 버튼 스타일 | 이 스킬에서는 이러한 네이티브 API를 우선 사용해야 합니다. 그러면 Codex가 머티리얼 시스템을 따로 구현할 필요 없이 커스텀 블러 레이어를 제거할 수 있습니다. |
| 기준 플랫폼 | iOS 26 및 Xcode 26 | Liquid Glass는 iOS 26 SDK부터 제공됩니다. Codex는 Xcode 26으로 앱을 컴파일하고 이전 OS 버전에서 대체 UI를 사용하도록 코드에 명시해야 합니다. |
| 시뮬레이터 검증 | XcodeBuildMCP | UI를 마이그레이션할 때는 앱을 빌드하고 실행해 스크린샷을 찍고 로그를 확인하는 과정이 중요합니다. 다양한 화면 크기에서 여러 UI 상태를 검토할 때 특히 유용합니다. |
Related use cases
iOS 앱에 App Intents 추가하기
Codex와 Build iOS Apps 플러그인으로 App Intents를 통해 제공할 동작과 엔티티를 정하고, 단축어와 Spotlight 같은 시스템 기능에 연결하세요
iOS Code
iOS 시뮬레이터에서 디버깅하기
Codex로 적절한 Xcode 스킴과 시뮬레이터를 찾아 앱을 실행하세요. Codex는 UI 트리를 확인하고 탭, 텍스트 입력, 스와이프로 버그를 재현합니다. 버그...
iOS Code
iOS 앱 개발
Codex로 iOS용 SwiftUI 프로젝트의 기본 구조를 만들고, `xcodebuild`나 Tuist로 CLI에서 빌드를 반복하세요
iOS Code