스트리밍은 대부분의 브라우저와
Developer 앱에서 사용할 수 있습니다.
-
watchOS 10 만나보기
새롭게 디자인된 사용자 인터페이스와 새로운 스마트 스택을 살펴보며 Apple Watch 출시 이래 가장 큰 변화를 알아봅니다. Apple의 디자이너들이 watchOS 10 디자인 작업에 어떤 방식으로 접근했는지 알아보고, 레이아웃, 내비게이션, 시각적 스타일을 탐구한 뒤 이러한 기능을 적용해 멋진 Apple Watch 앱을 만드는 방법을 알아봅니다.
챕터
- 1:40 - Design principles of watchOS 10
- 2:49 - Layout system of controls, labels and content
- 3:36 - Background colors and content
- 4:28 - Materials
- 5:03 - Navigation patterns
- 9:02 - Wrap up
리소스
관련 비디오
WWDC23
-
다운로드
♪ ♪
안녕하세요 제 이름은 Taylor입니다 Apple 디자인 팀의 디자이너죠 8년 전 Apple Watch를 출시한 이후 가장 크게 변화한 watchOS 10을 소개하게 되어 정말 기쁩니다 이번 세션에서는 watchOS 10의 새로운 소식과 Apple 디자인 팀이 앱과 시스템을 설계하는 접근 방식을 소개하고 이러한 설계 패턴을 적용하여 여러분의 Apple Watch 앱을 만드는 법을 다룰 겁니다 그럼 시작하죠 2014년에 출시한 Apple Watch는 Apple의 가장 개인적인 제품이었죠 늘 여러분과 함께하며 몸에 착용합니다 이를 고려하여 Apple Watch를 설계할 때 케이스 소재, 밴드, 시계 페이스의 다양한 스타일을 제공하려고 했죠
Apple Watch Ultra의 출시로 지구의 극한 조건에서도 동반자 역할을 합니다 손목에 차는 기기의 독특한 제약인 상대적으로 작은 디스플레이와 입력 기능의 제한 짧은 상호작용 시간으로 인해 새로 개발한 조작 장치인 Digital Crown이 있으며 앱을 설계할 때 한눈에 볼 수 있도록 하고 실행성과 반응성을 고려했죠 이후로 Apple Watch는 많이 진화했습니다 디스플레이가 커지고 밝아지고 케이스의 곡선을 따라 빈틈없는 일체형으로 통합했죠 Apple Watch의 셀룰러 연결성으로 기능이 더욱 많아졌고 새로운 건강 센서와 상시표시형 디스플레이 전체 기능을 갖춘 앱이 있습니다 watchOS 10을 통해 완벽히 새로운 UI를 장착한 Apple Watch는 현대적이고 밝은 디스플레이를 최대한 이용하는 고성능 통신 하드웨어입니다 watchOS 10은 시의적절하게 관련 위젯을 시계 페이스에 띄우며 Digital Crown을 통해 불러올 수 있죠 홈 화면은 더 쉽게 탐색할 수 있습니다 Digital Crown을 돌려 앱 목록을 수직으로 이동할 수 있죠 측면 버튼을 한 번 클릭하면 어디서든 제어 센터가 열리며 두 번 클릭하면 지갑이 열립니다 모든 앱을 재설계할 때의 기준은 한눈에 명확히 볼 수 있도록 하고 컨트롤과 탐색 기능을 일관되게 배치하는 거였죠 watchOS 10을 설계할 때 명확한 설계 원칙을 중심으로 엄격하고 체계적인 설계 절차를 따랐으며 여러분의 앱에도 이러한 원칙을 적용할 수 있습니다 Apple Watch 앱은 하나의 기능에 집중하고 사용자에게 전문화된 기능을 제공해야 합니다 화면을 설계할 때 최적화 기준은 한눈에 알아보도록 하는 것과 짧은 상호작용 시간입니다 컨트롤과 탐색은 명확하고 일관적이어야 하죠 오리지널 Apple Watch에 비해 Apple Watch Series 8과 Apple Watch Ultra는 디스플레이가 더 크고 둥급니다 앱을 설계할 때 탐색의 일관성을 주고 한눈에 알아볼 수 있도록 레이아웃 접근 방식을 재정립하여 앱 설계에 도움이 되도록 했죠 새로운 시스템은 디스플레이 모양을 바탕으로 크기와 컨트롤, 레이블, 콘텐츠의 배치를 정의하여 앱 레이아웃이 일관적이고 조작이 명확하고 인체공학적이죠 서로 다른 콘텐츠를 수용할 수 있도록 3개의 기본 레이아웃을 설계했습니다 다이얼, 인포그래픽 그리고 목록이죠 모든 레이아웃은 watchOS 10이 지원하는 다양한 Apple Watch 크기에 자동으로 조정됩니다 watchOS 10의 앱이 배경 콘텐츠를 세심하게 활용하여 제공하는 추가 정보는 세계 시계의 시각이나 날씨의 현재 상황 특정 기업 주가의 상승, 하락 추이죠 예를 들어 활동 앱에서 움직이기, 운동하기, 일어서기의 활동 링을 보여 주는 인포그래픽 화면의 경우 지금 보고 있는 링의 색에 맞춰 배경의 색이 바뀝니다 배경 색을 이용하여 사용자들이 사용 중인 앱의 탐색이나 인지를 돕는 도구로 사용하세요 watchOS 10의 배경 콘텐츠는 추가적인 효용을 제공하는 부수적인 역할을 제공해야 하며 멋진 비주얼에 불과하면 안 됩니다 배경 콘텐츠는 간단한 색이나 그러데이션일 수도 있고 추가 정보를 전달하는 애니메이션일 수도 있죠 색을 사용하여 앱을 이용하는 사람들이 현재 상황을 이해할 수 있도록 하세요
배경 콘텐츠와 함께 watchOS 10은 전체 시스템에 새로운 기능과 소재를 추가했습니다 명확하고 기능적인 레이어가 투명도로 상하 관계를 정립하고 사용자가 시스템과 앱의 현재 위치를 알 수 있게 하죠 새로운 소재는 콘텐츠 공간을 최대화하면서 상태 막대 등의 시스템 요소 아래 콘텐츠를 스크롤 해도 알아볼 수 있도록 합니다 또한 의미가 담긴 시스템 색을 사용하는 요소는 다채로운 배경 소재에 따라 자동으로 대비를 조정합니다 watchOS 10은 새로운 탐색 패턴을 소개하죠 수직 페이징, Source List 개선된 계층적 탐색은 쉽고 일관된 앱의 탐색을 돕습니다 Digital Crown은 우리가 설계한 독특한 입력 메커니즘으로 작은 제품의 필요에 부응하고 손가락으로 디스플레이를 가리지 않고 탐색할 수 있죠 watchOS 10의 Digital Crown은 앱으로 이동할 수 있으며 앱의 내부도 탐색할 수 있습니다 Mail과 같은 목록형 화면에서는 Digital Crown을 돌려서 메일 상자 목록이나 메시지를 수직으로 스크롤할 수 있죠 탭이 여러 개인 앱을 위해 watchOS 10에서 새로운 탐색 패턴인 수직 페이징을 도입합니다 활동 앱에서는 Digital Crown을 사용하여 활동 링 개요와 움직이기, 운동하기, 일어서기의 개별 인포그래픽을 넘나들 수 있죠 수직 페이징은 앱에 있는 독립된 정보를 의미 있는 화면으로 분리하는 좋은 방법입니다 페이지 표시는 Digital Crown과 연동돼 있으며 모든 배경에 맞춰 눈에 띄도록 설계했죠 때로는 설계의 요소가 여러 페이지에 걸쳐 나타납니다 활동 앱의 활동 링이나 스톱워치의 다이얼이 그렇죠 페이지를 넘나들 때 크기, 배치, 정보 밀도를 조절하여 요소가 부드럽게 움직이도록 하고 해당 요소를 추가하지 마세요 사용자가 전체 화면의 콘텐츠를 넘길 때 지속해서 나타나는 요소가 시각적인 안정성을 줍니다 일반적으로는 한 페이지의 콘텐츠를 단일 화면 높이로 제한하는 것을 권장하죠 이러한 제약을 지키면 각 페이지가 명확하고 확실한 목적을 달성하여 한눈에 알아볼 수 있습니다 하지만 화면의 높이 이상으로 콘텐츠를 확장해야 하는 사례가 있죠 하나의 예는 메시지인데 두 페이지로 구성돼 있죠 한 페이지는 고정된 메시지고 다른 페이지는 다른 사람이나 그룹 간 대화입니다 첫 번째 페이지는 높이가 고정되어 최대 9개의 대화를 고정할 수 있죠 두 번째 페이지는 활성화된 이후에 수직으로 스크롤되는 화면입니다 연락처에서는 연락처 카드의 첫 페이지가 자세한 사진과 주로 사용한 기능을 표시하죠 두 번째 페이지는 스크롤 화면으로 상대적으로 적게 사용하는 연락처 정보를 포함합니다 페이지 내의 스크롤 화면은 신중하게 사용할 것을 권장하며 높이가 고정된 페이지 이후에 배치하세요 가로형 페이징 대신 수직형 페이징을 사용하세요 가로형은 Apple Watch에서 탐색이 어렵죠 Digital Crown이 목록이나 페이지를 탐색할 필요가 없을 때는 앱 안의 데이터를 살펴볼 수 있는 환상적인 도구가 되죠 세계 시계에서는 Digital Crown을 돌리면 선택한 지역의 시간을 옮겨서 상대의 현재 시각과 여러 시각을 비교할 수 있습니다 세계 시계는 watchOS 10에서 Split View를 활용하여 Source List라는 새로운 탐색 패턴을 도입하죠 Source List 기반의 앱에서는 사용자가 같은 정보를 포함하는 여러 개체의 상세 화면을 탐색할 수 있습니다 이런 앱은 상세 화면으로 열리며 왼쪽 위에 있는 Source List 버튼을 탭하여 개체 사이를 이동할 수 있는데 세계 시계에서는 여러 장소로 이동할 수 있죠 기존의 계층적 탐색도 계속 지원하지만 신중하게 사용하여야 하며 여러분의 앱이 Source List를 기반으로 한 2단계 설계나 명확히 구분되는 수직 페이지로 설계할 수 없을 때만 사용하세요 설정과 Mail은 계층적 탐색이 적절한 앱입니다 watchOS 10은 계층적 탐색을 위한 새로운 애니메이션을 도입하여 사용자가 여러분 앱의 계층을 탐색할 때 어느 부분을 탐색하는지 명확하게 해 주죠 훌륭한 watchOS 10 앱은 한 기능에 집중하며 정보를 간결하게 전달하고 한눈에 파악할 수 있으며 짧은 상호작용에 최적화됐습니다 훌륭한 watchOS 10을 설계하기 위해서 앱의 기능에 집중하여 전문화하고 탐색은 가볍게 유지하며 표준 탐색 패턴을 사용하세요 최소의 화면으로 정보를 간결하게 전달하고 표준의 레이아웃, 컨트롤 레이블 크기 의미가 부여된 색깔과 소재를 사용하세요 watchOS 10을 위한 설계에 관해 더 자세히 알고 싶다면 'watchOS 10을 위한 앱 설계 및 개발'과 'watchOS 10으로 앱 업데이트하기'를 참고하세요 위젯과 스마트 스택에 관한 세션도 준비돼 있습니다 watchOS 10은 엄청난 노력이 들어간 프로젝트로 디자인 팀과 엔지니어 팀의 다양한 인력과 전문성을 요구했죠 이건 시작일 뿐입니다 여러분이 Apple Watch에 가져올 혁신을 기대하겠습니다 ♪ ♪
-
-
찾고 계신 콘텐츠가 있나요? 위에 주제를 입력하고 원하는 내용을 바로 검색해 보세요.
쿼리를 제출하는 중에 오류가 발생했습니다. 인터넷 연결을 확인하고 다시 시도해 주세요.