인턴 프로젝트 상세 회고
인턴 3-4주차 통합본을 다시금 정리하면서 상세 회고를 작성하였다.
프로젝트 개요
-
기간: 4주
-
목표: 기능 명세서를 기반으로 차량 관리 및 근무 지원 앱 개발
-
역할: 프론트엔드 개발 담당
-
성과:
- 프론트엔드 구현 100% 완료
- UI/UX 설계 및 기능 테스트 다수 진행
- 백엔드 미완성으로 최종 연결 테스트는 불가했으나, 더미데이터 및 프론트 로직으로 충분히 검증
개발 과정
1. 초기 분석 & 기획
-
처음 제공받은 기능 명세서가 매우 간단했음 → 구체적으로 어떻게 구현해야 할지 막막
-
해결 과정:
- 차량과 연결된 태블릿 앱 직접 분석 → 실제 동작 원리와 흐름 파악
- 각 기능의 우선순위 도출 (긴급제어 > 근무일지 > 차량관리 등)
- 이를 토대로 문서화 작업을 집중 진행 → 이후 UI/UX 설계의 기준점 확보
2. 로그인 화면
-
다크모드 기본 적용, 선택 가능
-
로그인 로직:
사원번호+전산번호일치 시 로그인 성공- 테스트용 계정:
0000,1111,2222등
-
자동 로그인:
- 초기에 체크박스 옵션 제공
- 최종적으로 기본 옵션으로 고정하여 단순화
로그인 기능을 차량 제어 페이지의 접근 권한 제어와 연동해야 했기 때문에, 차량관리 및 원격제어 페이지 구현 전에 선행 작업으로 진행
3. 홈 화면
-
초기 고민: 스크롤형 UI vs 한눈에 보이는 UI
-
최종 선택: 그리드뷰 기반 → 깔끔하고 직관적인 UI
-
구성:
- 상단: 메인 제어(그리드형 버튼)
- 하단: 근무일지 전송, 연결 상태, 기타 핵심 기능 3가지
-
고려 사항:
- 홈은 핵심 기능으로 빠른 접근만 제공
- 세부 제어는 원격제어 페이지로 분리 → 중복을 줄이고 UI 단순화
4. 원격제어 페이지
-
제공 기능:
- 경광등 제어
- 소리 제어
- 사인 제어
- 전광판 제어
-
홈과 차별점:
- 홈은 기본 접근 중심
- 원격제어는 터치 1번으로 즉시 실행 가능한 직관적 구조
-
구현 중 집중한 부분:
- 기능 명세서, 기존 문서, 코드 → 3자 대조로 정확성 검증
- 긴급 버튼 클릭 시 →
WL-1,EX1활성화 정상 동작 확인 - 버튼 크기, 간격, 눌림 피드백 등을 반복 조정하며 사용자 경험 개선
5. 차량관리 페이지
-
핵심 목표: 홈/원격제어 탭 변경사항을 실시간 반영
- 예시: 전광판 밝기
50%→ 차량관리에서도 동일 반영
- 예시: 전광판 밝기
-
한계: 백엔드 미완성 → 실제 차량 동작까지는 확인 불가
-
대신 프론트 내 동기화 로직 집중 검증
- 버튼 연동 여부
- 슬라이드(밝기, 속도) 값 적용 여부
- 홈/원격제어/차량관리 탭 간 상태 일관성 테스트
6. 근무일지 전송
-
프로젝트의 핵심 요구 기능
-
요구사항:
- 기간별 조회 가능
- 순찰일지 목록 + 상세페이지 제공
- 전송 및 재전송 가능
-
개발 중 고민:
- 관리자 웹사이트 데이터를 기반으로 많은 정보를 표시해야 함
- 작은 스마트폰 화면에서 가독성을 유지하는 방법 필요
-
최종 설계:
- 상단: 기본 정보
- 하단: 5분 일지 / 1분 일지 → 탭으로 구분
- 각 탭 내 데이터는 리스트 기반으로 정렬하여 가독성 극대화
-
더미데이터:
- 단순 테스트용 데이터 → 관리자 웹사이트의 실제 데이터 구조와 동일하게 교체
- 백엔드 연결 시 즉시 적용 가능하도록 준비
7. 기타 기능
- 기능: 운전자 정보, 차량 정보, 앱 버전 확인 등
- 홈 화면의 햄버거 메뉴를 통해 접근 가능
- 각 메뉴 진입 시 다이얼로그 팝업으로 간단 확인 가능
개발 순서 & 이유
- 태블릿 앱 분석 → 실제 동작 방식 이해
- 문서 작업 → 기능 정의 및 우선순위 확립
- 홈 화면 → 가장 기본이자 중심이 되는 UI
- 원격제어 페이지 → 홈과 기능 중복, 연동성 검증
- 근무일지 기능 → 프로젝트의 핵심 요구사항
- 로그인 화면 → 기능 접근 권한과 연계 필요
- 차량관리 페이지 → 원격제어와 연동 필수
- 근무일지 상세페이지 → 실제 사용자 입장에서 가독성 테스트
- 햄버거 메뉴 기능 → 상대적으로 비중 낮은 기능
각 단계마다:
- 문서 최신화
- 테스트 진행
- UI/UX 개선
- 리팩토링 병행
트러블슈팅 & 고민
- 명세서 부족 문제 → 태블릿 분석 + 문서화 작업으로 해결
- 홈/원격제어/차량관리 간 버튼 연동 → 반복 테스트 + 로직 리팩토링
- 작은 화면 내 데이터 표시 → 탭 구조 + 리스트 UI 채택
- 다크모드, 폰트 적용 → UI 제작 단계와 병행하여 효율성 확보
최종 회고
-
아쉬운 점:
- 백엔드 미완성으로 최종 완성도는 낮음
- 실제 차량과 연동 테스트를 못한 점은 큰 한계
-
성과:
- 프론트엔드 요구사항 100% 충족
- 사용자 경험을 고려한 UI/UX 개선 지속
- 더미데이터를 실제 데이터 구조와 일치시켜, 추후 백엔드 연결 시 빠른 대응 가능
-
의의:
- 스스로 분석 → 설계 → 구현 → 테스트 전 과정을 주도
- 실무 환경에서의 개발 프로세스를 경험하고, 독립적으로 문제 해결한 경험 축적
