brunch

You can make anything
by writing

C.S.Lewis

by Lawn Feb 22. 2023

[HIG] Lockups

분리된 뷰를 결합한 락업

본 문서는 Apple의 Human Interface Guideline(이하 HIG) 문서를 한글로 번역한 것입니다. iOS 생태계 내에서 HIG를 읽으시는 분들이 번역본이 없어 불편함을 겪는 것을 알게 되었고, 이에 한글로 번역을 하게 되었습니다. iOS 커뮤니티 Async Swift에서 자율적으로 모인 9명이 함께 번역했으며, 일체의 상업적인 목적을 띄지 않습니다. 이 문서를 학습에 적극적으로 이용해 주시돼, 상업적인 용도로 이용하시는 것은 지양해 주시기 바랍니다. 감사합니다.


Introduction


락업(lockup)은 여러 개의 분리된 뷰를 상호작용하는 하나의 구성단위로 결합합니다. 


각각의 락업(lockup)은 콘텐츠 뷰(content view), 헤더(header), 푸터(footer)로 구성되어 있습니다. 헤더는 락업(lockup)의 주요 콘텐츠 위에 표시되고 푸터는 주요 콘텐츠 아래에 표시됩니다. 락업(lockup)이 선택되면 세 유형의 뷰는 함께 확장되거나 축소됩니다. 


앱의 필요에 따라 사람들은 카드(card), 캡션 버튼(caption button), 모노그램(monogram), 포스터(poster) 유형의 네 가지 락업(Lockup)을 사용할 수 있습니다.


Best Practices


락업(lockup) 사이에 공간을 충분히 주세요. 선택된 락업의 크기가 확장되면서 다른 락업에 겹쳐지거나 위치가 이동되는 것을 방지하기 위해 락업(lockup) 사이에 충분한 공간을 두세요. 자세한 내용은 Layout을 참고하세요.

행 또는 그룹 내에서 일관된 크기의 락업(lockup)을 사용하세요. 버튼 그룹이나 콘텐츠의 이미지는 모든 항목의 너비와 높이가 일치할 때 시각적으로 보기 좋습니다.


개발자 가이드라인은 TVLockupView와 TVLockupHeaderFooterView를 참고하세요.


Cards


카드(card)는 헤더(header), 푸터(footer), 콘텐츠 뷰(content view)를 결합하여 미디어 항목에 대한 평가와 리뷰를 보여줍니다.

개발자 가이드라인은 TVCardView를 참고하세요.


Caption buttons


캡션 버튼(caption button)은 버튼 아래에 표제와 부제를 포함하거나 이미지나 텍스트를 포함할 수 있습니다.


사람들이 캡션 버튼을 클릭할 때 스와이프 동작과 함께 캡션 기울어지는지 확인하세요. 캡션 버튼이 수직으로 정렬되면 위아래로 기울어지고 수평으로 정렬되면 좌우로 기울어집니다. 그리드 형태로 표시되면 캡션버튼은 수직 수평 모두 기울어집니다.

개발자 가이드라인은 TVCaptionButtonView를 참고하세요.


Monograms


모노그램(Monogram)은 일반적으로 미디어 항목의 출연진과 제작진을 구별합니다. 각 모노그램은 원형의 인물사진과 이름으로 구성됩니다. 인물사진을 사용할 수 없다면 사진 대신 그 사람의 이니셜을 표시합니다.


이니셜보다는 인물사진을 사용하세요. 인물사진을 사용한다면 텍스트보다 친밀한 감정과 관계를 형성할 수 있습니다.

개발자 가이드라인은 TVMonogramContentView를 참고하세요.


Posters


포스터(poster)는 이미지와 선택 가능한 제목과 부제로 구성되어 있으며 선택되기 전까지는 표시되지 않습니다. 포스터는 크기는 다양한 크기로 보여줄 수 있지만 해당 콘텐츠에 적합한 크기여야 합니다. 가이드라인은 Image views를 참고하세요.

개발자 가이드라인은 TVPosterView를 참고하세요.


Platform considerations


Not supported in iOS, iPadOS, macOS, or watchOS.


Resources


Related   

Designing for tvOS

Layout


Developer documentation   

TVLockupView — TVUIKit

TVLockupHeaderFooterView — TVUIKit


작가의 이전글 [HIG] Lists and tables
작품 선택
키워드 선택 0 / 3 0
댓글여부
afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari