퍼플은 엔씨소프트의 모바일 게임을 PC에서 스트리밍할 수 있도록 해 줍니다. 라이브 스트리밍 뿐 아니라 게임에 필요한 다양한 도구들을 제공하여 게이머들의 그룹 플레이 니즈를 해결할 수 있는 런처 서비스입니다.

PURPLE 플랫폼 디자인,

디자인시스템 구축 리드

퍼플은 멀티플랫폼으로서의 기능을 가지고 있으며 게임 유저들에게 지속적으로 신규 기능을 제공하고 있습니다.

저는 퍼플톡, 퍼플라이브, 퍼플 런처 등 다양한 형태의 인터페이스 디자인을 담당하였습니다. 업무 효율을 위해 팀 내 툴 전환 교육을 담당하고 디자인시스템 구축을 리딩하는 등 실무 리드로서의 역할을 하였습니다. 프로젝트 구축 프로세스에 디자인시스템을 추가하여, 개발자와 디자이너 전체가 지속적으로 협업할 수 있도록 하였고, 디자인시스템을 안정적이고 높은 확장성을 갖도록 개선하는 과정을 반복하였습니다.

디자인 - 퍼플톡

퍼플톡은 엔씨소프트의 게임 이용자들이 모바일게임을 PC에서 스트리밍하면서 게임에 필요한 부가 기능을 사용할 수 있는 메신저 플랫폼입니다. 텍스트 채팅, 보이스 채팅, 보스타이머, 퍼플 Live등의 큰 기능을 가지고 있으며, 게임 이용자들이 퍼플톡을 통해 혈맹원들과 함께 편리하게 파티 플레이를 할 수 있어야 합니다. 저는 디자인시스템 구축과 퍼플톡 UI디자인을 동시에 진행했습니다. 사용자 플로우에서 의미와 규칙에 맞는 UI Type을 반영하여 게임 유저들이 일관된 사용자 경험을 가질 수 있도록 인터페이스 디자인을 개편하였습니다.

디자인 - 퍼플 런처

퍼플의 런처는 NC의 모바일 게임을 데스크탑에서 컨트롤할 수 있는 플랫폼입니다. 퍼플에 입점한 게임은 PC에서 플레이할 수 있으며, 게임 실행 전에 사용자가 육성하는 캐릭터 및 게임정보를 파악할 수 있습니다. 런처 진입 시 무거운 캐릭터 리소스를 제거하고 사용자에게 필요한 정보들을 모듈형으로 제공하여, 중요도에 따라 사이즈와 위치를 커스텀할 수 있도록 설계했습니다. 게임IP마다 희망하는 컨텐츠가 다르기 때문에 다양한 형태의 모듈을 배치하여 사용할 수 있도록 개선하였습니다.

디자인시스템 구축 과정

1. 파편화된 리소스, 가이드 없는 인터페이스 취합

2. 공통 요소 분석으로 UI컴포넌트화

3. 컴포넌트 규칙, 네이밍 소통

4. Foundation, 컴포넌트 라이브러리 구축

5. 웹용 컴포넌트 개발 적용

(해당 과정에 대한 이미지는 PC버전에서 확인해 주세요!)

업무 방식의 개선, 디자인시스템 기반의 UI설계

디자인 프로세스를 실시간 협업 방식으로 변경하였고 이 방식을 최대한 활용하여 디자인시스템을 구축할 수 있었습니다.

커뮤니케이션 방식, 툴 전환 등도 지속적으로 개선을 시도하였고 그 결과 동료들과 타 부서 인원과의 협업이 원활하게 진행되는 모습을 보게 되었습니다.

디자인시스템 구축으로 디자인, 기획, 개발 부서가 기존 업무방식보다 더 빠르고 유기적으로 협업할 수 있는 관계가 되었다고 생각합니다.

정량데이터를 분석할 수 없었던 점은 아쉽습니다.