Context
풀어야 했던 문제.
배경
삼성 반도체 글로벌 사이트는 AEM으로 운영되지만, 2024년 초에는 많은 페이지가 컴포넌트 대신 하드코딩(Raw code)으로 만들어지고 있었습니다.
2024년 3월 페이지별 Raw code 비율 분석을 시작으로 컴포넌트 전략 과제의 기획을 맡아, 2025년 11월까지 컴포넌트를 설계하고 개선했습니다.
문제 정의
2024년 초 이벤트 페이지의 컴포넌트 적용 비중은 평균 26%에 그쳤습니다(Memcon 2024는 16%). 나머지 영역은 매번 디자인하고 퍼블리싱해야 해서, 이벤트 페이지 하나를 기획부터 라이브까지 만드는 데 약 15.5일이 걸렸고 작은 수정도 퍼블리싱을 다시 거쳐야 했습니다.
제약사항
사업부마다 페이지 요구가 달라, 페이지 전용 컴포넌트를 늘리면 관리할 컴포넌트만 많아지는 구조였습니다.
새 컴포넌트는 데스크톱·태블릿·모바일 반응형과 운영자의 오서링 편의를 동시에 만족해야 했습니다.
Research
먼저 살펴본 것.
데이터 분석
페이지별 Raw code 비율을 두 차례(2024년 3월·12월) 분석해, 컴포넌트로 대체되지 못하는 영역이 무엇인지 찾았습니다.
그 상당수가 이미지와 텍스트를 1~4열로 배치하는 같은 패턴이었습니다. 이 패턴 하나를 범용 컴포넌트로 만들면 사이트에서 쓰이는 영역 32개, 약 40%를 덮을 수 있었습니다.
Insight
핵심 판단.
- 01페이지 전용 컴포넌트를 늘리는 대신, 자주 쓰는 범용 컴포넌트를 먼저 만들고 조합하게 하는 쪽이 운영 비용을 줄였습니다. 개발 우선순위는 범용성, 업데이트 빈도, 고객 경험 개선 필요도로 정했습니다.
- 02범용 컴포넌트 기획의 본질은 옵션을 어디까지 열지 정하는 일이었습니다. Flex Columns는 열 구성·간격·여백·배경과 기기별 레이아웃을 옵션으로 열되, 값은 정해진 단계 안에서만 고르게 해 자유도와 일관성을 함께 지켰습니다.
- 03성과는 처음부터 측정할 수 있어야 했습니다. 컴포넌트 비중, 제작 리드타임, 개발·개선 수, 소급 적용, 템플릿 수 5개 지표를 정해 두고 그 기준으로 보고했습니다.
Solution
제가 맡아 해낸 일.
핵심은 CO50 Flex Columns입니다. 1열부터 4열까지 여섯 가지 비율(1, 1:1, 1:2, 2:1, 1:1:1, 1:1:1:1)과 리스트형, 열 간격·여백·배경색을 고르고, 태블릿(가로·세로·역순·스크롤·그리드)과 모바일 레이아웃을 따로 지정할 수 있게 설계했습니다. 페이지마다 새로 디자인하고 퍼블리싱하던 레이아웃을 이제 오서링만으로 구성합니다.
2024년 6월 초안(v1.0)부터 2025년 4월 v1.9까지 운영 요청을 받아 간격 없음, 컨테이너, 등장 인터랙션, 세로 정렬 같은 옵션을 넓혔습니다.
Accordion, Tab, Carousel, Related Products, Text Block, Margin 등의 다이얼로그(오서링 화면)도 함께 설계해 조합의 빈틈을 메웠고, 이벤트 페이지는 컴포넌트 조합으로 미리 짜 둔 Global·Local 이벤트 템플릿으로 만들게 했습니다. 컴포넌트를 적용할 수 있게 된 뒤에는 Applications 하위 페이지에 소급 적용해 실제 운영에서 쓸 수 있는지 검증했습니다.
함께한 조직
고객사 웹 운영 담당, 사업부 마케팅, 디자인, 퍼블리싱, AEM 개발, 오서링·QA
화면·기획 자료
컴포넌트 조합으로 제작된 현재 공식 사이트 참고 화면입니다. 컴포넌트 기획서(Dialog UI 설계서)와 성과 보고서는 고객사 내부 자료라 싣지 않았습니다.
CES 2025 이벤트 페이지
컴포넌트 조합 템플릿을 처음 적용한 이벤트 페이지(컴포넌트 비중 100%)의 공식 사이트 화면 · 2026.10.02 캡처.
Applications — AI 페이지
컴포넌트 비중 18%에서 100%로 소급 적용한 Applications 하위 페이지의 공식 사이트 화면 · 2026.10.02 캡처.
Walkthrough
화면을 차례로.
01 / 02
CES 2025 이벤트 페이지
컴포넌트 조합 템플릿을 처음 적용한 이벤트 페이지(컴포넌트 비중 100%)의 공식 사이트 화면 · 2026.10.02 캡처.
Performance
범위와 성과.
15.5일 → 7일
이벤트 페이지 제작 기간 · 약 55% 단축 (CES 2025)
26% → 85%
이벤트 페이지 평균 컴포넌트 비중 · CES 2025는 100%
36시간 → 16시간
일반 페이지 제작 공수 · 퍼블리싱 단계 없이 제작
약 40%
Flex Columns 하나로 덮는 사이트 영역 (32개)
82개 → 97개
컴포넌트 수 · 신규 15건, 개선 93건
100%
Applications 42페이지 소급 적용 (기존 평균 28.6%)
이 프로젝트에서 얻은 것
- 01컴포넌트를 많이 만드는 것보다, 적은 컴포넌트로 많은 페이지를 만들 수 있게 하는 것이 효율의 핵심입니다.
- 02범용 컴포넌트는 한 번에 완성되지 않습니다. 실제 운영 요청을 받아 버전마다 옵션을 넓혀야 현장에서 쓰입니다.
- 03성과 지표를 처음부터 정해 두면, 컴포넌트 작업을 비용이 아니라 줄어든 제작 기간으로 설명할 수 있습니다.