헤즈업 디스플레이
헤즈업 디스플레이 (Heads-up display)
백그라운드에서 작업이 진행 중일 때, 그 사실을 알려주는 진행 표시기가 필요할 때가 있어요. 헤즈업 디스플레이, 줄여서 HUD가 바로 그 역할을 해요. HUD는 백플레이트(backplate) 위에 나타나는 진행 표시기로, 진행 중인 백그라운드 작업에 대한 추가 텍스트 정보도 함께 보여줄 수 있어요.
HUD는 다른 Fluent iOS 진행 표시기보다 시각적 비중이 커요. 그래서 사용자가 시작한 빠른 작업, 가령 저장이나 다운로드처럼 사용자 흐름을 바꾸지 않는 작업을 알리는 데 잘 어울려요. 새 콘텐츠가 로딩 중임을 알리고 싶다면 활동 표시기나 진행 바, 시머를 쓰는 쪽을 고려해보세요.
출처: 문서
본문
동작 (Behavior)
모달성 (Modality)
HUD는 기본적으로 모달이에요. 화면 중앙에 나타나서 뒤에 있는 인터페이스와의 상호작용을 차단하고요. 사용자의 흐름을 잠시 멈추게 하는 방해 요소이기 때문에, 빠른 작업에만 쓰는 게 좋아요. 작업이 오래 걸린다면 화면을 막지 않는(non-blocking) HUD를 고려해서 계속 상호작용할 수 있게 하는 게 낫죠.
프로세스 취소 (Canceling a process)
사용자가 백그라운드 프로세스를 직접 멈출 수 있게 하고 싶다면, 탭 제스처 콜백(Tap gesture callback) 변형을 사용해요. 그러면 취소를 확인하는 메시지가 나타나요.
완료 상태 라벨링 (Labeling completion states)
HUD에는 완료 상태가 기본 내장되어 있지 않아요. 다만 HUD 라벨을 업데이트해서 사용자에게 백그라운드에서 무슨 일이 일어나고 있는지, 언제 끝나는지 감을 줄 수는 있어요.
콘텐츠 (Content)
지금 무슨 일이 일어나고 있는지 알려주는 동사를 사용해요. 동사가 사용자가 방금 취한 행동을 반영하면 더 좋고요. 예를 들어 "Copy" 동작을 선택한 뒤에는 "Copying(복사 중)" HUD를 보여주는 식이에요. "Loading(로딩 중)"이나 "Working on it(작업 중)"처럼 막연한 표현보다 더 구체적으로 쓸 수 있다면 그렇게 쓰는 게 좋아요.
HUD의 최대 너비는 192픽셀이에요. 라벨은 짧게 유지해서 어색한 줄바꿈이 생기지 않게 해주세요. 가능하면 HUD를 띄운 원인이 된 행동 단어를 그대로 반영하는 게 좋아요.