SaaS는 데이터가 중요한 서비스입니다. 사용자가 데이터를 실수 없이 관리하게 하려면 생성(Create), 조회(Read), 수정(Update), 삭제(Delete)의 플로우가 간단하고 명료해야 합니다.

제가 SaaS 서비스의 디자인 하면서 고려했던 CRUD의 플로우를 정리해보았습니다.

HR 서비스를 제공하였던 서비스라, HR 데이터를 예시로 들었습니다.

• 생성

  • 생성 버튼이 잘 보이도록 화면에 배치해야 합니다.

  • 데이터를 생성하려면 필수/선택이 무엇인지 구분해주어야 합니다.

  • 생성 후 저장했을 때 저장된 데이터가 어디에서 조회되는지 표시해주어야 합니다.

• 조회

  • 정렬 또는 필터를 사용해서 원하는 데이터를 효율적으로 조회할 수 있도록 해야 합니다. (예: 생성순 정렬 또는 이름 순 정렬 / 부서 또는 직책으로 필터링)

  • 타이포그래피 원칙을 따라 시각적 위계가 있는 정보 전달을 해야 합니다.

• 수정

  • 수정에는 두 가지 방법이 있습니다.

    • 덮어씌워지는 데이터

      • 최신 상태만 중요한 정보 (예: 연락처 정보)

        • 현재 값을 인풋 필드에 미리 채워 보여줍니다.

        • 수정 후 저장 시 덮어쓰기 경고 알림 등을 띄워줍니다.

    • 히스토리로 쌓이는 데이터

      • 변경 이력이 중요한 정보 (예: 급여 이력, 직책 변경)

        • 현재 값과 함께 이전 이력을 타임라인 형태로 표시합니다.

        • 새 항목 추가와 기존 항목 수정을 명확히 구분하는 UI 제공합니다.

        • 변경 사유 입력 필드 추가로 히스토리의 맥락 제공합니다.

• 삭제

  • 삭제에도 두 가지 방법이 있습니다.

    • Soft delete

      • 직원 정보

        • 퇴사한 직원의 기록을 완전히 삭제하지 않고 비활성화

        • 이력 추적 및 감사 목적으로 유용

    • Hard Delete

      • 영구 삭제임을 명확히 경고

      • 삭제 전 확인 알럿에서 영구적인 조치임을 강조

      • 중요한 데이터의 경우, 추가 인증 단계 요구 (예: '확인했습니다' 문구 입력)

데이터 관리용 대시보드를 디자인할 때 테이블, 카드, 리스트 등 반복적인 UI 요소를 자주 사용하게 되어 ’내가 정말 디자인을 하고 있는 걸까?’라는 의문이 들 수 있습니다.

하지만 CRUD(생성, 읽기, 수정, 삭제) 각 단계의 흐름을 고려하여 상황에 적합한 정보를 제공하고 사용자의 실수를 방지하는 방안을 깊이 고민하다 보면, 단순한 UI 구성을 넘어 UX까지 고려하게 되고 개발자와의 소통도 더욱 원활해지는 것 같습니다