트루닥 EMR (truedoc)
소속: 에이치디정션 HD Junction
트루닥 EMR(Electronic Medical Record)은 의료진이 접수, 진료, 수납 등 병원 업무를 효율적으로 처리할 수 있도록 지원하는 데스크톱 앱 형태의 B2B Healthcare SaaS입니다. 기존의 노후화된 EMR 시스템이 초래한 불편함과 비효율적인 작업 반복으로 인한 의료진의 스트레스를 해소해, 보다 새롭고 편리한 업무 경험을 제공합니다.
창업 멤버로서 제품의 초기 버전 개발을 함께하고, UX Team Lead로서 제품 사용성 개선을 주도했습니다.
Tech Stack:
Electron, TypeScript, React, Redux, TanStack Query, Redux Toolkit, Redux-Saga, Sass(Scss), Jest, MSW, Yarn, webpack, ESLint, Prettier, husky, Jenkins
서비스 소개 페이지
기여
트루닥 EMR 개발
- 기술 스택 선정, React와 Electron 기반의 Frontend 초기 설계 결정
- 예약·접수, 진료 타임라인, 진단·기록·처방, 법정감염병 신고 기능 구현
- ‘환자 대기열 관리’ 동시 편집 구현 (Fractional Indexing 기반 순서 계산, Server-Sent Events 수신 동기화)
제품 기획·디자인 및 사용성 개선
- 제품 초기 기획·디자인 참여
- 정기적인 팀 간 미팅에서 VoC를 공유하고 팀에서 우선순위 판단
- VoC, In-depth Interview, 사용성 테스트를 바탕으로 문제 정의, 환자 검색 결과의 최근 내원 순 정렬, 환자 정보와 예약 화면 간 빠른 이동 등의 편의성 개선
성능 최적화, 리팩터링, 개발 환경 개선
- 렌더링 병목 해소: 진료 타임라인의 카드 크기 동기화 과정에서 반복되는 레이아웃 제거
- Layout Thrashing·Shift 회피로 진료 타임라인 스크롤 후 페이징 데이터(카드 모음) 렌더링 시 발생하는 약 2초의 프리징 해결
- 기존의 Infinite Scroll 구현을 Offscreen Rendering 생략 기법으로 대체해 진료 기록 탐색 UX 개선
- API 호출 방식 개선: Render-as-You-Fetch 패턴 도입 (Suspense·ErrorBoundary 적용, Redux-Saga → TanStack Query 전환)
- 외부 비동기 데이터를 Type-Safety 하게 다루도록 하고, Redux 비동기 액션의 의존도를 낮추어 코드량과 복잡도 감소
- 트랜스파일러 마이그레이션 (Babel → esbuild)
- 빌드 및 테스트 실행 시간 단축
- 무작위로 모듈을 변경하여 HMR 반영 시간 확인, 약 3초 → 1초로 단축