운행일지 앱 달력 UI 설계기 — 레미콘 기사가 직접 만든 화면

운행일지 앱 달력 UI는 “기록을 넣는 문”이 아니라 “한 달을 읽는 창”으로 만들 때 가장 쓸모 있어요. 저는 현직 레미콘(믹서트럭) 기사이고, 코딩은 전공도 직업도 아닙니다. AI의 도움을 받아 제가 쓸 운행일지 앱을 직접 만들었고, 2026년 6월 1일부터 7월 24일까지 40일간 실제로 기록하며 화면을 다듬었어요. 이 글은 그 앱의 핵심 화면인 달력을 어떻게 설계했는지 적은 기록입니다.

운행일지 앱 달력 UI, 왜 리스트보다 나은가

결론부터 말하면, 날짜마다 실적을 색 진하기 뱃지로 칠해주는 달력이 숫자 리스트보다 한 달 페이스를 훨씬 빨리 보여줍니다. 뱃지란 달력의 날짜 칸에 그날 실적을 작게 표시하는 점 표식을 말해요. 색이 진할수록 많이 뛴 날이라, 달력을 펼치면 언제 바빴는지 한눈에 잡혀요.

실제 데이터로 보면 이유가 분명해집니다. 저는 40일간 총 210바리, 1,260루베를 기록했어요. 하루 평균은 5.5바리인데, 가장 많이 뛴 날은 9바리(6월 1일), 가장 적은 날은 2바리(6월 30일)였습니다. 2바리인 날과 9바리인 날이 같은 달 안에 섞여 있어요. 숫자만 나열하면 이 리듬이 안 보이는데, 색 진하기로 칠하니 페이스가 그림처럼 보였습니다.

[이미지 자리 1 – 리포트에서 이미지를 먼저 첨부한 뒤 다시 복사하세요]

달력에서 날짜를 누르면 바로 입력하는 흐름

조작은 두 가지로 끝나게 만들었어요. 좌우로 밀면 이전·다음 달로 넘어가고, 날짜를 누르면 그날 기록 입력 화면이 열립니다. 근무상태, 바리수, 운반량, 시작·종료 km, 주유량, 오티 시간, 톨비, 정비 내역, 메모까지 한 화면에서 넣어요.

원래는 ‘기록’ 탭이 따로 있었습니다. 그런데 달력에서 날짜를 눌러 바로 입력하는 흐름이면 충분해서, 2026년 6월 말에 탭을 아예 없앴어요. 화면을 예쁘게 만드는 것과 일하면서 쓰기 좋게 만드는 건 다른 문제더라고요. 현장에서 며칠 써보고 나서야 버튼 위치도 바꿨습니다.

[이미지 자리 2 – 리포트에서 이미지를 먼저 첨부한 뒤 다시 복사하세요]

새벽 운전자를 위한 다크 테마 설계

디자인 방향은 하나였어요. 새벽·야간에 차 안에서 봐도 눈이 부시지 않을 것. 그래서 장식 없는 어두운 화면에 흰 글씨를 기본으로 잡았습니다. 완전한 검정 대신 짙은 회색을 쓰니 눈이 덜 아팠어요. 버튼은 장갑 낀 손으로도 눌리게 큼직하게 만들었습니다.

테마는 다크(기본)와 화이트, 두 가지예요. 예전엔 7가지였는데 거의 안 써서 2026년 6월에 두 개로 줄였습니다. 탭바 아이콘은 이모지 대신 선으로 그린 아이콘을 써서, 테마를 바꿔도 색이 자연스럽게 따라오게 했어요.

글자 크기는 층을 나눠 정보의 순서를 잡았습니다. 큰 글자가 먼저 읽히고, 작은 글자는 배경처럼 깔리게요.

요소글자 크기역할
헤더25px지금 어느 달인지
섹션 제목18px입력 항목 구분
입력칸17px실제 기록 값
달력 날짜 숫자9px배경 정보

확대(줌)를 두고는 방향을 한 번 뒤집었어요. 처음엔 두 손가락 확대를 열어뒀는데, 운전 중 화면을 스치면 의도치 않게 확대돼버려서 사흘 만에 다시 막았습니다. 지금은 두 손가락·더블 탭 확대가 모두 막혀 있어요.

[이미지 자리 3 – 리포트에서 이미지를 먼저 첨부한 뒤 다시 복사하세요]

시중 운행일지 앱과 뭐가 다른가

시중 앱과 제 앱은 목적 자체가 달라요. 운행일지 앱을 찾는 가장 큰 이유는 보통 세금입니다. 국세청 기준으로 업무용 승용차 운행기록부를 안 쓰면 차량 비용 인정 한도가 대당 연 1,500만 원으로 제한돼요(출처: 국세청). 그래서 법인·사업자용 앱은 국세청 양식 리스트가 화면의 중심입니다.

반면 운행일지 앱 달력 UI를 찾는 개인 운전자에게 맞는 건 다른 구조예요. 달력에서 날짜를 눌러 기록하는 개인용 차계부 계열이죠. 화면 구조 자체가 다르다는 게 핵심 비교 포인트입니다.

화면 구조주 대상특징 (2026년 8월 확인 기준)
카택스국세청 양식 리스트법인·개인사업자블루투스·충전 감지 자동 기록, 무료 요금제로 차량 100대까지, 유료 월 5,000원~ (출처: 카택스)
마이클달력 + 월별 그래프개인 차주300만 다운로드, 주유 결제 문자 인식
차계부(차량 일기)달력개인 차주날짜를 눌러 주유·정비 기록
레미콘 운행일지(자작)달력 + 실적 뱃지레미콘 기사 본인설치 없는 무료 웹앱, 바리수·오티·톨비 등 업종 특화 항목

바리당 단가처럼 업종에만 있는 항목은 어떤 시중 앱에도 없어요. 제 앱은 단가(제 기준 6월 74,300원, 7월 77,000원 — 공장·지역마다 다릅니다)를 월별로 따로 기억합니다. 6월엔 연료 소모량이 주유량보다 9.6L 많아 그만큼 정산받았고, 7월은 반대로 242.6L 차감됐어요. 이런 계산을 대신 해주는 앱이 없어서 직접 만든 거예요.

직접 만든 앱이라 못 하는 것들

솔직하게 적어요. 이 앱은 개인용이고 완성품이 아닙니다. 순수 HTML/CSS/JavaScript로만 만든 웹앱(PWA, 설치 없이 브라우저에서 앱처럼 쓰는 방식)이라 서버가 없어요. 데이터는 브라우저 저장소(localStorage)에만 남습니다.

그래서 한계도 분명해요. 여러 기기 간 동기화가 안 되고, 브라우저 캐시를 지우면 데이터가 날아갑니다. 사진 첨부 기능은 없어요. 2026년 6월에 넣었다가 이틀 만에 뺐는데, 사진을 브라우저 저장소에 넣는 순간 5MB 한도가 차버렸기 때문입니다. 자동 GPS 기록도 없어서 입력은 전부 손으로 해요. 대신 달력에서 날짜 한 번 누르면 끝나게 입력을 줄였습니다.

자주 묻는 질문

운행일지 앱은 GPS 자동기록이 꼭 필요한가요?

용도에 따라 달라요. 세무 제출용 운행기록부가 필요하면 자동 기록이 편하지만, GPS·Wi-Fi를 모두 쓰는 고정확도 모드는 배터리 소모가 큽니다(출처: Android 개발자 문서). 그래서 카택스류 앱은 상시 추적 대신 차량 블루투스 연결이나 충전 감지 시점에만 기록을 시작해요. 하루 실적을 달력에 남기는 게 목적이면 수동 입력으로도 충분합니다.

무료 운행일지 앱과 유료 앱의 차이는 뭔가요?

실질적 차이는 기록 자체보다 ‘내보내기’에 있어요. 엑셀 다운로드, 다양한 양식 변환, 기록 무제한 보관 같은 세무 제출용 기능이 대부분 유료 구간에 있습니다. 카택스 기준 무료로도 차량 100대까지 운행일지 생성이 되고, 엑셀 다운로드가 포함된 유료는 월 5,000원부터예요(2026년 8월 확인, 출처: 카택스). 내보내기가 필요한지 먼저 따져보고 고르세요.

웹앱 운행일지는 데이터가 어디에 저장되나요?

서버 없는 웹앱이라면 브라우저 안의 localStorage에 저장됩니다. 외부로 전송되지 않아 개인 기록 유출 걱정은 없지만, 브라우저 캐시를 지우면 데이터도 같이 사라져요. 저장 한도도 보통 5MB 수준이라 사진 같은 큰 파일은 넣기 어렵습니다.

코딩을 몰라도 운행일지 앱을 만들 수 있나요?

네, 저도 코딩이 전공도 직업도 아닌 레미콘 기사예요. AI에게 “달력에서 날짜를 누르면 입력 화면이 열리게 해줘”처럼 필요한 걸 말로 설명하며 만들었습니다. 다만 한 번에 완성되진 않아요. 현장에서 직접 써보고 버튼 위치와 화면 흐름을 계속 고치는 과정이 필요했습니다.


이 글의 앱 화면과 기록 수치는 2026년 6월 1일~7월 24일 실사용 데이터, 시중 앱 정보는 2026년 8월 확인 기준입니다. 요금과 기능은 바뀔 수 있으니 각 앱 공식 페이지에서 다시 확인하세요.

댓글 남기기