DESIGN CONCEPT 05
빠르고 명확한 인상
숫자, 상태, 목록과 필터를 체계적으로 정리해 운영자가 반복 업무를 빠르고 정확하게 처리하도록 돕는 방향입니다.
잘 맞는 서비스관리자·SaaS·업무 도구
예약 관리
전체 예약
처리 대기
컨셉 구성 요소 상세
숫자, 상태, 목록과 필터를 일정한 규칙으로 정리해 운영자가 반복 업무를 빠르게 비교하고 처리하도록 설계합니다.
핵심 원칙
전체 상태를 요약한 뒤 예외와 미처리 업무로 빠르게 내려갈 수 있게 만듭니다.
OPERATIONS
ELEMENT 01
큰 숫자, 짧은 라벨과 정렬된 목록 문구로 운영자가 필요한 값을 빠르게 비교하게 합니다.
구성 기준
이렇게 구성하는 이유
숫자의 자리와 상태 용어가 일정하면 내용을 하나씩 읽지 않고도 변화와 예외를 찾을 수 있습니다.
피해야 할 방식 · 숫자마다 단위 위치를 다르게 하거나 같은 상태를 여러 표현으로 바꾸어 쓰지 않습니다.
신규
대기
완료율
ELEMENT 02
카드는 전체 지표를 요약할 때만 사용하고, 반복 업무는 밀도 높은 행과 표 구조로 보여줍니다.
구성 기준
이렇게 구성하는 이유
요약과 반복 목록을 다른 형태로 구분하면 전체 상황과 개별 처리 건을 빠르게 오갈 수 있습니다.
피해야 할 방식 · 모든 요청을 큰 카드로 만들거나 목록 행마다 불필요한 설명과 이미지를 반복하지 않습니다.
예약 변경
김고객 · 10분 전
결제 확인
김고객 · 10분 전
상담 기록
김고객 · 10분 전
검색·필터·상태는 모든 목록에서 같은 위치와 용어를 유지합니다.
ELEMENT 03
검색, 필터, 상태 배지와 일괄 행동을 예측 가능한 위치에 두어 반복 조작을 줄입니다.
구성 기준
이렇게 구성하는 이유
운영자는 같은 조작을 자주 반복하므로 위치와 결과가 일관될수록 속도와 정확도가 함께 높아집니다.
피해야 할 방식 · 필터를 숨겨진 메뉴에 분산하거나 위험한 일괄 행동을 일반 버튼과 같은 위치에 두지 않습니다.
01 · SUMMARY
02 · TREND
03 · TODO
04 · DETAIL LIST
ELEMENT 04
요약 지표에서 미처리 목록, 개별 상세로 내려가는 계층형 업무 구조를 사용합니다.
구성 기준
이렇게 구성하는 이유
모든 데이터를 한 화면에 펼치지 않고 판단 단계에 따라 보여주면 정보량이 많아도 길을 잃지 않습니다.
피해야 할 방식 · 요약과 상세 정보를 한 화면에 같은 밀도로 섞거나 모바일에서 데스크톱 표를 그대로 축소하지 않습니다.
구성 비교
GOOD
신규
대기
완료
예약 변경 · 신규
결제 확인 · 대기
지표, 필터와 미처리 목록의 위치가 일정해 필요한 차이와 다음 업무를 빠르게 찾을 수 있습니다.
AVOID
새 요청
기다리는 업무
이번 달 처리율
오늘 상담
여백과 장식이 많은 카드 때문에 한 화면에서 비교할 수 있는 정보가 줄어들고 반복 처리가 느려집니다.
모바일 화면 예시
대표 색상만 바꾼 화면이 아닙니다. 업무 효율형의 정보 순서, 컴포넌트와 행동 방식을 세 가지 실제 화면으로 비교해 보세요.
예시 화면 3개
OVERVIEW
예약 운영
전체 예약
이번 주
SCREEN 01 · 화면 해설
숫자와 미처리 상태를 압축해 오늘 할 일을 먼저 보여줍니다.
이 화면의 역할
운영자가 오늘의 상태를 요약하고 처리할 업무로 빠르게 이동하는 대시보드입니다.
위에서 아래로 읽는 순서
핵심 요소와 구성 방법
같은 단위의 지표 카드
예약·대기·완료를 나란히 두어 현재 운영 상태를 비교합니다.
추이와 목록의 동시 배치
전체 변화와 지금 처리할 개별 건을 한 화면에서 연결합니다.
업무 의미가 있는 상태색
강조색은 장식이 아니라 완료·대기·주의를 구분하는 데 사용합니다.
왜 이렇게 구성하나요?
업무 화면은 시선을 오래 머물게 하기보다 판단 시간을 줄여야 합니다. 전체 요약에서 예외 항목으로 내려가는 구조로 운영자의 확인 순서를 그대로 반영합니다.
RESERVATIONS
예약 목록
SCREEN 02 · 화면 해설
필터와 상태 배지로 반복 업무를 빠르게 비교하고 처리합니다.
이 화면의 역할
많은 요청을 조건별로 찾고 우선순위를 판단해 반복 처리하는 목록 화면입니다.
위에서 아래로 읽는 순서
핵심 요소와 구성 방법
검색과 필터의 고정 위치
목록이 달라져도 탐색 도구를 같은 위치에서 찾게 합니다.
정렬된 행 정보
이름, 요청 내용, 시간, 상태를 반복되는 열 구조로 보여줍니다.
문구가 포함된 상태 배지
색상만 보지 않아도 신규·대기·완료를 정확히 구분할 수 있습니다.
왜 이렇게 구성하나요?
목록은 개별 카드의 아름다움보다 반복 스캔이 중요합니다. 행마다 정보 위치를 고정해 눈이 수직으로 이동하는 동안 차이만 빠르게 찾도록 합니다.
REQUEST #1842
예약 요청 상세
김고객
첫 상담 · 30분
요청 시간
9월 9일 15:30
현재 상태
확인 대기
요청 메모
오후 시간 상담을 희망합니다. 연락은 문자로 부탁드립니다.
SCREEN 03 · 화면 해설
판단에 필요한 정보와 승인 행동을 한 화면에서 완료합니다.
이 화면의 역할
선택한 요청의 핵심 정보와 처리 기록을 검토한 뒤 승인 여부를 결정하는 상세 화면입니다.
위에서 아래로 읽는 순서
핵심 요소와 구성 방법
상태와 식별 정보
어떤 건을 처리 중인지 페이지 상단에서 계속 확인하게 합니다.
정보 그룹별 카드
고객, 요청, 기록을 구분해 누락 없이 검토할 수 있게 합니다.
서로 구분되는 결정 버튼
보류와 승인 행동의 위계를 달리해 치명적인 오조작을 줄입니다.
왜 이렇게 구성하나요?
상세 화면은 정보 열람과 업무 결정이 만나는 곳입니다. 판단 근거를 위에, 되돌리기 어려운 행동을 아래에 두어 읽는 순서와 처리 순서를 일치시킵니다.
선택 기준
많은 정보에서 상태와 다음 행동을 쉽게 찾게 합니다. 업종 이름보다 사용자가 화면에서 느껴야 하는 감정과 완료해야 하는 행동을 기준으로 판단합니다.
화면 전체 규칙
숫자·상태·미처리 업무 순서로 배치
높은 정보 밀도와 분명한 상태 표시
표와 필터를 확장하기 쉬운 구조
장식은 줄이고 상태색과 데이터 표현에 집중
LAYOUT RULES
화면 템플릿 연결
템플릿은 화면 구성의 출발점입니다. 같은 템플릿이라도 이 콘셉트의 글자, 여백과 컴포넌트 규칙을 적용해 프로젝트에 맞게 조정합니다.
함께 검토할 템플릿 유형
PROJECT QUESTIONS
운영자가 하루에 가장 자주 처리하는 업무는 무엇인가요?
목록에서 바로 판단하려면 어떤 정보가 보여야 하나요?
실수하기 쉬운 일괄 작업과 권한은 어떻게 제한할까요?
다른 방향 비교
서비스 유형과 주요 사용자, 필요한 화면을 알려주시면 적용 범위와 다른 비교 방향을 함께 정리합니다.
