사내 업무 관리 시스템
국가 시험 · 인증 기관 임직원이 행정 · 관리 업무를 한 시스템에서 처리하는 사내 업무 관리 시스템의 화면을 개발했습니다. 직원들이 날마다 되풀이해 쓰는 화면이라, 흐름이 헷갈리거나 동작이 불안하면 그 불편이 매일 쌓입니다. 여러 업무 기능을 한 시스템 안에 모은 화면 구조, 입력 · 조회 · 목록 · 상세 화면, 웹 브라우저 안에서 데스크톱 프로그램처럼 쓰는 조작을 맡았습니다.
여러 업무를 한 시스템 안에서 처리하는 화면 구조
사내 업무 관리 시스템은 조직 운영에 필요한 행정 · 관리 기능을 한 시스템에서 처리하도록 만든 시스템입니다. 다양한 업무 기능을 하나의 시스템 안에서 쓸 수 있도록 주요 화면의 구조를 잡았습니다. 기능이 늘어도 직원이 지금 어느 업무를 보고 있는지 놓치지 않게 하는 것이 구조를 정하는 기준이었습니다.

입력에서 상세까지 한 흐름으로 이어지는 업무 화면
행정 · 관리 업무는 대개 입력하고, 조회하고, 목록에서 고르고, 상세를 확인하는 순서로 진행됩니다. 사내 업무 관리 시스템의 입력 · 조회 · 목록 · 상세 화면을 구현하면서, 한 화면에서 다음 화면으로 넘어가는 흐름이 분명하도록 구성했습니다. 목록에서 고른 항목이 상세로 그대로 이어지고 상세에서 목록으로 돌아오는 길이 분명해야, 같은 일을 매일 되풀이해도 헛걸음이 없습니다.

날마다 되풀이해 쓰는 사람을 기준으로 삼은 안정성
사내 업무 화면은 같은 직원이 같은 일을 날마다 되풀이하는 화면입니다. 그래서 눈에 띄는 장식보다 명확한 흐름과 안정적인 동작을 중시했습니다. 한 번 익힌 순서가 그대로 통하고 조작이 매번 같은 결과를 내야, 매일 쓰는 사람이 지치지 않습니다.

브라우저 안에서 데스크톱 프로그램처럼 동작하는 조작
사내 업무 관리 시스템은 웹 브라우저에서 여는 시스템이지만, 복잡한 업무 기능을 데스크톱 프로그램처럼 쓰도록 만들었습니다. 화면 부품과 사용자 동작 처리를 활용해 업무 화면과 조작을 개발했습니다. 직원 자리마다 프로그램을 따로 설치하지 않아도 브라우저만 있으면 같은 화면을 씁니다.

이 작업의 포인트
여러 행정 · 관리 기능을 한 시스템에 모은 화면 구조
입력 · 조회 · 목록 · 상세로 이어지는 업무 화면
웹 브라우저에서 데스크톱 프로그램처럼 쓰는 조작
인사이트
GA4 client_storage: 'none'은 정말 쿠키를 막을까?
두 달 전 이 블로그에 「GA4 쿠키 없이 쓰기」라는 글을 썼습니다. clientstorage: 'none' 으로 쿠키 저장을 끄고, 자체 분석이 쓰던 익명 ID 를 clientid 로 넘기면 쿠키 0개로 GA4 를 쓸 수 있다는 내…
GA4 Measurement Protocol: gtag.js 없이 서버에서 이벤트 보내기
랜딩 페이지의 전송량을 파일 단위로 쪼개 보다가, 가장 큰 파일이 우리 코드가 아니라는 것을 알았습니다. Google Analytics 의 gtag.js 였고, 방문 한 번에 176KB 를 받고 있었습니다. 페이지 전체가 1,094K…
중소 제조업 AI 도입 순서: DX를 먼저 끝내야 할까?
공장을 가진 중소·중견 제조기업 16만여 곳 가운데 스마트공장을 도입한 곳은 19.5%입니다. 회사가 작을수록 이 비율은 더 떨어집니다. 중소벤처기업부가 2025년 4월에 낸 제1차 스마트제조혁신 실태조사 결과입니다. 그림: 기업 규…
Next.js loading.tsx와 404: 버튼이 화면보다 먼저 살아나게 하기
관리 화면 왼쪽 위에 사이드바를 접고 펴는 ☰ 버튼이 있습니다. 폭 하나 바꾸는 버튼인데, 대시보드에서 누르면 2초 넘게 아무 반응이 없었습니다. 레이아웃만 바꾸는 일이 왜 이렇게 오래 걸리는지부터 들여다봤습니다. Next.js 16…



