#!wiki
[[Apple|[[파일:Apple 로고 화이트.svg|height=40]]]]
- [ 펼치기 · 접기 ]
- ||<-4><tablewidth=100%><tablebgcolor=transparent><bgcolor=#333>하드웨어 제품
#!wiki class="element" [[Mac(컴퓨터)|[[파일:Mac 심볼.svg|width=80&theme=light]][[파일:Mac 심볼 다크.svg|width=80&theme=dark]][br]{{{#333,#ddd Mac}}}]]#!wiki class="element" [[iPhone|[[파일:iPhone 15 Pro 심볼.svg|width=25&theme=light]][[파일:iPhone 15 Pro 심볼 화이트.svg|width=25&theme=dark]][br]{{{#333,#ddd iPhone}}}]]#!wiki class="element" [[iPad|[[파일:iPad Pro 아이콘 라이트.svg|width=40&theme=light]][[파일:iPad Pro 아이콘 다크.svg|width=40&theme=dark]][br]{{{#333,#ddd iPad}}}]]#!wiki class="element" [[틀:Apple 디스플레이 라인업|[[파일:Pro Display XDR 심볼(1).svg|width=55&theme=light]][[파일:Pro Display XDR 심볼 화이트.svg|width=55&theme=dark]][br]{{{#333,#ddd Display}}}]]#!wiki class="element" [[Apple Watch|[[파일:Apple Watch 심볼.svg|width=22&theme=light]][[파일:Apple Watch 심볼 다크.svg|width=22&theme=dark]][br]{{{#333,#ddd Watch}}}]]#!wiki class="element" [[AirPods|[[파일:AirPods Pro 심볼.svg|width=45&theme=light]][[파일:AirPods Pro 심볼 화이트.svg|width=45&theme=dark]][br]{{{#333,#ddd AirPods}}}]]#!wiki class="element" [[Apple TV|[[파일:Apple TV 4K 3rd 심볼.svg|width=42&theme=light]][[파일:Apple TV 심볼 다크.svg|width=42&theme=dark]][br]{{{#333,#ddd TV}}}]]#!wiki class="element" [[HomePod|[[파일:HomePod 2세대 심볼.svg|width=60&theme=light]][[파일:HomePod 2세대 심볼 화이트.svg|width=60&theme=dark]][br]{{{#333,#ddd HomePod}}}]]#!wiki class="element" [[Apple Vision|[[파일:Vision 심볼.svg|width=60&theme=light]][[파일:Vision 심볼 화이트.svg|width=60&theme=dark]] [br]{{{#333,#ddd Vision}}}]]#!wiki class="element" [[AirTag|[[파일:AirTag 심볼.svg|width=50&theme=light]][[파일:AirTag 심볼 다크.svg|width=50&theme=dark]][br]{{{#333,#ddd AirTag}}}]]#!wiki class="element" [[Apple/액세서리|[[파일:Magic Keyboard 심볼.svg|width=63&theme=light]][[파일:Magic Keyboard 심볼 화이트.svg|width=63&theme=dark]][br]{{{#333,#ddd 액세서리}}}]]#!wiki class="element" [[Apple Silicon|[[파일:Apple Silicon 심볼.svg|width=35&theme=light]][[파일:Apple Silicon 심볼 화이트.svg|width=35&theme=dark]][br]{{{#333,#ddd Silicon}}}]]기타 단종 제품군｜Apple Car｜스티커｜ 소프트웨어 <colbgcolor=#333><colcolor=#fff>OS iOS ｜ iPadOS ｜ watchOS ｜ macOS ｜ tvOS ｜ visionOS App iOS 앱 ｜ Watch 페이스 AI MLX ｜ Apple Intelligence ｜ OpenELM 디자인 시스템 Aqua ｜ Liquid Glass 서비스 프로그램 Apple Trade In ｜ AppleCare+ ｜ Apple 베타 소프트웨어 프로그램 이벤트 Apple 이벤트 ｜ WWDC Apple Store 한국 ｜ 미국 ｜ 일본 ｜ 영국 ｜ 싱가포르 ｜ 태국 ｜ 인도 ｜ 대만 결제 및 구독 Apple One ｜ Apple Pay ｜ Apple Gift Card 캠퍼스 쿠퍼티노 Campus ｜ Apple Park 오스틴 Riata Vista Circle ｜ Austin Campus 관계사 자회사 Beats ｜ Shazam 인물 창업주 CEO 이사회 의장 경영진 이사진 기타
#!style
.element {
display: flex;
width: min(calc(100% / 4), 100px);
height: 95px;
padding-bottom: 5px;
border-radius: min(10px, 1.5vw);
background: #f5f5f7;
flex-grow: 1;
justify-content: center;
align-items: flex-end;
}
@theseed-dark-mode {
.element {
background: #272829;
}
}
1. 개요
| Introducing Liquid Glass |
|
Apple이 WWDC25에서 공개한 새로운 디자인 언어이자 iOS 26, iPadOS 26, macOS Tahoe, watchOS 26, tvOS 26부터 적용된 그래픽 사용자 인터페이스.
2. 특징
과거 Mac OS X의 Aqua 이후 최초로 별도의 이름이 붙은 디자인 시스템이다. 빛의 반사, 투명한 텍스처와 물방울 같은 유동적인 움직임 등 역시 Aqua가 연상되는 부분이다.visionOS의 물리적인 존재감과 풍부함에서 영감을 받아 디지털 소재가 자연스럽고 살아있는 것처럼 느껴지는데에 집중했다고 한다. 실제로 유리(Glass) 소재로 표현한 요소에 빛의 반사와 굴절 등 여러 광학적인 효과들을 실제 유리처럼 구현하여, 단순히 블러 효과만 씌우는 기존의 글래스모피즘을 한 차원 진화시켰다.[1] 여기에 Dynamic Island에서 보여준 역동적으로 움직이는 애니메이션이 합쳐져 입력에 따라 형태가 액체가 흐르듯 부드럽게, 자유자재로 변하는 모습을 볼 수 있다.
유리 질감을 내세우는 글래스모피즘을 채택했다는 점에서 2000년대의 OS[2]들과 일맥상통하는 부분이 어느 정도 있다. 다만 Liquid Glass는 스큐모어피즘이 아닌 뉴모어피즘 사상에 기반을 둔 디자인이라는 점에서 과거 글래스모피즘 디자인들과는 다소 다른 뉘앙스를 가진다. 대표적으로 각종 UI 요소의 형태가 입력에 따라 물방울처럼 역동적으로 변화한다는 차이점이 있다.
흥미로운 점이라면 Liquid Glass는 더 최신 디자인인만큼 2020년대의 높은 하드웨어 성능을 바탕으로 광학 효과에서는 오히려 훨씬 더 뛰어난 현실감을 보인다는 것이다. 기기의 물리적인 움직임이나 UI 요소의 움직임에 따라 빛의 반사/굴절투과 등의 효과가 모두 실시간으로 구현되어 있다.
버튼, 스위치, 슬라이더, 텍스트, 미디어 제어, 탭 막대, 사이드바와 같은 요소와, 잠금 화면, 홈 화면, 알림, 제어 센터 등에도 모두 통합적으로 적용된다. 설정하기에 따라서 홈 화면 아이콘도 투명하게 처리할 수 있다.
그러나 투명 효과가 강할수록 시인성이 낮아지는 문제가 있다 보니 사용하기 불편하다는 지적을 받기도 한다. 설정 앱에서 투명도 줄이기 옵션을 켜거나[3], 마이너 업데이트로 새롭게 추가된 불투명도를 높인 틴트 옵션을 선택하면 된다.[4]
ITU-R BT.2100 표준에 대응하여 HDR 휘도 범위인 최대 350니트 (nits, cd/m2)로 출력된다. #
3. Icon Composer
#!if (문단 == null) == (앵커 == null)
를#!if 문단 != null & 앵커 == null
의 [[Icon Composer#s-|]]번 문단을#!if 문단 == null & 앵커 != null
의 [[Icon Composer#|]] 부분을Liquid Glass의 입체감 있는 앱 아이콘 디자인을 위해 Apple이 개발한 그래픽 소프트웨어이다.
4. 기타
- UI 디자인 툴 Figma에서도 2025년 7월 18일 Apple 기기를 위한 공식 iOS 26 UI 키트를 공개하면서 '유리' 효과를 지원하기 시작했다.
| <nopad> |
- Apple이 이번 업데이트로 UI 디자인의 새로운 방향을 제시하였으나 이것이 개발자들의 선택을 받고 보편화될 수 있을지에 대해서는 회의적인 시각이 많다.[5] 가장 큰 이유는 보편성이 떨어지기 때문이다. 플랫 디자인이 오랜 기간 UI 디자인의 표준으로 군림할 수 있었던 이유 중 하나가 범용성인데, iOS를 포함하여 거의 모든 플랫폼에서 위화감 없이 통일된 디자인을 구현할 수 있기 때문이다. 하지만 Liquid Glass는 사실상 Apple만이 구현할 수 있는 독점적 디자인 시스템이고[6] Liquid Glass 디자인을 도입하려면 Apple 플랫폼만을 위한 디자인을 따로 만들어야 한다. 게다가 Flutter, Electron 같은 UI 프레임워크를 사용한다면 아래의 사진처럼 iOS와 macOS 환경에서도 Liquid Glass를 사용할 수 없다.
- 웹에서도 굴절을 활용한 방식이 흔하지 않았던 만큼 다양한 방식으로 구현되었는데, 보통 SVG API의 displacement maps와 같은 방식을 사용해 구현한다. 빛이 굴절되는 방식을 쉽게 볼 수 있는 블로그 글(영어)
5. 관련 문서
[1] Apple의 하드웨어, 칩, 그래픽 기술이 비약적으로 발전하여 이런 광학적 효과들을 구현할 수 있는 기회가 주어졌다고 영상에서 설명한다.[2] Wii U의 운영체제, Mac OS X의 Aqua, Windows Vista 및 Windows 7의 Aero Glass[3] 설정 앱에 들어가 손쉬운 사용 메뉴에 들어가서 디스플레이 및 텍스트 크기 탭에 들어가면 투명도 줄이기 옵션을 켤 수 있다.[4] 설정 앱에 들어가 디스플레이 및 밝기 메뉴를 누른 뒤 Liquid Glass 탭이 있다. 기본 적용된 투명 옵션과 불투명도를 높인 틴트 옵션 중 하나를 선택할 수 있다.[5] 유사한 사례로 iOS 6의 스큐어모피즘 디자인에서 iOS 7의 급진적인 플랫 디자인으로 넘어갈 때를 들 수 있다. 당시에는 반발이 굉장했다.[6] 다른 플랫폼에서도 비슷하게 따라할 수는 있지만 똑같이 구현하기는 어렵고, 특히 웹 환경의 경우 렌더링 구조의 차이에서 기인하는 엄청난 비효율성 때문에 실용성이 없다.