카톡 선물, 이제 배민에서 바로 쓰세요!
카카오톡 교환권을 배달의민족 앱에서 사용하도록 연동
고객 불편 해소 및 플랫폼 확장을 목표로 프로젝트 시작
바코드 인식 기술 도입, UX 개선 시도
다자간 협업 과정에서 소통의 중요성 강조
이진화 로직 변경을 통해 바코드 인식률 향상
고객 경험 개선을 위한 UX 최적화
카카오톡 교환권의 바코드 이미지 인식을 통해 사용성을 극대화했다.
zxing.js: 오픈소스 바코드 디코딩 라이브러리를 활용하여 이미지에서 바코드 번호 추출
문제점: ‘내 앨범에 저장’된 이미지의 노란색 테두리로 인해 인식 실패
해결: 이진화 로직 변경을 통해 노란색 테두리 문제 해결 및 인식률 향상
결과적으로, 수동 입력의 번거로움을 줄여 고객 만족도를 높였다.
바코드 인식 기술의 원리
zxing.js를 활용한 바코드 인식 과정은 다음과 같다.
이미지 로딩: 이미지를 Canvas에 렌더링하여 픽셀 데이터 추출
그레이스케일 변환: RGBA 값을 밝기값으로 변환
이진화: HybridBinarizer를 사용하여 흑백 이미지 생성
디코딩: OneDReader로 바코드 패턴 분석 및 텍스트 추출
문제 분석: HybridBinarizer의 임계값 설정 문제로 인해 인식 오류 발생
결론적으로, 이진화 방식의 개선을 통해 다양한 환경에서 바코드 인식률을 높였다.
이진화 방식 개선의 기술적 배경
바코드 이미지의 특성에 따라 최적의 이진화 방식이 다르다는 점을 파악했다.
HybridBinarizer: 블록 단위 임계값 계산 방식, 일반 이미지에 적합
중앙값 이진화: 단순 중간값 사용, 얇은 막대 바코드에 유리
개선: 두 가지 방식 모두 시도하여 인식률 극대화
결과: 다양한 바코드 형태에 유연하게 대응 가능
결과적으로, 상황에 맞는 이진화 방식 선택을 통해 인식 오류를 최소화했다.
다자간 협업을 위한 소통 전략
카카오, 쿠폰사, 배민 내부 팀 간의 원활한 소통을 위해 노력했다.
명확한 목표 공유: '플랫폼 간 연결'이라는 본질을 지속적으로 상기
맞춤형 소통: 각 팀의 관심사와 언어에 맞춰 소통 방식 변경
PM의 역할: 기술팀과 비즈니스팀 사이의 가교 역할 수행
문서화: API 명세, 회의록 등 모든 합의 사항을 문서로 기록
결론적으로, 투명한 정보 공유를 통해 오해를 줄이고 효율적인 협업을 이끌었다.
프로젝트 본질 정의의 중요성
프로젝트의 본질을 명확히 정의하고 공유하는 것이 중요했다.
문제 정의: 고객 불편함 해소 및 비즈니스 목표 달성
비즈니스 목표: 신규 고객 유입, 주문 경험 통합
본질: 플랫폼 간 장벽을 넘어선 연결
의사 결정: 본질에 부합하는지 지속적으로 자문
결과적으로, 명확한 비전은 복잡한 논의를 단순화하고 팀을 하나로 묶는 원동력이 되었다.
UX 개선을 위한 인앱 프로모션 전략
새로운 기능에 대한 고객의 이해를 돕기 위해 인앱 프로모션을 기획했다.
목표: 새로운 기능을 쉽고 빠르게 인지
전략: 세 가지 화면으로 단순화
핵심 메시지: '익숙한 교환권, 배민에서 바로 사용'
결과: 고객의 이해도를 높이고 서비스 수용도를 향상시켰다.
결론적으로, 고객 중심의 메시지 전달을 통해 새로운 기능에 대한 거부감을 줄였다.
