스켈레톤 UI란?

 

 

웹페이지 렌더링이나 로딩할때 텍스트나 이미지같은거 있다고 임시로 보여주는 그런거 있잖아요?
(......예?)

 

몇일전 중간 프로젝트 발표가 있었다.

다른 사람의 발표를 듣다가 페이지가 렌더링될때 텍스트가 있다는걸 사용성을 위해 이런걸 넣었다고 설명하는데

용어를 몰라서 PPT 화면을 보고서야 아 그래 저거..! 라고 알아차릴수있었는데

알고보니 나도 제대로된 용어를 모르고 있었던것이다.

이번기회에 정리해보면 참 좋을거같단 생각이 문득 들었다.

 

 

 

스켈레톤 UI - 출처(http://61.107.76.13/Li/05_07.html)

스켈레톤 UI란? 

• 콘텐츠가 로드되기 전, 텍스트나 이미지 등의 자리에 회색 박스나 뼈대 형태의 요소를 미리 보여주는 UI 방식
• 사용자에게 **"지금 로딩 중입니다"**라는 신호를 주면서도, 페이지 구조가 어떤 식으로 구성될지를 미리 보여줘서 불안감을 줄이는 효과가 있다(UX에 좋은거겠네!)
• 예시: 페이스북이나 인스타그램에서 로딩 중일 때 회색 블록들이 깜빡이며 나오는 거!