|
|
| 텍스트에 적용된 스켈레톤 스크린 |
[clearfix]
1. 개요
페이지의 컨텐츠가 로딩되기 전에 레이아웃의 뼈대를 미리 보여주는 프로그레스 인디케이터 중 하나.2. 특징
스플래시 스크린이나 트로버는 단순히 로딩 중임을 알려주기 때문에 사용자들은 언제쯤 로딩이 완료될지 아무런 추측을 할 수 없다. 반면, 스켈레톤 스크린은 완전히 로드된 페이지의 모습을 대략적으로 흉내내어 나타내기 때문에, 사용자에게 실제 로딩 진행 과정을 어렴풋이나마 보여주어 사용자의 체감 로딩시간을 줄일 수 있게 된다.로딩할 각종 미디어 자원이 많은 유튜브, 페이스북 등에서 사용하고 았다.
3. 형태
일반적으로 흰색 배경 기준, 밝은 회색으로 나타내며, 텍스트는 줄로 나누어 텍스트를 감싸는 가로로 긴 네모 여러 줄로, 동그란 틀을 사용하는 프로필 사진의 경우는 동그란 회색 원으로 나타낸다. 당연하지만 스켈레톤 스크린이 표시될 때는 아직 컨텐츠가 로딩이 안 된 상태이기 때문에 실제 텍스트를 감싸는 게 아니고, 일반적으로 해당 부분에서 볼 수 있는 텍스트의 양을 대략적으로 나타낸다. 즉, 스켈레톤 스크린에서 보이는 텍스트의 양에서 실제 로딩이 완료되었을때의 텍스트의 양은 보통 달라진다.로딩 중임을 표현하기 위해 보통 희미하게 번쩍거리는 애니메이션을 넣지만, 애니메이션 없이 단순 회색박스로 만들기도 한다. 단, 만약 번쩍이는 애니메이션이 없는데 스켈레톤 스크린이 표시되고 나서의 시간이 길어지면 사용자가 화면이 멈춘건지 로딩이 진행 중인지 알 수 없기 때문에, 로딩이 어느정도 긴 컨텐츠를 표시할 예정이라면 그러한 애니메이션을 넣는 것이 좋을 것이다.