디자인 조직이 성장할수록 필요한 일 (부제. Design Ops)

MOKKOZI 0 442

여기어때는 20명이 넘는 UX 디자이너가 있어요. 각 디자이너들은 앱, 웹, 파트너센터, 디자인 시스템, 비주얼, 브랜딩 등 다양한 도메인을 담당하고 있는데요.

각기 다른 작업을 하고 있는 디자이너들이 일관성 있는 디자인을 지속해 나가는 게 쉬운 일이 아니라는 걸 디자이너 분들은 많이들 공감하실 것 같아요. 특히 프로젝트마다 업무 프로세스도 조금씩 달라, 종종 제대로 맞춰 놓은 듯싶어도 어느새 방향이 달라져 있는 상황에 부딪히곤 해요.

저희는 이러한 문제를 지속적으로 발견하였고, 써머(Head of UX)는 Design Ops TF를 꾸려 이 문제를 다 함께 해결해 보자는 제안을 하셨고, 이를 계기로 벌써 1년째 운영 중에 있어요.

Design Ops가 무엇인가요?

Design Ops는 디자인 운영(Design Operations)의 약어로, 디자인 팀이 효과적이고 효율적으로 작업할 수 있도록 지원하는 일련의 프로세스와 도구를 말해요. 비교적 최근에 생긴 개념이지만 많은 디자인 조직들이 이미 이 역할을 중요하게 여기고 있어요. 또 , 2022년 Config(출처. ‘Inayaili León의 ‘DesignOps: The API of design teams') 에서도 소개가 되었었어요.

여기어때 UX center도 이런 취지에서 자체적으로 Design Ops TF를 구성해 운영하고 있어요. 각 팀에서 1~2명 디자이너가 참여해서 5~6명 정도가 함께하며 현재 3기까지 진행 중이고, 저는 2기 리드로 활동했었어요.

그간 저희가 어떤 문제를 어떻게 개선하고, 프로세스를 고도화해 왔는지, 그리고 업무를 하면서 Design Ops를 어떻게 병행했는지 1기와 2기를 나눠서 공유해볼게요.

1기 : 업무 개선

참여자: 써머(Head of UX), 네이썬(Core UX Lead), 제티(UXW), 테나(UXD), 픽시(UXD), 지니(UXD)

 

피그잼에서 진행한 아이데이션

1기 멤버들은 ‘업무 개선’을 메인 주제로 삼아 현재 실무에서 느끼는 불편함을 파악하고 우선순위를 정했어요. 아이디어를 모으고 그룹화하여 가장 시급히 개선이 필요한 부분들을 찾아냈죠.

다양한 의견들이 나왔지만 아래 두 가지로 주제를 좁혔어요.

1. 피그마 파일 관리 개선
2. 진행 중인 프로젝트 한눈에 확인하기 (대시보드 구축)

가장 먼저 진행한 프로젝트는 피그마에서 작업하면서 겪는 문제점을 해결하는 것이었어요. 많은 디자이너들이 피그마 내에서 각자 파일을 다르게 관리하다 보니, 다른 프로젝트의 작업 파일을 찾기 어려웠고, 담당자가 링크를 주지 않으면 헤매는 일이 많았죠.

저희는 이런 문제를 해결하기 위해 피그마 타이틀 규칙 및 커버 디자인을 통일시켰고, UX 대시보드를 구축해 프로젝트 진행 상황을 쉽게 확인할 수 있도록 했어요.

저희는 이런 문제를 해결하기 위해 피그마 타이틀 규칙 및 커버 디자인을 통일시켰고, UX 대시보드를 구축해 프로젝트 진행 상황을 쉽게 확인할 수 있도록 했어요.

 

 도메인별 피그마 커버 템플릿

 

 

대시보드 템플릿 예시

이를 통해 피그마 내 파일 규칙성이 생겼고, 디자이너가 아닌 타 직군 분들도 피그마 내 파일을 좀 더 수월하게 찾을 수 있게 되었어요. ((이제는 미팅 때 링크를 드리지 않아도 먼저 들어와 계시는 모습들이 발견되었어요.))

어찌보면 피그마 파일 관리 개선이 큰 프로젝트처럼 보이지 않을 수 있어요. 하지만 각자 본업을 하면서 기존 작업물을 수정하고 업데이트 하는 것은 생각보다 쉽지 않아요. 피그마 내 파일 정리를 위해서는 20여 명의 디자이너가 모두 함께 참여해야 했으니까요.

 

친절한 멘트 속에 압박을 느끼게 하는 슬랙 알람봇,,

1기 멤버들은 저희에게 과제(?)를 주고, 선생님처럼 주기적으로 검사를 진행했어요.
저도 당시엔 과제를 해야 하는 입장이었는데, 분명 많은 시간이 걸리는 작업은 아니지만 본업이 바빠서 항상 마감 직전에야 숙제를 완료했던 기억이 나네요. (이땐 몰랐어요. 바로바로 참여해주시는 분들의 고마움을,,,,)

여기까지가 1기의 이야기예요. 바로 이어서 제가 참여했던 2기에 대해 이야기해볼게요.

2기 : 업무 개선&자동화 그리고 학습

참여자: 써머(Head of UX), 제티(UXW), 테나(UXD), 픽시(UXD), 헤이지(UXD), 샤샤(UXD)

2기는 1기 멤버 몇 분과 저를 포함한 새로운 멤버들로 구성되었어요. 1기 멤버분들이 큰 틀을 잡아주고 역할을 잘해주셨기 때문에 2기에서도 그 뒤를 이어받아서 디자이너들의 업무 비효율을 제거하기 위해 더 힘을 냈었어요.

그리고 새로운 주제를 추가해 업무 개선뿐만이 아닌, 디자이너들의 업무 능력 향상을 위한 학습 프로젝트도 함께 설계했어요.

1. 외부 강사 초청
2. AI 이미지 생성 학습 & 경험
3. 디자인 원칙 고도화
4. 피그마 플러그인 (여기쏙)
5. AI UX Writer
5. 디자인스펙 가이드라인

위는 저희가 진행했던 프로젝트들이고, 모든 프로젝트에 모든 멤버가 함께 진행하기보다는 프로젝트마다 각각 메인 담당자를 정해서 진행했어요. 이 중에서 몇 가지만 대표로 설명해볼게요.

1. 강사 초청 & 학습

써머(Head of UX)가 외부 디자이너분들을 초청해 다양한 강연을 들을 수 있도록 자리를 마련해 주셨어요. 다른 업계나 다양한 배경을 가진 전문가 (AI 이미지 생성, 픽토그램, 브랜딩 등)의 강연을 통해 내부에서는 얻기 어려운 색다른 인사이트를 얻을 수 있었죠.

한동안 연달아 강연이 있었는데, 마치 다시 대학생으로 돌아간 듯한 기분도 들었어요. 본업에 몰두하다 보면 새로운 시각으로 바라보기 힘들 때가 많은데, 강연을 통해 리프레시할 수 있어서 디자이너들의 반응도 좋았어요.

 

강의 후 바로 학습해볼 수 있는 세션 기획

AI 이미지 생성 강연을 듣고 난 뒤에는 직접 학습해 볼 수 있는 세션도 별도로 구성했었어요. 강연을 통해 새로운 인사이트를 얻을 수는 있지만, 실제로 해보지 않으면 체화되기 어렵기 때문에 이런 부분들도 신경 써서 구성했어요.

2. 디자인 스펙 가이드라인

다음으로는 피그마에서 디자인 스펙 작성 시 겪는 문제점들을 개선해보고자 했어요.

 

서베이 내용 중 대표 문제

먼저 서베이를 통해 디자인 스펙 작업 시 디자이너들이 겪는 문제점들을 구체적으로 도출했어요. 그 결과, 스펙 작성 방식이 디자이너마다 상이하고, 가이드라인이 필요하다는 것을 알게 되었습니다.

앞서 말씀드렸다시피 저희는 20여 명의 디자이너가 있고, 피그마를 통해 디자인 작업물을 만들어 소통하고 있어요. 개발자가 이를 정확히 구현하기 위해서는 디자인 스펙 작성이 필수인데요.

저도 포토샵 > 스케치&제플린 > 피그마를 경험해 오면서 PPT로 한 땀 한 땀 스펙을 작성하던 때가 있었어요. 이제는 클릭만으로 수치를 확인할 수 있는 피그마를 사용하지만, 디자인 의도를 명확하게 전달하기 위해서는 여전히 디자인 스펙 작성이 필요해요. 명확한 디자인 스펙이 없다면 디자인과 개발 간의 소통에 문제가 발생하고, 프로젝트 진행 속도가 느려지거나 디자인 QA 시 이슈가 많이 생길 수 있어요.

그래서 저희는 개발자와 PO분들과의 원활한 소통, 그리고 디자이너들 간의 스펙 작성 공통화를 위해 디자인 스펙 가이드라인을 만들었어요. 1기 때는 피그마 전체 파일 관리를 중점으로 개선했다면, 이번 2기에서는 피그마 파일 내 작업물들의 공통화를 위해 노력했습니다.

 

 디자인스펙 가이드 중 일부

 

 


 

프로젝트 사이즈 명시 : 프로젝트의 크기와 범위를 명확히 합니다.
일정 산정 : 프로젝트 일정을 캘린더에 명시해 관리합니다.
체인지로그 : 디자인 변경 사항을 기록합니다.
피그마 커버 규칙 : 피그마 파일의 커버 규칙을 통일해 관리합니다.
AS-IS & TO-BE : AS-IS와 TO-BE화면을 비교해서 배치하고
변경된 부분을 찾기 쉽도록 표시합니다.
테스트 그룹 케이스 명확히 표시: 여러 개의 솔루션으로 진행하게 될 경우 각 그룹을 명확하게 구분합니다.
Min, Max 수치 표시: 최소 및 최대 수치를 명확히 기재합니다.
YDS Component: YDS를 가이드에 맞게 알맞게 적용했는지 확인하고 명시합니다.
Edge Case: 예외 상황이나 극단적인 케이스를 명확히 설명합니다.
Touch Area: 터치 인터페이스의 영역을 명확히 표시합니다.
Sync Data: 실제 데이터를 사용하여 디자인 화면을 구성합니다.
Interaction Guide: 인터랙션에 대한 상세한 지침을 제공합니다.
UXW 가이드라인 준수: UX 콘테츠 작성 가이드라인을 준수합니다.

위와 같은 내용들로 필수로 작성해야 하는 스펙들을 정리해서 가이드라인을 만들었고, 템플릿이 필요한 부분들은 별도로 구성해 디자이너분들이 바로 가져다 쓸 수 있게 작업했어요.

 

체크리스트 컴포넌트화

가이드라인은 사실 한 번 본 다음에 다시 찾아보기 쉽지 않잖아요. 그래서 마지막에 체크리스트를 컴포넌트 화해서 디자인 스펙 작성 시 필수로 확인할 수 있도록 만들었어요.
이 가이드라인을 통해 디자이너들은 피그마 내 작업 플로우도 규칙을 맞춰 나가고 있고, 새로운 디자이너분이 들어왔을 때도 가이드라인을 통해 빠르게 작업 환경에 적응할 수 있는 걸 기대하고 있어요.

마무리

이렇게 3개월간 진행했던 2기의 프로젝트도 이제 마무리되었어요. 짧은 기간 동안 꽤 많은 프로젝트를 진행한 것 같아요. 여러 프로젝트를 병행하다 보니 Design Ops는 일주일에 하루를 정해 작업하거나, 각자 작업을 한 뒤 만나서 공유하는 방식으로 진행됐었어요.

처음엔 넘치는 의욕으로 여러 아이디어를 발산하다가 결국 모든 걸 다 할 수는 없다는 걸 깨닫고, 다시금 Design Ops의 역할을 정의해서 가장 집중해야 할 부분을 찾아내는 과정도 경험했어요.

업무 비효율을 제거하기 위해 더 많은 업무를 해야 하는 아이러니한 상황 속에서도 재미있게 할 수 있었던 건, Design Ops 멤버 모두가 문제를 해결하기 위한 솔루션을 찾아가는 과정을 즐겼기 때문인 것 같아요.

저희는 서베이를 통해 지속적으로 멤버들이 겪는 문제점을 발굴하고, 어떤 프로젝트가 도움이 됐는지, 어떤 부분이 개선되었는지 계속 파악하고 있어요.

 

 서베이 만족도 조사 중 일부

 

 

 

Design Ops팀은 앞으로도 이런 노력을 지속해서 더 나은 환경과 문화를 만들어 나가려고 해요. 디자이너 스스로가 UX 설계에 매진할 수 있는 좀더 효율적인 업무 문화를 구축하는 데 고민이 있으신 분 혹은 팀이 있으시다면 저희의 경험이 도움이 되면 좋겠습니다. 

 

 

글 - 황다원(Shasha) / UX Designer

출처 - ​Medium

페이스북에 공유 트위터에 공유 구글플러스에 공유 카카오스토리에 공유 네이버밴드에 공유
0 Comments