프로젝트 배경
업주들이 CJ프레시웨이 식자재몰을 이용하여 이커머스와 같은 서비스를 위한 플랫폼으로써, 업주에 커스텀된 플랫폼이라고 볼수 있습니다. 사업방향성은 이 플랫폼을 네이버, 식객, 식봄, OKPOS 등 요식업체 관련한 플랫폼에 CJ프레시웨이 식자재몰을 모듈화 해서 개발해야 어디든 붙여서 쓸수 있다는것이 CJ측의 요구사항 및 사업 방향성 입니다. 그에 따라 프론트는 모듈성이 좋은 리액트를 선택한것이고 그에따라 화면 개발 및 디자인을 사업 방향성에 맞춰 고려하여 공통/모듈 스타일 작업, UI컴포넌트 체계화 등을 작업했습니다.
프로젝트 성과
개발 모듈성 성과
OKPOS에 서비스되어 제공중이며, 자체 식자재몰을 성공적으로 이관하였음.
핵심 기능
공통설계, 모듈 설계를 동시에
플랫폼 상황에 따라 전체 아이콘이나 공통으로 적용되는 것들을 효과적으로 사용하기위해 공통/모듈화 스타일 가이드에 주안점을 두고 진행하여, 유연하게 다음 플랫폼에 적용할수 있는 것이 핵심 기능
진행 단계
기획 및 요구사항 정리
2024.03.
사업의 방향성이 플랫폼이지만 리액트 컴포넌트 모듈화를 원한다는 것에 고객의 요구사항을 파악
디자인 단계
2024.03.
피그마를 활용 기획자와 긴밀하게 소통하였고, OKPOS 가이드에 맞춰 진행하였지만, 추후 모듈성을 위해 CJ프레시웨이 가이드에 맞춰 시안 또한 진행하고, 피그마의 컴포넌트 기능과 variable한 유연성을 가지도록
화면개발단계
2024.04.
아토믹된 디자인을 기반으로 계층 구조, 분리 설계 하여, 어떤 상황에서도 유연하게 적용할수 있는 화면 컴포넌트 개발에 초점을 두고, 착수하였고 추후 유지보수까지 염두해 두고, 가이드라인까지 수립하였음.
프로젝트 상세
1) 포트폴리오 소개 : OKPOS앱 오늘얼마에 들어가는 앱인앱(CJ프레시웨이의 "Smart RS")입니다.
2) 작업 범위 : 개발에 참여한 범위 및 지원환경
- 리액트 컴포넌트 화면개발, API작업 제외하고, 프론트 개발
3) 주요 업무 : 전체페이지 디자인(가이드라인 엄수), 리액트(CJ표준)로 화면 개발
4) 주안점 : 디자인, 개발 시 중점이 되었던 사항
- OKPOS앱 오늘얼마에 들어가는 앱인앱으로써 OKPOS가이드라인에 사용성높고 트렌디한 UX를 접목하여 피그마에 제작하였고, 유지보수 또한 감안하여 OKPOS앱 오늘얼마에 들어가는 앱인앱으로써 OKPOS가이드라인에 사용성높고 트렌디한 UX를 접목하여 피그마에 제작하였고, 유지보수 또한 감안하여 쉽게 설계하여 피그마 컴포넌트, UI들을 잘 설계하여 전달하였고, 고객사에서도 이를 활용하여 지속적으로 사용 제작하고 있습니다. 또한 gulp.js로 시작하여 react가 표준화되어 react로 코드를 이관하는 작업까지 수행하여 고객사에 신뢰와 만족도를 높여 좋은 평가와 품질좋은 코드로 완수하였습니다.
2) 작업 범위 : 개발에 참여한 범위 및 지원환경
- 리액트 컴포넌트 화면개발, API작업 제외하고, 프론트 개발
3) 주요 업무 : 전체페이지 디자인(가이드라인 엄수), 리액트(CJ표준)로 화면 개발
4) 주안점 : 디자인, 개발 시 중점이 되었던 사항
- OKPOS앱 오늘얼마에 들어가는 앱인앱으로써 OKPOS가이드라인에 사용성높고 트렌디한 UX를 접목하여 피그마에 제작하였고, 유지보수 또한 감안하여 OKPOS앱 오늘얼마에 들어가는 앱인앱으로써 OKPOS가이드라인에 사용성높고 트렌디한 UX를 접목하여 피그마에 제작하였고, 유지보수 또한 감안하여 쉽게 설계하여 피그마 컴포넌트, UI들을 잘 설계하여 전달하였고, 고객사에서도 이를 활용하여 지속적으로 사용 제작하고 있습니다. 또한 gulp.js로 시작하여 react가 표준화되어 react로 코드를 이관하는 작업까지 수행하여 고객사에 신뢰와 만족도를 높여 좋은 평가와 품질좋은 코드로 완수하였습니다.
