[iOS] 2022 New HIG Playing video 공식문서 정리 - Lawn

Lawn·2022년 9월 11일
1
post-thumbnail

안녕하세요 🌱 Lawn입니다 새롭게 바뀐 2022년 NEW HIG를 Study를 통해 공부하며 정리하는 중입니다.

🎈 HIG Study with

👨🏻‍💻 Halgen
👩‍💻 Dana


🌱 Playing video

사람들은 사용 중인 앱이나 게임에 관계없이 기기에서 풍부한 비디오 경험을 즐기기를 기대합니다.

시스템은 iOS, iPadOS, macOS 및 tvOS의 앱 또는 게임에 재생 경험을 포함하는 데 사용할 수 있도록 설계된 비디오 플레이어를 제공합니다. 또한 이러한 플랫폼에서 TV 앱을 통해 콘텐츠를 제공할 수 있으므로 사람들에게 편리하고 일관된 시청 경험을 제공할 수 있습니다.

시스템 제공 비디오 플레이어는 다양한 종횡비 재생 모드와 PiP(Picture-in-Picture) 보기 모드를 지원합니다. 사람들은 재생 중에 모드를 전환할 수 있지만 기본적으로 시스템은 비디오의 종횡비에 따라 다음 재생 모드 중 하나를 선택합니다.

  • 전체 화면 또는 가로 세로 채우기 모드에서 비디오는 디스플레이를 채우도록 크기가 조정되고 일부 가장자리 잘림이 발생할 수 있습니다. 이 모드는 와이드 비디오(2:1 ~ 2.40:1)의 기본값입니다.

  • 화면에 맞춤(또는 화면비) 모드에서는 전체 비디오가 화면에 표시되며 필요에 따라 레터박스 또는 필라박스가 발생합니다. 이 모드는 표준 비디오(4:3, 16:9 및 최대 2:1) 및 울트라와이드 비디오(2.40:1 이상)의 기본값입니다.

🧑🏻‍💻 Developer guidance
resizeAspectFill
resizeAspect

tvOS에서 내장 비디오 플레이어는 자막 켜기 또는 오디오 언어 변경과 같은 재생 작업과 라이브러리에 프로그램 추가 또는 클립 즐겨찾기와 같은 작업을 수행할 수 있는 전송 막대 컨트롤 도 제공합니다. 비디오 플레이어는 전송 표시줄 아래에 정보, 에피소드 또는 챕터와 같은 콘텐츠 탭 을 표시하여 지원 정보를 제공하고 탐색을 간소화하는 데 도움을 줍니다.


🍀 Best practices

시스템 비디오 플레이어를 사용하여 사람들에게 친숙하고 편리한 경험을 제공하십시오. 내장된 비디오 플레이어는 사람들이 몰입형 콘텐츠를 즐기는 데 집중할 수 있도록 일관된 상호 작용과 동작을 제공하는 탁월한 비디오 재생 경험을 제공합니다. 앱에 사용자 지정 비디오 플레이어가 필요한 경우 시스템 비디오 플레이어의 동작과 인터페이스를 참조하여 사람들이 즉시 이해할 수 있는 경험을 제공할 수 있습니다. 시스템 제공 경험과 약간 다른 사용자 지정 경험은 사람들이 습관적인 상호 작용 중 일부에 의존할 수 있지만 전부는 아니기 때문에 좌절감을 유발할 수 있습니다.

비디오 콘텐츠를 항상 원래의 종횡비로 표시하십시오. 비디오 콘텐츠가 특정 종횡비를 준수하기 위해 포함된 레터박스 또는 필러박스 패딩을 사용하는 경우 시스템은 현재 재생 모드를 기반으로 비디오의 크기를 올바르게 조정하지 못할 수 있습니다. 비디오 프레임에 포함된 패딩으로 인해 전체 화면 및 화면 맞춤 모드에서 비디오가 더 작게 나타날 수 있습니다. 또한 iPad 의 Picture in Picture 모드 와 같이 전체 화면이 아닌 전체 화면 컨텍스트에서 비디오가 올바르게 표시되지 않도록 합니다 .

다음은 패딩이 iPhone X의 비디오 디스플레이에 어떤 영향을 미칠 수 있는지 보여주는 몇 가지 예입니다.

가치를 더할 때 추가 정보를 제공하십시오. iOS, iPadOS 및 tvOS에서 이미지, 제목, 설명 및 기타 유용한 정보를 제공하여 비디오의 추가 정보를 사용자화할 수 있습니다. 일반적으로 미디어 재생을 방해하지 않도록 이 콘텐츠를 제한합니다.

🧑🏻‍💻 Developer guidance
externalMetadata

재생을 제어하는데 사용하는 장치에 관계없이 사람들이 기대하는 상호 작용을 활성화합니다. 예를 들어 사람들은 연결된 키보드에서 스페이스바를 눌러 Mac, iPhone, iPad 및 Apple TV에서 미디어 재생을 재생하거나 일시 중지할 것으로 기대합니다. 마찬가지로 사람들은 Siri Remote로 친숙하고 직관적인 제스처를 사용하여 Apple TV에서 미디어를 통해 이동할 수 있기를 기대합니다. 지침은 키보드 및 리모컨을 참조하십시오.

사람들이 tvOS 앱에서 재생 옵션 또는 콘텐츠별 정보에 액세스해야 하는 경우 전송 컨트롤 또는 사용자 지정 콘텐츠 탭을 추가하는 것을 고려하세요. 사람들은 일반적으로 비디오를 시청하는 동안 전송 컨트롤 또는 콘텐츠 탭을 열므로 가장 유용한 작업과 정보만 제공하는 것이 중요합니다. 작업이 한두 단계 이상 걸리지 않도록 하고 콘텐츠를 간결하게 하여 사람들이 시청 환경으로 빠르게 돌아갈 수 있도록 하세요. 동영상 즐겨찾기와 같은 재생 관련 작업을 활성화하려면 전송 컨트롤을 사용하세요. 사용자 지정 콘텐츠 탭을 사용하여 추가 정보 또는 권장 사항을 표시합니다.

시청자가 전체 화면 모드와 PiP 모드 간에 전환할 때 다른 소스의 오디오가 혼합되지 않도록 하십시오. 혼합 오디오는 불쾌하고 실망스러운 사용자 경험입니다. 일반적으로 오디오 소스 중 하나 이상이 보조 오디오를 올바르게 처리하지 못하는 경우 오디오가 혼합됩니다. 일반적인 시나리오는 다음과 같습니다. 전체 화면 비디오를 시청하는 동안 시청자가 해당 비디오를 PiP 창으로 이동하면 시스템이 자동으로 비디오를 음소거합니다. 전체 화면 창에서 시청자는 배경 음악을 재생하는 게임을 시작한 다음 PiP 창으로 전환하고 비디오 음소거를 해제합니다. 게임에서 보조 오디오를 적절하게 처리하지 않으면 해당 오디오가 음소거 해제된 비디오의 오디오와 혼합됩니다.

🧑🏻‍💻 Developer guidance
silenceSecondaryAudioHintNotification


🍀 Integrating with the TV app

TV 앱은 시스템 전체에서 즐겨찾기, 최근 재생 및 추천 비디오 콘텐츠에 대한 전역 액세스를 제공합니다. 사람들이 앱 내에서 콘텐츠 재생을 시작하면 TV 앱이 자동으로 앱을 열고 앱으로 전환합니다. TV 앱 경험이 앱의 통합된 부분처럼 느껴지도록 하려면 다음 지침을 따르세요.

앱으로 원활하게 전환하세요. TV 앱은 앱으로 전환할 때 검은색으로 희미해지고 앱의 시작 화면이 표시되지 않습니다. 콘텐츠를 재생하거나 다시 시작하기 전에 즉시 자신의 검은 화면을 표시하여 이 전환으로 시각적 연속성을 유지하십시오.

예상되는 내용을 즉시 보여주십시오. 사람들은 특히 재생을 재개할 때 앱으로의 전환이 완료되는 즉시 재생을 시작하기로 선택한 콘텐츠를 기대합니다. 앱의 검은 화면에서 콘텐츠로 바로 이동하고 시작 화면, 세부 정보 화면, 소개 애니메이션 또는 콘텐츠에 도달하는 데 더 오래 걸리는 기타 장벽을 표시하지 마십시오. 선택한 미디어를 재생하기 전에 삽입 요소를 표시해야 하는 드문 상황에서 사람들은 선택을 선택하여 요소를 단계별로 실행하거나 삽입 콘텐츠를 건너뛰고 재생을 시작하려는 경우 재생을 선택할 수 있습니다.

사람들에게 재생을 재개할 것인지 묻지 마십시오. 재생을 재개할 수 있는 경우 확인 메시지 없이 자동으로 재개하십시오.

사람들이 연결된 블루투스 키보드에서 스페이스바를 누르면 재생을 재생하거나 일시 중지합니다. 스페이스바를 눌러 미디어 재생을 제어하는것은 사용 중인 키보드에 관계없이 사람들이 기대하는 상호 작용입니다.

콘텐츠가 올바른 뷰어에 대해 재생되는지 확인합니다. 앱이 여러 사용자 프로필을 지원하는 경우 TV 앱은 재생 요청을 실행할 때 프로필을 지정할 수 있습니다. 재생을 시작하기 전에 앱이 자동으로 이 프로필로 전환되도록 합니다. 재생 요청에 프로필이 지정되지 않은 경우 나중에 이 정보를 제공할 수 있도록 재생을 시작하기 전에 시청자에게 프로필을 선택하도록 요청하세요.

긴 비디오 클립의 재생을 재개할 때 이전 종료 시간을 사용하십시오. 이전 중지 지점에서 재생을 재개하면 사람들이 중단한 부분부터 빠르게 계속할 수 있습니다.


🍀 Loading content

가능하면 로딩 화면을 표시하지 마십시오. 콘텐츠가 빠르게 로드되는 경우 로드 화면이 필요하지 않지만 로드하는 데 2초 이상 걸리는 경우 활동 스피너가 중앙에 있고 주변 콘텐츠가 없는 검은색 로드 화면을 표시하는 것이 좋습니다.

즉시 재생을 시작합니다. 로딩 화면을 표시해야 하는 경우 재생을 시작하기에 충분한 콘텐츠가 로드될 때까지만 표시하십시오. 백그라운드에서 나머지 콘텐츠를 계속 로드합니다.

로딩 화면 콘텐츠를 최소화합니다. 로딩 화면에 브랜딩이나 이미지를 포함하는 경우 재생으로 원활하게 전환할 수 있도록 검은색 배경을 유지하면서 최소한으로 포함합니다.


🍀 Exiting playback

재생을 종료한 후 사람들은 TV 앱으로 돌아가지 않고 앱에 남아 있으므로 사람들이 방향을 잃지 않도록 하는 것이 좋습니다.

상황에 맞는 화면을 표시합니다. 재생을 종료할 때 시청자가 방금 보고 있던 콘텐츠에 대한 세부 정보 화면을 표시하고 재생을 재개하는 옵션을 포함합니다. 세부 정보 화면을 사용할 수 없는 경우 이 콘텐츠를 나열하는 메뉴나 앱의 기본 메뉴를 표시하세요.

즉시 퇴장할 준비를 하십시오. 재생 알림을 받은 후 가능한 한 빨리 종료 화면을 준비하여 재생 시작 직후 사람들이 나갈 경우 화면을 표시할 수 있도록 준비합니다.


📱 Platform considerations

No additional considerations for iOS, iPadOS, or macOS.

tvOS

비디오 위에 로고 또는 비대화형 오버레이를 표시할 때 콘텐츠를 따릅니다. 작고 눈에 잘 띄지 않는 로고나 카운트다운 타이머가 비디오에 적합할 수 있지만 시청 경험을 향상시키지 않는 크고 산만한 오버레이는 피하십시오. 또한 일부 장치는 이미지 잔상이 발생하기 쉽기 때문에 일반적으로 오버레이를 짧게 유지하고 밝고 불투명한 콘텐츠보다 표준 동적 범위(SDR)의 반투명 그래픽을 선호하는 것이 좋습니다.

대화형 오버레이를 우아하게 표시합니다. 일부 비디오에는 퀴즈, 설문조사, 진행 상황 확인과 같은 대화형 오버레이가 표시됩니다. 최상의 사용자 경험을 위해 최소 0.5초 지연을 구현하여 미디어 재생을 일시 중지하고 대화형 오버레이를 표시합니다. 사람들에게 오버레이를 닫고 상호 작용을 마친 후 미디어 재생을 재개할 수 있는 명확한 방법을 제공하세요.

watchOS

watchOS에서 시스템은 비디오 재생을 관리합니다. 앱이 활성화되어 포그라운드에서 실행되는 동안 앱은 짧은 비디오 클립을 재생할 수 있습니다. 영화 요소를 사용하여 인터페이스에 클립을 포함하고 비디오 인라인을 재생하거나 별도의 인터페이스에서 클립을 재생할 수 있습니다.

🧑🏻‍💻 Developer guidance
VideoPlayer

비디오 클립을 짧게 유지하십시오. 30초 이하의 짧은 클립을 선호합니다. 긴 클립은 더 많은 디스크 공간을 소비하고 사람들이 더 오랜 시간 동안 손목을 들어 올려야 하므로 피로를 유발할 수 있습니다.

미디어 자산에 권장되는 크기와 인코딩 값을 사용하세요. 특히 성능에 영향을 미치고 최적의 모습이 아닌 비디오 클립의 크기를 조정하지 마십시오. 다음 표에는 비디오 자산에 대한 권장 인코딩 및 해상도 값이 나와 있습니다. 오디오 인코딩 값은 영화와 오디오 전용 자산 모두에 적용됩니다.

기인하다
비디오 코덱H.264 하이 프로파일
비디오 비트 전송률최대 30fps에서 160kbps
해상도(전체 화면)208px × 260px(세로 방향)
해상도(16:9)320px × 180px(가로 방향)
오디오64kbps HE-AAC

시스템 컨트롤처럼 보이는 포스터 이미지를 만들지 마십시오. 사람들이 재생을 위해 영화 요소를 탭할 수 있다는 것을 이해하기를 원합니다. 영화 요소를 다른 것처럼 보이게 하여 사람들을 혼란스럽게 하고 싶지 않습니다.

비디오 클립의 내용을 나타내는 포스터 이미지를 만드는 것이 좋습니다. 사람들이 포스터 이미지를 탭하면 시스템이 이미지를 비디오로 교체하고 인라인 재생을 시작합니다. 관련 포스터 이미지는 사람들이 동영상을 볼지 여부를 정보에 입각한 결정을 내리는 데 도움이 될 수 있습니다. 일반적으로 내용과 관련이 없거나 사람들이 컨트롤로 오인할 수 있는 포스터 이미지를 만들지 마십시오.


📚 Resources

Related
Playing audio
Feedback

Developer documentation
AVKit
HTTP Live Streaming

📀 Videos

WWDC22 - Create a great video playback experience
WWDC21- Deliver a great playback experience on tvOS
WWDC20 - Master Picture in Picture on tvOS

profile
안녕하세요 글쓰는 🌱풀떼기 입니다.

0개의 댓글