웹앱·플랫폼
스타트업 통합 사내 인트라넷 구축
전자결재·근태·일정·공지를 한 화면에 모은 사내 인트라넷. 흩어져 있던 업무 도구를 하나로 합쳤습니다.
비공개·데모 — AI 가상 데이터로 재구성한 예시입니다
문제
결재는 메일로, 일정은 엑셀로, 공지는 메신저로 흩어져 있어 직원들이 확인할 곳이 너무 많았습니다. 휴가를 하나 내려면 메일로 신청서를 보내고 메신저로 팀장에게 알린 뒤 공유 엑셀에 일정을 따로 적어야 했습니다. 결재가 어디서 멈췄는지는 당사자가 물어보기 전까지 아무도 몰랐고 지나간 공지는 메신저 대화에 묻혀 찾기 어려웠습니다. 누가 재택이고 누가 외근인지 같은 기본 정보조차 물어봐야 아는 상황이라 하루를 시작할 때 열어야 하는 창구가 네 개를 넘었습니다. 출근해서 한 화면만 열면 오늘 할 일이 다 보여야 한다는 요구에서 프로젝트가 시작됐습니다.
해결
결재선·조직도·근태 규칙을 회사가 일하는 방식 그대로 시스템에 옮기고, 하루 업무가 대시보드 한 화면에서 시작되게 설계했습니다. 전자결재는 휴가신청서와 지출결의서, 출장신청서, 구매품의서 같은 회사 양식을 그대로 문서 서식으로 만들어 기안을 올리면 결재선을 따라 상신과 합의, 승인·반려로 흘러갑니다. 일정은 월간 달력으로 조직 전체에 공유되고 조직도에서 사람을 찾으면 담당 업무와 연락처가 바로 나옵니다. 게시판은 고정 공지부터 동호회 글까지 층을 나눠 담았습니다. 메일과 엑셀, 메신저, 수기 근태부로 흩어져 있던 도구 네 개가 이렇게 한 시스템으로 합쳐졌습니다.
- 70%
- 결재 처리 시간 단축
- 4개
- 하나로 합친 업무 도구
- 실시간
- 조직 전체 일정 공유
제작 노트
다섯 메뉴로 모은 하루
메뉴는 대시보드, 전자결재, 일정, 조직도, 게시판 다섯 개입니다. 대시보드에는 내 결재함과 출퇴근·재택 같은 근무 상태, 오늘 타임라인, 이번 주 구내식당 식단, 알림이 한 화면에 모입니다. 전자결재에서는 휴가신청서부터 법인카드 사용내역까지 양식을 골라 기안을 올리고 문서마다 결재선과 진행 단계가 표시됩니다. 일정 메뉴는 월간 달력으로 조직 전체 일정을 보여 주고 게시판에는 공지부터 동호회 모집까지 쌓입니다. 읽지 않은 결재와 새 글 수는 메뉴 옆 숫자 배지로 표시돼 놓친 일이 바로 눈에 들어옵니다.
Livewire를 쓴 까닭
인트라넷은 목록 갱신과 상태 변경이 잦은 화면입니다. 결재함 숫자와 근무 상태가 바뀔 때마다 페이지를 통째로 다시 그리면 업무 도구로 쓰기에 답답합니다. PHP 8.3에 Livewire를 얹으면 서버 코드만으로 화면 일부를 갱신할 수 있어 별도 프론트엔드 프레임워크 없이도 앱처럼 반응하는 화면이 나옵니다. 드롭다운이나 달력 넘김처럼 서버까지 갈 필요 없는 동작은 Alpine.js가 브라우저에서 처리합니다. 사내 도구는 유지보수 인력이 적어도 돌아가야 하므로 한 언어로 서버와 화면을 함께 다루는 이 조합을 골랐습니다.
출근 첫 화면의 설계
설계 기준은 아침에 열었을 때 그 화면에서 하루가 시작되느냐였습니다. 첫 화면은 인사말과 함께 지금 처리할 결재, 내 근무 상태, 오늘 일정 순으로 배치해 위에서 아래로 읽기만 하면 우선순위가 잡히게 했습니다. 결재할 문서가 있으면 대시보드에서 바로 문서로 들어가고 처리가 끝나면 다시 대시보드로 돌아오는 왕복 동선입니다. 구내식당 식단이나 이번 달 축하할 날처럼 가벼운 정보는 아래쪽에 두어 필요할 때만 눈이 가게 했습니다. 실서비스처럼 동작하는 데모라 결재 문서와 게시판 글까지 실제 회사처럼 채워 두었습니다.
화면
