X2BEE는 최근 Store Front 시스템을 개발하여, 솔루션에 포함을 시켰습니다. 이에 따라서 X2BEE의 표준 Store Front 시스템을 사용하면 보다 빠르게 다양한 Store Front (Frontend shop)을 구성할 수 있습니다. X2BEE는 mobile-first 전략에 따라서 모바일 기준의 반응형으로 제작되어 PC와 동시에 지원하도록 구현되어 있습니다.

최신 기술스택을 활용하고 X2BEE의 장점인 MACH 아키텍처에 적합하도록 개발이 되었습니다. 각각의 특징에 대해서 살펴보도록 하겠습니다.

최신 기술스택의 적용

X2BEE의 Store Front는 React 프레임웍 기반으로 Next.js, TypeScript, Tailwindcss로 구현이 되었습니다. React는 META가 개발하여 배포하는 오픈소스로 전세계 개발자 커뮤니티의 강력한 지원을 받고 있습니다.

또한 Next.js를 사용하여 UI 컴포넌트를 라이브러리화 시켜서 재사용성을 극대화하였습니다. TypeScrip와 Tailwindcss를 사용하여 개발 생산성을 높이고, 개발자가 UI 라이브러리를 재사용하여 빠르게 수정 및 배포가 가능하도록 구현을 했습니다.

Next.js의 특징

개발자들은 플래티어의 X2BEE Techhub에서 제공하는 개발가이드를 따라서 X2BEE를 이용하여 Store Front를 쉽고 빠르게 구축할 수 있습니다. (개발가이드 바로가기)

표준화된 스토리보드, 디자인 시스템, 컴포넌트/퍼블리싱 시스템 제공

일반적으로 커머스의 Store Front를 구현하기 위해서는
기획 > 디자인 > 퍼블리싱 > 개발 단계를 거치게 됩니다.

이에 따라서 기획에서는 스토리보드를 작성하고, 디자인에서는 디자인툴을 이용하여 디자인을 하게 됩니다. 이후 퍼블리셔가 UI 컴포넌트를 만들고 웹 페이지를 퍼블리싱합니다. X2BEE는 이러한 과정에 필요한 각 산출물들을 제공하고 있으며, 커머스에서 많이 사용하는 기능과 컴포넌트를 구현하여 표준화된 시스템으로 제공하고 있습니다.

표준 스토리보드 제공

X2BEE가 분류한 각 모듈별도 커머스에서 필요한 일반적인 기능과 화면에 대해서 정의된 스토리보드를 제공해드립니다. 고객은 이를 기본으로 고객에게 특화된 기능이나 커스터마이징, 화면 배치 등을 수정하셔서 사용하시면 됩니다.

피그마로 제작된 디자인 시스템 및 화면 디자인 제공

디자인은 figma를 이용하여 디자인 시스템을 작성하고, 이에 따라서 화면이 디자인되어 있습니다. 디자이너는 폰트의 종류를 수정하면 전체 디자인에 폰트가 자동으로 변경되어 적용이되고, Primary, Secondary Color 들 원하시는 컬러를 변경하면 전체 디자인에 적용되도록 구성되어 있습니다. 이를 통해 브랜드만의 아이덴티티를 빠르게 적용할 수 있습니다.

컴포넌트 라이브러리 및 퍼블리싱 파일 제공

Next.js를 이용하여 Store Front에 사용하는 다양한 UI 컴포넌트를 라이브러리화 시켜서 제공해드립니다. 또한 개별 페이지에 대한 화면도 동시에 제공하고 있습니다. Tailwindcss를 사용하여 공통 요소를 관리하고 있으며, 디자인과 마찬가지로 브랜드의 아이덴티티에 적합한 색상, 아이콘 등을 수정하면 전체 페이지에 적용될 수 있도록 구성이 되어 있습니다.

Store Front 소스코드 포함

X2BEE는 이러한 표준화된 Store Front 개발 단계를 거쳐서 최종적으로 화면에 표시되는 웹 사이트에 대한 소스코드를 동시에 제공합니다. 표준화된 Store Front 개발 프로세스에 따라서 고객은 보다 빠르고 쉽게 커머스 사이트를 개발하고 서비스를 시작하실 수 있습니다.

X2BEE는 MACH 아키텍처 기반에 컴포저블 커머스 솔루션으로 개발되었습니다. 이러한 진보된 기술 스택에 따라서 개발된 X2BEE는 기능상 차별화되는 특장점을 보유하고 있습니다. 각 기능별로 X2BEE가 가진 특장점을 살펴보도록 하겠습니다.

1. 상품/전시

X2BEE는 상품정보 관리체계를 이원화해서 관리를 합니다. ERP나 회사 내부의 회계/재고 등 표준화된 분류와 연동하여 사용하는 표준정보 및 카테고리 기능을 제공합니다. 이는 기존 시스템의 기준 정보를 그대로 활용하고 연계하여 사용하는 것을 가능하게 해줍니다.

또한 별도의 전시카테고리 기능을 사용하여, 표준카테고리에서 사이트의 필요에 맞게 카테고리명을 변경하거나, 카테고리 분류를 통합 또는 세분화하여 사이트에 자유롭게 노출할 수 있도록 합니다. 동일한 제품을 멀티 사이트에 노출하고자 할 때도 전시카테고리를 새로이 작성하여 사이트별로 서로 다른 카테고리로 전시할 수 있습니다.

X2BEE는 멀티사이트를 관리하거나 몰인몰을 구성하여 사용할 수 있는 기능을 제공합니다. 각각의 사이트나 몰은 서로 다른 페이지 형식을 가질 수 있는데, 이를 전시템플릿으로 관리하여 관리의 편의성을 획기적으로 높였습니다.

전시 코너라는 특정 기능들(배너, 이미지, 동영상, 텍스트, 스와이프, 상품, 기획전, HTML 등)을 조합하여 템플릿을 구성하면, 사이트나 기획전, 매장, 컨텐츠 등을 쉽게 관리하고 자동으로 코너의 컨텐츠를 업데이트할 수 있습니다. 템플릿을 추가하고, 코너를 연결하면 새로운 상품을 전시하거나, 특정 사용자를 위한 매장 등을 자유롭게 구성할 수 있도록 해줄 수 있습니다.

또한 파트너 오피스 기능을 통해서, 파트너가 등록한 상품을 승인한 후에 노출할 수 있는 프로세스를 제공하여, 자사의 상품뿐만 아니라 파트너의 상품도 관리하고 전시할 수 있도록 구현되어 있습니다.

2. 회원/프로모션

일반회원, 임직원회원, 간편회원 등 다양한 유형의 회원을 쉽게 관리할 수 있도록 구현이 되어 있습니다. 회원이 유형이나 등급 등을 설정하고 관련 혜택을 설정하여 쉽고 빠르게 회원관리가 가능합니다. 회원 Lifecycle 관리 기능이 내장되어 있어서 회원 가입 프로세스부터 등급 관리, 변경 관리, 탈퇴관리까지 일관되게 관리할 수 있습니다.

X2BEE는 고객 로열티 프로그램을 쉽게 관리할 수 있을 뿐만 아니라 다양한 프로모션 기능을 제공합니다. 다양한 프로젝트 경험을 바탕으로 커머스에서 많이 사용하는 이벤트와 프로모션 관리를 기본적으로 제공하여 설정만으로 상품할인, 장바구니, 중복할인, 배송비등의 쿠폰 발행/지급이 가능한 쿠폰관리 기능 및 구매할인/마일리지, 구매 사은행사 등 종합 쇼핑몰 수준의 다양한 고객 혜택 및 프로모션 관리 기능을 제공합니다.

또한 이벤트 속성에 따라 다양한 설정으로 유연한 이벤트 진행이 가능한 관리 기능을 지원하고 이벤트 응모이력조회 및 이벤트 댓글관리 등 효율적 이벤트 운영관리할 수 있는 기능을 제공합니다.

3. 주문/배송/CS

주문/배송/CS 업무영역에 종합몰 수준의 정책 및 업무프로세스를 적용하여 고객 셀프서비스 기능을 제공하고, 상담원을 통한 원스탑 고객서비스 기능을 통해 고객 만족도를 향상시킵니다. 

주문/결제와 관련된 Self 클레임처리 프로세스와 자동화가 적용되어 있으며, 취소/반품 시에 마일리지 환원 및 자동 쿠폰 복원 처리가 가능합니다. 컴포저블 커머스의 장점을 적용하여, 다양한 PG와 결제수단을 설정만으로 적용할 수 있도록 구현되어 있습니다. (현재 이니시스는 통합이 완료되어 있으며, 다양한 PG사로 확장 중입니다.)

협력사/배송담당자의 배송/회수/교환 업무를 효율적으로 지원할 수 있도록 표준화된 프로세스와 기능을 제공하고 있습니다. 또한 주문 상태에 따라서 자동으로 출고지시하고 고객에게 알림을 발송합니다. 배송추적은 스윗트랙커를 통해 즉시 적용이 가능하며, 다른 서비스와도 연동하여 사용이 가능합니다.

원스탑 처리 지원이 가능한 통합상담관리 기능이 내장되어 있으며, 1:1 문의부터 고객보상 업무까지 처리가 가능합니다. 상담원관리 뿐만 아니라 상담유형, 상담할당, 상담사 보상권한 설정 등을 통해 커머스에서 빠르게 CS업무를 처리하여 고객 만족도를 높일 수 있는 기능을 제공합니다.

4. 개인화 AI 마테크 - groobee 연동

X2BEE는 자사의 AI 기반 초개인화 및 마케팅 솔루션인 groobee와 연동을 통해서 차별화된 쇼핑을 제공하고 이를 통해 매출을 증대시킬 수 있습니다. API 를 통해서 연동이 되어 있으며, X2BEE Cloud에는 groobee와 타이트하게 통합하여 제공할 예정입니다.

groobee에 대한 자세한 내용은 groobee 홈페이지를 참고하세요. (바로가기)

5. 검색

X2BEE Search는 이커머스에 특화된 검색엔진으로 AI 기반 시맨틱 검색과 이미지 검색, 추천 검색을 지원합니다

시맨틱 검색은 자연어 처리, 머신러닝 등 AI 기술을 사용하여 사용자의 검색 의도를 이해하고, 더 적합한 상품을 빠르고 정확하게 찾아줍니다. 이미지 검색은 사용자가 특정 제품의 이름을 정확히 알지 못하거나, 원하는 스타일을 설명하기 어려울 때 이미지 업로드를 통해 쉽게 유사 상품을 찾을 수 있도록 합니다. 이는 특히 패션, 가구, 인테리어 등 시각적 요소가 중요한 상품군에서 매우 유용하게 활용되고 있습니다.

또한, X2BEE AI Search는 사용자가 원하는 상품이나 콘텐츠를 더욱 손쉽게 찾을 수 있도록 다양한 검색 기능을 제공합니다. 자동완성, 인기 검색어, 추천 검색어는 물론 오타 교정, 금칙어 처리, 동의어/유사어/신조어, 다국어 검색까지 지원해 사용자의 편의성을 극대화합니다.

이를 통해 고객은 별도의 검색엔진을 구매할 필요 없이, 오픈소스 검색엔진으로 구현하기 어려웠던 고급 검색 기능을 X2BEE AI Search 엔진에서 곧바로 활용할 수 있습니다.

X2BEE는 이외에서 다른 커머스 솔루션과 차별화되는 다양한 기능적 특장점을 지니고 있습니다. 이러한 기능적 특장점과 더불어, 뛰어난 기술적인 특장점을 동시에 가지고 있습니다. 다음 포스팅에서는 기술적인 특장점에 해당되는 내용에 대해서 좀 더 자세하게 알아보도록 하겠습니다.

이커머스 비즈니스가 IT를 기반으로 하고 있는 만큼 이커머스 기업들은 IT 역량 및 기술을 고도화하여 시장 경쟁력을 확보하는데 주력하고 있습니다. 그렇다면, 최근 이커머스 산업에서 주목하고 있는 기술 트렌드는 무엇일까요?

단연, 컴포저블 커머스(Composable Commerce)가 아닐까 합니다.

컴포저블 커머스는 2021년 가트너가 처음 제안한 용어로 비즈니스 요구에 맞게 구성 가능한 모듈형 상거래 아키텍처를 말합니다. 마치 레고 블록처럼 다양한 기능을 독립적인 모듈로 구성하고 필요에 따라 자유롭게 조합할 수 있다고 생각하면 되는데요. 이를 통해 기업에서는 언제든 새로운 기능을 만들고, 변화무쌍한 비즈니스 환경에 민첩하고 유연하게 대응할 수 있습니다. 컴포저블 커머스가 등장하기까지 이커머스 플랫폼은 어떻게 발전해 왔을까요?

이커머스 플랫폼의 발전

이커머스 플랫폼은 1990년 초기 웹 기반 상거래를 시작으로 시장의 변화 및 IT 기술의 성장과 함께 계속해서 발전해 오고 있습니다.
인터넷 및 스마트폰 보급 등과 같은 기술의 발전과 코로나 펜데믹과 같은 사회 이슈는 소비자의 소비 행태에 영향을 주면서 사람들의 쇼핑 방식과 비즈니스 운영 방식을 근본적으로 변화시켜 왔습니다. 기술이 발전하고 소비 행태가 변화함에 따라 소셜 커머스, AR/VR, 개인화된 쇼핑 경험과 같은 새로운 트렌드가 이커머스의 미래를 바꾸고 있습니다.

이커머스 1.0 (모놀리식)

"온라인 비즈니스의 시작"
이커머스 1.0은 최초의 온라인 상점이 등장하면서 PC를 기반으로 한 기본적인 구매나 결제 기능을 제공하는 시기였다고 볼 수 있습니다. 이후에는 가격비교 사이트가 출현하면서 이커머스에서 '가격'이 가장 중요한 요소로 여겨지며, 고객 편의성을 위한 이커머스 기능 및 플랫폼의 개선보다 다양한 상품 및 저가 경쟁이 치열했던 시기입니다.

이커머스 2.0 (헤드리스)

"모바일 기반 새로운 커머스 플랫폼 등장"
2000년대 초반에 모바일 기기의 출현과 함께 온라인 쇼핑에 대한 물리적 제약이 사라지고, 언제 어디서든 상품을 검색하고 구매할 수 있는 여건이 마련되었습니다. 이에 따라 기업은 간편결제, 배송과 같은 다양한 이커머스 기능을 강화하고 여러 채널을 활용하여 고객에게 더 많은 정보와 쇼핑 편의성을 제공하는데 주력하였습니다.
이 때 등장한 헤드리스는 ‘프론트엔드’와 ‘백엔드’가 분리된 기술로, 프론트엔드와 백엔드가 하나로 패키지화되어 있는 모놀리식과 달리 신속한 전개 및 보완이 가능하고 손쉽게 다양한 채널을 연동하여 비즈니스 변화에 유연한 대응을 가능하게 했습니다.

이커머스 3.0 (컴포저블)

"데이터 기반의 개인화 경험 제공"
이커머스 3.0에서 중요한 것은 고객 기반의 소비가 이루어질 수 있도록 하는 것입니다. 즉, 고객의 구매 및 행동에 대한 중요한 데이터를 수집하여 소비자 취향을 고려한 제품, 서비스 및 마케팅 캠페인을 개인화하는 것을 말하는데요. 이러한 개인화된 커머스 전략을 채택하기 위해서는 변화에 맞춰 그때 그때 필요한 부분을 신속하게 수정/보완하거나 새로운 서비스를 빠르게 적용하여 환경에 대응하는 것이 중요합니다.

이를 위해서는 유연성 및 민첩성을 제공하는 컴포저블 커머스로 구조의 변화가 필요한데요. 컴포저블 커머스는 헤드리스를 한 단계 더 발전시킨 것으로 비즈니스 상황에 맞는 최적의 솔루션을 개별적으로 구성할 수 있다는 장점이 있습니다.

그렇다면, 컴포저블 커머스에 대해서 조금 더 자세히 알아볼까요?

컴포저블 커머스란?

컴포저블 커머스는 이커머스 플랫폼을 구축하기 위한 모듈식 접근 방식을 말하며, 기업은 다양한 기술을 선택하고 통합하여 맞춤형 이커머스 스택을 만들 수 있습니다. 쉽게 말해 주문/결제/배송관리/프로모션 등 이커머스 시스템을 구성하는 요소들을 모듈식으로 비즈니스 상황에 맞게 개발적으로 구성하는 방식을 의미합니다. 각 모듈화된 기능은 시스템의 다른 부분에 영향을 주지 않아 특정 부분만 교체할 수 있어 뛰어난 유연성 및 확장성을 제공합니다.

MACH 기술 방법론

MACH 기술 방법론은 글로벌 IT 기술 선도 그룹 ‘MACH Alliance’에서 제시하였으며, 컴포저블 커머스를 구현하기 위해서는 MACH(Microservices, API-first, Cloud-Native 및 Headless)와 같은 기술 설계 원칙을 기반으로 합니다.

“ MACH 아키텍처는 기업이 시장에서 가장 좋은 도구 중에서 선택할 수 있는 자유를 제공하고 향후 이러한 도구를 쉽게 추가, 교체 또는 제거할 수 있는 구조를 유지할 수 있습니다”

MACH Alliance

MACH 구성 기술

• Microservices based : 개별 기능들을 독립적으로 개발 및 배포가 가능하도록 구성하는 방식

• API-first : 모든 기능이 API를 통해 연결

• Cloud-Native SaaS : 클라우드 환경을 통한 탄력적인 확장 및 자동 업데이트 등 운영 효율성 향상

• Headless : 프론트엔드와 백엔드 로직 및 채널, 프로그래밍 언어가 분리되어 있는 개발 환경

Headless와 차이점

컴포저블 및 헤드리스 커머스는 비슷한 개념이지만 동일하지는 않습니다. 프런트엔드와 백엔드가 분리된 환경은 같지만 헤드리스는 아키텍처에 대한 모듈식 접근 방식을 포함하지는 않으며 구성 요소 간의 독립성 수준은 컴포저블 커머스만큼 높지 않습니다. 이러한 부분을 주요 차이점으로 볼 수 있으며, 헤드리스는 컴포저블 커머스를 구현하기 위한 하나의 구성 기술로 이해할 수 있습니다.

컴포저블 커머스의 주요 이점

1. 유연성 및 민첩성 증가

컴포저블 커머스 플랫폼은 백엔드를 개별 구성 요소로 분리합니다. 따라서, 전체 이커머스 시스템을 교체하지 않고도 구성 요소(모듈)만 선택·교환·분리하여 가장 적합한 이커머스 시스템을 만들 수 있습니다. 이는 곧 기업들이 변화하는 시장 상황에 유연하고 민첩하게 대처할 수 있도록 합니다. 가트너는 컴포저블 방식을 채택한 조직의 신기능 구현 속도가 경쟁사 대비 80% 앞설 것으로 예측한 바 있습니다.

2. 시간 및 비용 효율성

컴포저블 커머스는 새로운 기능 개발 및 테스트를 신속하게 진행할 수 있도록 합니다. 독립적인 모듈 구조 덕분에 기능 개발 및 테스트를 전체 플랫폼에 영향을 주지 않고 진행할 수 있어 혁신 속도를 높일 수 있습니다. 또한, 불필요하거나 비효율적인 요소에 들어가는 비용과 리소스를 줄이고, 점진적으로 시스템을 업그레이드하여 비용을 분산하고 신속하게 부가가치를 생성할 수 있습니다. 이를 통해 기업은 고객에게 보다 좋은 서비스를 제공하고, 수익을 창출하는 등 중요한 일에 집중할 수 있으므로 장기적으로 시간과 비용을 절약할 수 있습니다.

3. 고객 경험 향상

고객 경험은 이커머스의 성패를 좌우하는 요소입니다. 컴포저블 커머스를 도입하면 통일된 브랜딩과 향상된 고객 경험을 제공할 수 있습니다. 모듈식 구성 요소를 활용함으로써 기업은 제품 검색부터 결제까지 고객 여정의 모든 접점을 최적화하여 더 높은 수준의 고객 만족도와 충성도를 달성할 수 있습니다.

4. 규모의 무한 확장

컴포저블 커머스를 통해 새로운 시장으로의 확장, 다양한 브랜드 운영, 신규 채널 도입, 비즈니스 모델 테스트 등을 쉽게 도전해볼 수 있습니다. 또한 컴포저블 커머스는 구성 요소를 재사용할 수 있어 개발 시간을 단축시킵니다. 이를 통해 기업은 이전보다 더 빠르게 새로운 기능과 캠페인 등을 시작할 수 있습니다.

5. 다양한 기술 활용

컴포저블 커머스는 인공지능, 사물인터넷, 빅데이터 등 다양한 기술을 쉽게 통합할 수 있습니다. 이를 통해 몰입형 쇼핑 경험, 데이터 기반 의사 결정 등을 제공할 수 있습니다.

컴포저블 커머스 도전 과제

컴포저블 커머스는 기존 이커머스 플랫폼의 한계를 극복하고 유연성과 확장성을 향상시키는 새로운 아키텍처로 주목받고 있습니다. 그러나 컴포저블 커머스는 다양한 기술과 컴포넌트를 통합해야 하기 때문에 기술적 복잡성과 전문 기술 인력 부족 등에 대한 도전과제가 존재합니다.

”X2BEE는 이러한 도전 과제의 해결책을 제시합니다”

X2BEE는 기업이 컴포저블 커머스 도입의 도전 과제를 극복하고 성공적인 커머스 플랫폼을 구축할 수 있도록 지원합니다. 이커머스 기능, 안정적이고 유연한 인프라, 개인화 마케팅, 인공지능 등 다양한 영역에서 최신 IT 기술을 적용해 고객 비즈니스 모델에 최적화된 이커머스 플랫폼을 구축합니다.
또한 X2BEE는 다양한 기술 파트너와 협업으로 고객이 이커머스 시스템을 확장하고 새로운 서비스를 손쉽게 적용할 수 있도록 지원하는 에코시스템을 제공하고 있습니다.

최초의 온라인 상점부터 지금까지, 이커머스 시장과 기술의 발전을 간략히 알아보았는데요. 이커머스 생태계는 IT 기술의 발전을 큰 축으로 지속해서 성장해 온 것을 알 수 있습니다. 컴포저블 커머스는 지나가는 하나의 이커머스 트렌드 기술이 아니라 변화하는 시장에 유연하게 대응하기 위한 전략이며, 이커머스 4.0으로 도약하기 위한 준비 과정이 될 것입니다.

[참고자료]

What is composable commerce, and how does it work?

새로운 이커머스 트렌드, 컴포저블 커머스 (1)

Enterprise MACHified

https://www.deptagency.com/insight/the-benefits-of-mach-for-your-e-commerce-experience/

https://elogic.co/blog/composable-commerce-definition-benefits-examples/