엠프티스테이트 (Empty State)

디자인학
한 줄 정의: 콘텐츠나 데이터가 아직 없는 화면 상태를 사용자에게 명확하고 유용하게 안내하도록 설계한 UI 상태이다.
엠프티스테이트엠프티스테이트: 빈 상태 아래에 첫 사용, 사용자가 비움, 검색 실패, 오류·권한 부족.빈 상태원인별로 다르게설계첫 사용할 수 있는 일 안내사용자가 비움완료 축하검색 실패대안 제시오류·권한 부족원인 설명한계행동 유도 없이 일러스트만 넣으면 장식에 그침엠프티스테이트엠프티스테이트: 빈 상태 아래에 첫 사용, 사용자가 비움, 검색 실패, 오류·권한 부족.빈 상태원인별로 다르게 설계첫 사용할 수 있는 일 안내사용자가 비움완료 축하검색 실패대안 제시오류·권한 부족원인 설명한계행동 유도 없이 일러스트만 넣으면 장식에 그침

쉽게 풀면

아직 아무 내용도 없을 때 텅 빈 화면 대신 다음에 뭘 하면 되는지 알려주는 화면이다.

왜 중요한가

빈 상태는 데이터가 없는 목록, 검색 결과 없음, 처음 가입한 계정 화면처럼 보여 줄 내용이 없는 순간의 화면으로, 이때 무엇을 해야 할지 안내하지 않으면 사용자가 서비스가 고장 났다고 여기고 떠나는 지점입니다. 온보딩에서 첫 행동을 이끄는 장소이기 때문에 신규 사용자 활성화 지표에 직접 영향을 주며, 설계에서 가장 자주 빠뜨리는 상태로 꼽힙니다. 검색 결과가 없는 빈 상태에서는 단순히 '결과 없음'이라고만 알리기보다, 검색어 오타 가능성이나 필터 조건 완화를 함께 제안하는 것이 이탈을 줄이는 데 효과적이라는 것이 사용성 연구에서 확인된다. 빈 상태에 지나치게 유머러스한 문구나 큰 일러스트를 넣으면 오류 상황에서는 오히려 사용자의 답답함을 가중시킬 수 있어, 상황의 심각도에 맞춘 톤 조절이 필요하다.

논문에서는 이렇게 쓰입니다

본 연구는 엠프티스테이트에 안내 문구와 행동 유도 버튼을 추가한 결과 사용자의 첫 행동 완료율이 증가하였다.

빈 화면에 안내와 유도 요소를 추가한 것이 실제 행동 유도에 미친 효과를 검증한 연구이다.

데이터가 없는 화면에 안내 문구와 다음 행동을 유도하는 빈 상태 디자인을 적용하자 신규 사용자의 이탈률이 감소한 것으로 나타났다.

이는 아무 내용도 없는 화면을 방치하지 않고 다음에 할 일을 알려주는 것만으로도 사용자 이탈을 줄일 수 있음을 보여준다.

조금 더 깊게 보면

빈 상태는 원인에 따라 다르게 설계해야 합니다. 첫 사용(무엇을 할 수 있는지 안내), 사용자 행동으로 비워짐(완료 축하), 검색 실패(대안 제시), 오류나 권한 부족(원인 설명)은 각기 다른 메시지와 행동 버튼이 필요합니다. 귀여운 일러스트만 넣고 행동 유도가 없는 빈 상태는 장식에 그치며, 반대로 이 순간에 지나친 정보를 쏟으면 압도됩니다. 디자인 도구에서 데이터가 채워진 이상적 화면만 그리는 관행이 빈 상태를 빠뜨리게 하므로 상태 목록(로딩·빈·오류·부분·이상)을 명시적으로 점검하는 것이 권장됩니다. 빈 상태 설계는 원인별로 다른 접근이 필요한데, 첫 사용 시의 빈 상태는 무엇을 할 수 있는지 안내하는 온보딩 역할을, 검색 결과 없음의 빈 상태는 검색어를 수정하거나 필터를 완화하도록 유도하는 역할을 맡는다.

주의할 점

엠프티스테이트는 단순한 오류 화면이 아니라 다음 행동을 안내하는 기회로 설계되어야 한다.

관련 용어