세션 만료 UX: 작성 중인 폼으로 안전하게 돌아오는 흐름

폼을 작성하다 세션이 만료되었을 때 가장 중요한 안내는 “로그아웃되었습니다”가 아닙니다. 사용자는 작성한 내용이 남아 있는지, 어떻게 다시 접근하는지, 어디로 돌아가는지 알아야 합니다. 좋은 복구 흐름은 이 질문에 답하면서도, 로그인하면 미완성 폼까지 제출된다는 오해를 만들지 않습니다.

로그인 상태와 복구 경로(영어)도 중요하지만 이번 중단은 이미 화면에 작업이 있는 상태에서 시작됩니다. 로그인 화면만큼 원래 작업으로 돌아오는 여정을 세심하게 설계해야 합니다.

미완성 요청 한 건을 중단부터 복구까지 따라가기

가상의 공급업체 요청 앱을 생각해 보겠습니다. 운영 담당자는 요청 SR-208을 편집하며 회사 이름, 배송 메모, 첨부 문서를 넣었습니다. 요청은 아직 제출하지 않았습니다. 이 앱에는 승인된 초안 저장 정책이 있으며 계속 작업하려면 인증이 필요합니다.

사용자는 폼을 검토하다 잠시 자리를 비웁니다. 돌아왔을 때 인증 세션이 만료되었습니다. 원하는 결과는 SR-208을 다시 열고 보관된 초안을 확인한 뒤 제출 여부를 결정하는 것입니다. 홈페이지로 돌아가 기억에 의존해 요청을 처음부터 작성하는 것이 아닙니다.

문구와 시각적 표현 모두에서 초안 저장, 세션 만료, 요청 제출을 구분합니다. 세 사건은 서로 다른 시점에 일어날 수 있습니다. 초안이 저장되었다고 공급업체에 전달된 것은 아니며, 재인증에 성공했다고 요청 작성이 완료된 것도 아닙니다.

인터페이스의 타이머가 무엇을 뜻하는지 확인하기

인증 담당자에게 만료 조건을 확인합니다. 비활성 시간 제한, 세션의 절대 유효 시간, 인증 확인 단계의 만료는 서로 다릅니다. 계속 입력하는 행동이 한 정책에는 영향을 주지만 다른 정책에는 영향을 주지 않을 수 있습니다. 실제로 그렇게 작동하는 앱이 아니라면 어떤 활동이든 로그인 상태를 유지한다고 약속하지 마세요.

OWASP 세션 관리 치트 시트(영어)는 유휴 시간과 절대 시간에 따른 만료를 구분하고 서버에서 이를 적용하도록 설명합니다. 카운트다운은 세션 상태를 사용자에게 보여 주는 표시이지, 유효성을 결정하는 주체가 아닙니다.

여러 탭을 쓸 때 이 구분이 중요해집니다. 다른 탭에서 세션을 연장할 수도 있고 보안 이벤트 때문에 서버가 먼저 종료할 수도 있습니다. 현재 페이지가 안내를 실제 세션과 어떻게 맞출지 정하세요. 서버가 세션을 거부했는데 오래된 타이머가 아직 편집 권한이 있다고 표시해서는 안 됩니다.

모든 제품에 맞는 보편적인 만료 시간은 없습니다. 정책, 지원되는 경우의 연장 방법, 다시 로그인해야 하는 사건을 기록합니다. 그런 다음 앱이 실제로 이행할 수 있는 행동에 맞춰 안내를 작성합니다.

복구를 약속하기 전에 무엇을 남길 수 있는지 결정하기

일부 필드만 저장했다면 “작업 내용은 안전합니다”라는 안내는 지나치게 넓습니다. 공급업체 요청 화면에는 필드별 보관 결정이 필요합니다. 무엇을 얼마 동안 누구의 계정에 저장하고, 인증 후 무엇을 다시 입력해야 하는지 정해야 합니다.

이는 연습을 위해 정한 규칙이지 모든 제품에서 모든 필드를 저장하라는 처방이 아닙니다. 초안 자체에도 민감한 정보가 들어갈 수 있습니다. 저장 위치, 접근 권한, 만료에 원래 폼과 같은 주의가 필요합니다. 복구 문제를 해결하려고 비밀 정보나 제한된 내용을 보호되지 않은 브라우저 저장소에 몰래 넣어서는 안 됩니다.

아직 행동할 수 있을 때 실행 가능한 경고 보여 주기

연장을 지원한다면 곧 일어날 일을 설명하고 “로그인 상태 유지”처럼 이름이 분명한 행동을 제공합니다. 응답하지 않았을 때의 결과도 설명하세요. SR-208에서는 세션이 곧 끝나며, 저장을 확인한 초안은 로그인 후 다시 열 수 있다는 안내가 사실에 맞습니다.

모든 경고에 안심시키는 고정 문구를 넣지 말고, 가장 최근에 확인한 저장 상태를 사용합니다. 최신 배송 메모가 아직 저장 중이라면 메시지에도 그 불확실성이 드러나야 합니다. 연장 요청도 실패할 수 있으므로 처리 중과 연장 성공을 구분합니다.

WCAG 2.2 성공 기준 2.2.1, 시간 조절 가능(영어)은 레벨 A이며, 시간 제한을 사용자가 제어하는 대안과 예외를 설명합니다. 그중 연장 방식을 적용할 때는 간단한 행동으로 연장할 수 있도록 최소 20초를 주고, 최소 열 번 연장할 수 있어야 합니다. 이를 모든 상황에 “20초 카운트다운을 보여 준다”는 규칙으로 줄여 해석하면 안 됩니다.

키보드로 행동에 접근할 수 있고, 초가 줄어드는 모습을 보지 않아도 안내를 이해할 수 있게 합니다. 눈에 보이는 카운트다운이 도움이 되는 사람도 있지만 매초 읽어 주면 경고를 읽는 데 방해가 될 수 있습니다. 대화상자를 쓴다면 포커스가 어떻게 들어오고, 행동을 어떻게 선택하며, 연장 후 어디로 돌아가는지 정합니다.

성공을 가정하지 말고 알아볼 수 있는 초안으로 돌아가기

만료 후의 복구 상태는 로그인이 필요하다고 설명해야 합니다. 인증 전 상태에서 복구할 초안을 식별해 주는 것도 허용된 범위 안에서만 가능합니다. 오버레이 뒤에 민감한 폼 내용을 남겨 두고 화면을 덮는 것이 접근 통제라고 가정해서는 안 됩니다.

같은 사용자가 재인증에 성공하고 권한도 확인되면 적절한 단계의 SR-208을 다시 엽니다. “초안” 상태와 보관된 값을 보여 주세요. 첨부 완료를 확인하지 못했다면 그 부분을 구체적으로 표시합니다. 최종 “요청 제출”은 사용자가 의도적으로 결정할 수 있게 남겨 두고 자동으로 재실행하지 않습니다.

성공 기준 2.2.5, 재인증(영어)은 재인증 후 입력한 데이터를 잃지 않고 활동을 계속하는 내용을 다룹니다. 이는 레벨 AAA이며 AA 요구 사항이 아닙니다. 복구 목표는 이 설계에 유용하지만, 저장과 권한 확인 방식은 제품 담당자와 개발자가 여전히 정해야 합니다.

돌아갈 위치도 신뢰할 수 있는 애플리케이션 흐름의 일부로 기록합니다. 개발자는 임의의 외부 리디렉션을 허용하지 말고 목적지를 검증해야 합니다. 디자이너가 지정할 것은 일반적인 “뒤로” 버튼 하나가 아니라, 어떤 요청의 어떤 단계와 맥락으로 돌아가는지입니다.

Pixso에서 중단과 복귀를 함께 검토하기

Pixso 파일에 SR-208의 네 프레임을 만듭니다. 만료 경고가 있는 편집 화면, 세션 만료 화면, 로그인 후 복귀, 복원된 “초안 검토” 화면입니다. 권한이 확인된 전후 화면에서 회사 이름과 배송 메모를 동일하게 유지합니다. 달라져야 할 것은 접근과 작업 상태이지, 검토하기 편하도록 줄여 놓은 폼이 아닙니다.

관련 화면을 연결해 흐름을 따라가 봅니다. 동료에게 요청 작성을 재개하고 제출이 완료되었는지 설명해 달라고 하세요. 로그인 후 화면이 완료 화면처럼 보인다면 성공 문구를 없애고 초안의 정체성을 되살립니다. 업로드가 끝나지 않은 첨부의 별도 분기도 만들어 정상 경로가 미완성 작업을 숨기지 않게 합니다.

Pixso에서 초안 복귀 흐름 프로토타이핑하기 →

로그인 성공이 올바른 복구를 뜻하지 않을 수 있습니다

다른 계정으로 로그인했다면 이전 사용자의 초안을 노출하지 않습니다. 현재 계정으로 요청한 초안을 열 수 없다고 설명하고, 적절한 계정 전환이나 안전한 복귀 경로를 제공합니다. 그 설명에도 비공개 회사 이름이나 첨부 이름을 표시하지 마세요.

같은 계정도 자리를 비운 사이 권한을 잃었을 수 있습니다. 인증은 지원되는 절차로 신원을 확인할 뿐, 취소된 역할을 복원하지 않습니다. 권한 복구 흐름은 이 별도의 경계를 다룹니다. 더 이상 접근할 수 없는 사용자를 “다시 로그인해 보세요”라는 무한 반복에 가두지 마세요.

초안의 보관 기간 만료와 세션 만료도 구분합니다. SR-208이 더 이상 보관되어 있지 않다면 정확히 알리고 허용된 다음 행동을 제공합니다. “초안이 복원되었습니다” 아래에 빈 폼을 보여 줘서는 안 됩니다.

완성 화면보다 만료되는 순간을 시험하기

어려운 경우는 상태 사이에서 일어납니다. 입력 도중 경고가 나타나거나, 연장 응답이 늦거나, 업로드가 미완료이거나, 제출을 누른 직후 세션이 끝날 수 있습니다. 마지막 경우에는 다시 제출하도록 안내하기 전에 원래 작업의 결과를 확인해야 합니다. “로그아웃됨”만으로 요청이 실패했다고 판단할 수는 없습니다.

구현 담당자와 접근성 검토자가 함께 이 전환을 따라가 봅니다. 무엇을 유지하는지, 인증 전에 무엇이 보이는지, 어느 계정이 복구할 수 있는지, 최종 행동이 사용자가 예상한 때에만 실행되는지 확인하세요. 잘 다듬은 만료 대화상자는 돌아오는 여정도 그 약속을 지킬 때 의미가 있습니다.