프로젝트 배경
1) 문제점
도매업체와 소매업체 간 거래가 전화, 문자, 카톡 등 여러 채널로 분산되어 체계적인 관리가 어려움
견적서와 거래 내역이 개별적으로 관리되어 과거 거래 정보 추적이 불가능
수기로 작성된 주문서나 엑셀 파일로 관리하다 보니 실수와 누락이 빈번히 발생
새로운 거래처 발굴이 인맥에만 의존하여 사업 확장에 한계
재고 현황을 실시간으로 공유할 수 없어 품절이나 과잉 재고 문제 발생
2) 프로젝트 목표
통합 거래 관리: 모든 거래 과정을 하나의 플랫폼에서 관리할 수 있는 시스템 구축
실시간 견적 시스템: 도매업체가 등록한 상품에 대해 소매업체가 즉시 견적을 요청하고 받을 수 있는 기능 개발
거래처 매칭: 카테고리별, 지역별로 새로운 거래처를 쉽게 찾고 연결할 수 있는 기능 구현
재고 관리 자동화: 실시간 재고 현황 공유 및 자동 알림 시스템 구축
거래 데이터 분석: 월별 거래 추이, 인기 상품 분석 등 비즈니스 인사이트 제공
3) 주안점
직관적인 UI/UX 설계로 IT에 익숙하지 않은 사용자도 쉽게 사용 가능
모바일 반응형 디자인으로 현장에서도 즉시 주문 및 확인 가능
거래 안전성 확보를 위한 전자계약 시스템 도입
실시간 메시징으로 빠른 의사소통 지원
데이터 기반 의사결정을 위한 다양한 통계 및 분석 기능 제공
도매업체와 소매업체 간 거래가 전화, 문자, 카톡 등 여러 채널로 분산되어 체계적인 관리가 어려움
견적서와 거래 내역이 개별적으로 관리되어 과거 거래 정보 추적이 불가능
수기로 작성된 주문서나 엑셀 파일로 관리하다 보니 실수와 누락이 빈번히 발생
새로운 거래처 발굴이 인맥에만 의존하여 사업 확장에 한계
재고 현황을 실시간으로 공유할 수 없어 품절이나 과잉 재고 문제 발생
2) 프로젝트 목표
통합 거래 관리: 모든 거래 과정을 하나의 플랫폼에서 관리할 수 있는 시스템 구축
실시간 견적 시스템: 도매업체가 등록한 상품에 대해 소매업체가 즉시 견적을 요청하고 받을 수 있는 기능 개발
거래처 매칭: 카테고리별, 지역별로 새로운 거래처를 쉽게 찾고 연결할 수 있는 기능 구현
재고 관리 자동화: 실시간 재고 현황 공유 및 자동 알림 시스템 구축
거래 데이터 분석: 월별 거래 추이, 인기 상품 분석 등 비즈니스 인사이트 제공
3) 주안점
직관적인 UI/UX 설계로 IT에 익숙하지 않은 사용자도 쉽게 사용 가능
모바일 반응형 디자인으로 현장에서도 즉시 주문 및 확인 가능
거래 안전성 확보를 위한 전자계약 시스템 도입
실시간 메시징으로 빠른 의사소통 지원
데이터 기반 의사결정을 위한 다양한 통계 및 분석 기능 제공
프로젝트 성과
거래 처리 시간 90% 단축
기존 전화와 카톡으로 2-3시간 걸리던 견적 요청 및 확인 과정이 플랫폼 도입 후 10-15분으로 단축되었습니다. 실시간 견적 시스템으로 즉각적인 가격 비교와 주문이 가능해졌습니다.
월간 신규 거래처 발굴 5배 증가
인맥 위주로 월 2-3개 업체와 거래하던 것이 카테고리별 매칭 시스템을 통해 월 평균 15개 신규 거래처와 연결되었습니다. 지역별, 품목별 검색으로 거래 기회가 확대되었습니다.
재고 관리 정확도 95% 향상
수기와 엑셀로 관리하여 30% 이상 발생하던 재고 오차가 실시간 재고 관리 시스템 도입 후 5% 미만으로 감소했습니다. 품절 및 과잉 재고로 인한 손실이 크게 줄었습니다.
거래 문서 관리 효율성 개선
종이 문서와 개별 파일로 흩어져 있던 거래 내역을 통합 관리하여 과거 거래 조회 시간이 30분에서 1분으로 단축되었습니다. 전자계약으로 문서 분실 위험도 제거했습니다.
핵심 기능
완벽한 반응형 디자인
업계 특성상 오프라인 작업이 많은 도소매 현장을 고려하여 모바일, 태블릿, 데스크탑 모든 기기에서 최적화된 UI를 제공합니다. 창고나 매장 어디서든 즉시 주문과 확인이 가능합니다.
실시간 견적 요청 시스템
도매업체가 등록한 상품에 대해 소매업체가 원클릭으로 견적을 요청하고 실시간으로 응답받을 수 있습니다. 여러 도매업체의 견적을 한 화면에서 비교하여 최적의 거래처를 선택할 수 있습니다.
통합 비즈니스 대시보드
월별 거래 추이, 카테고리별 매출 비중, 인기 상품 순위 등을 실시간 차트로 시각화합니다. Chart.js를 활용하여 복잡한 거래 데이터를 직관적으로 파악하고 빠른 의사결정을 지원합니다.
진행 단계
기획서 확인 및 요구사항 파악
2024.03.
도매업체와 소매업체의 실제 거래 프로세스를 조사하고, 기존 오프라인 거래의 문제점을 분석했습니다. 사용자 인터뷰를 통해 견적 관리, 재고 확인, 거래처 관리 등 핵심 요구사항을 도출했습니다.
플랫폼 기획
2024.03.
수집된 요구사항을 바탕으로 도매업체와 소매업체별 맞춤형 기능을 정의했습니다. 실시간 견적 시스템, 통합 대시보드, 전자계약 등 주요 기능의 사용자 시나리오와 화면 흐름을 구체화했습니다.
프로젝트 구체적인 설계
2024.03.
Laravel 프레임워크 기반의 시스템 아키텍처를 설계하고, 데이터베이스 구조를 정의했습니다. Tailwind CSS를 활용한 반응형 UI 디자인과 Chart.js를 이용한 데이터 시각화 방안을 수립했습니다.
본격적인 프로젝트 개발 진행
2024.04.
프론트엔드는 Blade 템플릿과 Tailwind CSS로 구현하고, 실시간 차트와 동적 이미지 검색 API를 연동했습니다. 사이드바 네비게이션과 역할별 대시보드 등 핵심 기능을 단계적으로 개발했습니다.
배포 및 유지보수 등 프로젝트 완료
2024.09.
사용자 피드백을 반영하여 UI/UX를 개선하고, 이미지 로딩 최적화 및 차트 렌더링 안정화 작업을 진행했습니다. 관리자 페이지의 헤더/푸터 제거 등 사용성 향상을 위한 세부 조정을 완료했습니다.
프로젝트 상세
1) 포트폴리오 소개
도매업체와 소매업체를 위한 B2B 도소매 거래 중개 플랫폼 개발
중소 도매업체와 소매점주들이 효율적으로 거래할 수 있도록 연결하는 비즈니스 매칭 서비스로, 실시간 견적 시스템과 통합 거래 관리 기능을 제공합니다.
2) 작업 범위
화면 설계 및 UI/UX 디자인
Front-end 개발 (Laravel Blade, Tailwind CSS)
관리자 대시보드 개발
실시간 데이터 시각화 (Chart.js)
이미지 검색 API 연동 (Unsplash API)
반응형 웹 디자인 구현
사이드바 네비게이션 시스템 구축
3) 주요 업무
실시간 견적 요청 및 관리 시스템 구현
상품 관리 페이지 (동적 이미지 검색 기능 포함)
비즈니스 대시보드 (월별 거래 추이 차트, 카테고리별 거래 비중 분석)
도소매 업체별 회원가입 프로세스 구현
거래처 간 실시간 메시지 시스템
전자계약 관리 기능
카테고리별 상품 필터링 및 재고 관리
거래 현황 모니터링 및 통계 분석 기능
4) 주안점
사용자 경험 최적화: 도소매 업체별 맞춤형 인터페이스 제공
실시간 데이터 시각화: Chart.js를 활용한 직관적인 비즈니스 인사이트 제공
효율적인 상품 관리: API 연동을 통한 동적 이미지 검색으로 상품 등록 프로세스 간소화
모바일 반응형 디자인: 현장에서도 쉽게 사용할 수 있는 UI 구현
관리자 전용 환경: 헤더/푸터를 제거한 몰입형 관리 인터페이스 구성
도매업체와 소매업체를 위한 B2B 도소매 거래 중개 플랫폼 개발
중소 도매업체와 소매점주들이 효율적으로 거래할 수 있도록 연결하는 비즈니스 매칭 서비스로, 실시간 견적 시스템과 통합 거래 관리 기능을 제공합니다.
2) 작업 범위
화면 설계 및 UI/UX 디자인
Front-end 개발 (Laravel Blade, Tailwind CSS)
관리자 대시보드 개발
실시간 데이터 시각화 (Chart.js)
이미지 검색 API 연동 (Unsplash API)
반응형 웹 디자인 구현
사이드바 네비게이션 시스템 구축
3) 주요 업무
실시간 견적 요청 및 관리 시스템 구현
상품 관리 페이지 (동적 이미지 검색 기능 포함)
비즈니스 대시보드 (월별 거래 추이 차트, 카테고리별 거래 비중 분석)
도소매 업체별 회원가입 프로세스 구현
거래처 간 실시간 메시지 시스템
전자계약 관리 기능
카테고리별 상품 필터링 및 재고 관리
거래 현황 모니터링 및 통계 분석 기능
4) 주안점
사용자 경험 최적화: 도소매 업체별 맞춤형 인터페이스 제공
실시간 데이터 시각화: Chart.js를 활용한 직관적인 비즈니스 인사이트 제공
효율적인 상품 관리: API 연동을 통한 동적 이미지 검색으로 상품 등록 프로세스 간소화
모바일 반응형 디자인: 현장에서도 쉽게 사용할 수 있는 UI 구현
관리자 전용 환경: 헤더/푸터를 제거한 몰입형 관리 인터페이스 구성



