뛰어난 고객 경험 제공 위한 셔터스톡 ‘디지털 트랜스포메이션’ (1)
상태바
뛰어난 고객 경험 제공 위한 셔터스톡 ‘디지털 트랜스포메이션’ (1)
  • 데이터넷
  • 승인 2020.03.10 10:00
  • 댓글 0
이 기사를 공유합니다

신규 플랫폼 구축·코드 개편…원활한 컨테이너 활용·애자일 개발 프로세스 채택

[데이터넷] 2014년부터 디지털 트랜스포메이션을 추진한 셔터스톡은 현재 클라우드, 쿠버네티스 및 컨테이너 기술 등을 활용해 새로운 서비스들을 선보이고 뛰어난 고객 경험을 제공하고 있다. 그 외에도 독보적인 이미지 검색 기능, 컴퓨터 비전, API 등을 통해 전 세계 고객이 언제 어디서나 필요한 콘텐츠를 얻을 수 있도록 지원하고 있다. 본지에서는 6회에 걸쳐 셔터스톡의 IT 개발자들이 셔터스톡의 기술과 개발 과정을 추진한 과정을 연재한다. <편집자>

<연재 순서>

1. 셔터스톡의 디지털 트랜스포메이션 추진 이유 및 과정
2. 컴퓨터 비전과 딥러닝 기술 활용
3. 기술을 통해 인기 콘텐츠와 신규 콘텐츠 사이에 적절한 밸런스를 찾아 고객에게 제안하는 법
4. 어느 기업이나 API를 통해 셔터스톡과 콘텐츠 연계 가능
5. 프런트엔드 애플리케이션 통합 테스팅
6. 자체 이미지 편집 도구인 셔터스톡 에디터의 다중언어 지원 및 이미지 필터링 기능 개발 과정

존 오린저 셔터스톡 CEO
존 오린저(Jon Oringer) 셔터스톡 CEO

셔터스톡은 크리에이티브 플랫폼을 통해 고품질의 콘텐츠, 도구, 서비스를 제공하는 IT 기업이다. 2003년 창립자인 존 오린저의 아파트에서 시작된 회사는 빠르게 성장해 이제 이미지 마켓이 아닌, 이미지, 영상, 음악을 필요로 하는 에이전시 및 크리에이티브 전문가들을 위한 플랫폼으로 성장했다. 이를 가능케 한 것은 IT 기술로서, 셔터스톡의 기술 스택, 엔지니어와 엔지니어링 프랙티스 및 조직에 대한 생각을 공유하고자 한다.

이미지로 시작한 셔터스톡의 비즈니스는 영상, 음악까지 빠르게 확대됐으며, 기업을 위한 엔터프라이즈 비즈니스 플랫폼도 만들었다. 그러나 빠른 성장과 더불어 복잡성도 같이 증가했다. 셔터스톡이 인수한 비즈니스들과 셔터스톡의 성장은 뛰어난 비즈니스 결과로 이어졌지만, 조직 간의 소통을 저하하는 사일로(silo)도 가져왔다.

2014년 셔터스톡은 이러한 다양한 비즈니스들을 하나의 플랫폼으로 통합하는 과정에서, 자사의 IT도 통합하고 현대화했다. 이는 구매 과정을 간편화해 고객이 필요한 콘텐츠를 간편하게 얻을 수 있도록 지원하기 위한 결정이었다.

셔터스톡의 디지털 트랜스포메이션은 아키텍처에서부터 시작됐다. 셔터스톡의 전체 스택을 12 팩터(12-factor) 애플리케이션 개발 모델로 옮겨 모든 클라우드 인프라에서 코드를 컨테이너화하고 확장 가능하도록 했다. 셔터스톡이 성장하면서 전 세계 고객이 콘텐츠를 활용할 수 있도록 코드를 스케일 아웃(scale-out)할 수 있도록 해야만 했기 때문이다.

셔터스톡 경영진은 이 문제를 3가지 관점에서 살펴봤다. 셔터스톡은 우선 기업 내 이너소스(inner source) 개발 모델을 구축해 직원들이 코드를 공유하고 리뷰할 수 있도록 했다. 그 다음은 일관된 애자일 프로세스를 도입해 디자인, 개발 및 출시가 구조화된 방식으로 진행되고 기능 테스트부터 출시까지 동일한 퀄리티 테스트를 할 수 있게 만들었다. 마지막은 기술 스택으로, 7개의 플랫폼을 2개로 통합했다.

셔터스톡은 새로운 플랫폼을 구축하고 코드를 대대적으로 개편했다. 이전에는 개발자들이 각자 원하는 스택과 환경에서 여러 개발 언어를 활용해 구축했었다. 그러나 IT를 뒤엎는 과정은 기술적 변화뿐만 아니라 조직과 문화적 변화도 수반했다. 셔터스톡은 이전 개발 언어들을 버리고 다양한 플랫폼에서 자동화 및 코드 활용을 위해 표준 구성 요소로 코드를 나눈 컨테이너화를 비롯한 새로운 개발 도구들을 도입했다. 그리고 원활한 컨테이너 활용을 지원하는 12팩터 방식과 애자일 개발 프로세스를 채택했다.

셔터스톡 코드 변화 과정

초창기 시절, 처음 10만여 개 정도의 이미지까지는 ‘스니펫(snippet)’ 코드로 사이트 검색 기능을 구현했다. 검색이 키워드에만 기반한 단순한 방식이었다. 그 당시에는 라이선스하는 이미지 수가 많지 않아 필요한 콘텐츠를 찾는 데 적합했다.

셔터스톡 초기 코드 스니펫
셔터스톡 초기 코드 스니펫

셔터스톡은 현재 세계에서 가장 크고 큐레이션된 이미지 데이터 세트를 보유하고 있으며, 이를 통해 컴퓨터 비전 혁신의 최전선에서 앞장서고 있다. 셔터스톡의 방대한 이미지 컬렉션에서 고객에게 필요한 콘텐츠를 제공하기 위해, 검색 코드는 보다 복잡해지고 강력해졌다. 현재 220만 라인 이상으로 구성된 검색코드는, 컨볼루션 신경망 및 기타 딥러닝 기술도 활용하고 있다.

셔터스톡의 성장·혁신 과정

1) 기술 및 시스템

셔터스톡만큼이나 오래된 기술 기업이라면 그렇듯이 초반에 활용했던 코드들의 활용도는 줄어든다. 기술은 계속 발전하고 있으며, 기계의 속도는 더 빨라지고 코드 언어의 표현력은 더 향상되며 시장은 변화하고 있기에 적응하고 진화해야 한다. 셔터스톡의 과제는 기업의 성장과 확장을 지원하고자 혁신을 지속하면서 기술 스택의 거의 모든 부분을 재건하거나 교체하는 과정 중 핵심 비즈니스가 손상되지 않도록 하는 것이었다.

사이트 이면에서 셔터스톡은 지난 몇 년간 셔터스톡의 기존 ‘펄(Perl) 기반 모노리스(monolith)’에서 ‘노드(Node)’, ‘리액트(React)’, ‘자바(Java)’, ‘파이썬(Python)’ 등의 언어들을 활용한 클라우드 기반의 컨테이너화된 마이크로서비스 아키텍처로 전환해 왔다. 이와 같은 대규모 프로젝트를 통해 미래의 기초를 다지며 팀들이 확장을 고려해 개발할 수 있도록 했다. 셔터스톡은 기존 기술 스택으로 지난 몇십 년간의 성장을 달성했으나, 향후 성장을 새롭게 이끌어 나갈 동력이 필요했다.

셔터스톡의 프런트엔드 개발은 자바스크립트 프레임워크인 ‘리액트js’를 활용한다. 백엔드 개발은 복수의 운영체제에서 활용 가능한 크로스 플랫폼(cross platform)이자 오픈소스인 노드를 사용했다.

중요한 점은 셔터스톡이 모든 것을 API로 가능하게 한다는 점이다. 셔터스톡은 모든 것이 API로 연결 가능한 플랫폼 기반의 회사를 지향하고 있으며, 크리에이티브 워크플로우 지원 역량을 향상하는데 힘쓰고 있는 외부 및 내부 개발자 커뮤니티를 보유하고 있다. 개발자들은 기술을 다시 활용할 수 있도록 개발하고 있으며 서로의 코드를 리뷰할 수 있게 됐다.

셔터스톡의 개발자 커뮤니티는 셔터스톡 도메인인 하나의 깃허브 ‘인스턴스(instance)’ 및 ‘리포지토리(repository)’에 통합됐다. 셔터스톡은 고객이 모든 콘텐츠를 구매할 수 있도록 지원하고자 했다. 이는 하나의 아키텍처로 모든 콘텐츠를 구매할 수 있게 하는 것이다.

셔터스톡 초기 웹사이트 화면
셔터스톡 초기 웹사이트 화면

첫 번째 단계는 셔터스톡이 모든 콘텐츠를 지원하는 주요 사이트가 되도록 아키텍처링 하는 것이었다. 그 다음은 프런트엔드에서 구글과 페이스북이 만든 리액트를 사용해 애플리케이션 아키텍처를 12팩터 모델로 옮기는 것이었다. 셔터스톡의 프런트엔드 애플리케이션은 백엔드의 API와 직접 통신한다. 여기에 셔터스톡의 첫 코어 애플리케이션 세트를 구축해 운영하고 있다.

셔터스톡의 비즈니스는 속도와 검색 엔진 최적화 효율성에 기반을 두고 있으며, 고객에게 최고의 경험을 제공하고자 한다. 셔터스톡은 락인(lock-in) 없는 클라우드를 활용하고자 했으며, 한국에 있는 고객과 하와이 또는 유럽에 있는 고객의 경험이 동일하도록 비즈니스를 확장하길 원했다. 이를 위해 도커가 주도한 스케일 아웃을 지원하는 12팩터 애플리케이션 모델을 활용했다. 이 모델에 맞는 개발 언어를 선정했고, 반복해서 코드를 설계, 개발 및 구축할 수 있도록 데브옵스 모델을 구축했다.

셔터스톡은 일평균 45개의 별도 릴리스를 프로덕션으로 내보낸다. 셔터스톡은 도커, 쿠버네티스 및 ‘젠킨스(Jenkins)’를 활용해 컨테이너를 구축 및 운용하고 개발을 자동화했으며, ‘아피지(Apigee)’로 API를 관리하고 있다.

대부분의 최신 대규모 소프트웨어 시스템과 마찬가지로, 이러한 디지털 트랜스포메이션은 오픈소스 소프트웨어를 스택 위아래에 활용했다. 오픈소스 소프트웨어의 가치를 높게 평가하는 셔터스톡은 오픈소스 소프트웨어 커뮤니티의 강력한 지지자이다. 엠파이어 스테이트 빌딩에 있는 본사에서 NYC 노드js. 밋업을 주최하고, 오픈소스 프로젝트에 기여하도록 개발자 문화를 장려한다.

2) 사람과 팀

회사 초기에는 시스템과 마찬가지로 엔지니어링 팀도 전문화 및 분리되지 않았다. 그 이유 중 하나는 회사 및 기술 성장 초기단계에서는 네트워크 엔지니어링부터 프런트엔드 개발까지 다양한 문제를 해결할 수 있는 ‘제너럴리스트(generalist)’를 선호했기 때문이다. 기술이 성숙해지면서 단순한 문제들이 해결됐고, 전문성을 갖춘 팀과 직원이 해결해야 하는 문제에 직면하게 됐다.

이를 위해 애자일 프랙티스를 도입해 엔지니어링 조직을 재구성하고, 2주 간격의 스프린트 주기를 맞춰 하루에 수십 번씩 자동화된 CI/CD 파이프라인으로 새로운 릴리스를 내놓았다. 고객의 경험과 전환(conversion)을 지원하기 위해 가설을 테스트하고, 새로운 기능을 푸시(push)하고 데이터에 기반한 프로덕트 의사결정(decision)을 내리는 과정을 빠르게 진행할 수 있게 되었다. 때론 실패할 수도 있겠지만, 이를 지속적인 개선을 위해 끊임없이 노력하는 과정 중 일부로 받아들이게 됐다.

초기 스타트업에서 오늘날의 셔터스톡에 이르기까지, 셔터스톡은 3억 장 이상의 이미지를 보유한 콘텐츠 라이브러리를 비롯해 셔터스톡 기고자(셔터스톡에 콘텐츠를 올리는 사람들)에게 10억 달러(약 1조2000억 원) 누적 수익금 지급 등 창업 당시에는 상상하지도 못할 성과들을 달성했다. 비즈니스 비전과 기술의 연계를 중시해 디지털 트랜스포메이션을 추진한 셔터스톡은 앞으로도 고객에게 뛰어난 경험을 제공하기 위해 혁신을 주도해 나갈 것이다.



댓글삭제
삭제한 댓글은 다시 복구할 수 없습니다.
그래도 삭제하시겠습니까?
댓글 0
댓글쓰기
계정을 선택하시면 로그인·계정인증을 통해
댓글을 남기실 수 있습니다.