brunch

You can make anything
by writing

C.S.Lewis

by 송준협 Feb 26. 2023

시간과 장소가 달라도 일을 잘할 수 있는 환경 만들기

디자인 문서화에 피그마와 노션을 사용하는 방법


최근 몇 년간 코로나19로 인해 리모트 근무를 하면서 효과적인 일하는 방법을 찾는 기간이었습니다.


개인적으로 생각해보면, 코로나가 끝나더라도 리모트 근무 문화가 남아 있을 것으로 예상하며, 그렇게 되길 바랬습니다. 하지만 생각보다 많은 회사들이 원래대로 돌아가고 있다는 것이 조금 아쉽습니다.


많은 회사들이 돌아가는 이유로 리모트 근무시 생산성이 낮아지고 협업이 단절되는 문제를 지적하고 있습니다. 저 또한 스스로 돌아볼때 같은 문제가 있었고 따라서 생산성과 협업을 유지시키고 개선 시킬 방법을 자주 고민하게 되었었습니다.


리모트 근무 환경에서 원활한 업무 수행을 위해서는 조직 문화나 분위기, 커뮤니케이션 채널과 방법, 태스크 관리 방법, 문서화 등 여러 가지 측면이 잘 동작해야 합니다.

그 중에서도 오늘은 최근에 시도해 본 문서화 방법에 대해 글로 정리하려고 합니다.


글쓰기에 앞서서 XL8에서는 문서 작성에 노션을 사용하고 있으며, 주요 디자인 도구로는 피그마를 사용하고 있습니다.

노션과 피그마




배경


디자인이 실제로 구현되기까지는 자신의 디자인에 대해 설명해야 할 부분이 많습니다. 이를 효과적으로 전달하면 서로의 오해를 줄이고 비용을 절감할 수 있을 것입니다. 그러나 지나친 문서화는 일을 위한 일이 되어버리므로, 둘 사이의 최적 교차점을 찾는 것이 중요합니다.


예를 들어, 피그마를 사용한다면, 설명을 메모 써두거나 코멘트를 달아 내용을 남기는 것이 가장 쉽고 편리한 방법입니다. 하지만 이 경우 색인에 어려움이 있으며 기억하지 않는 한 정보가 쌓이지 않고 잊혀지기 쉽습니다.

피그마의 메모와 코멘트


회사에서 인원이 늘어나면서 동시에 구성원 교체가 이루어지는 경우, 히스토리가 전달되지 못한 채로 과거의 파편화된 유산으로만 남아 더 이상 활용할 수 없는 상황이 발생할 수 있습니다.

많은 분들이 경험해 보신 바와 같이, 어느 회사의 n번째 디자이너로 입사하게 되면 이 때문에 어느 정보가 유효한지 모르는 경우가 많습니다.

운 좋게도, 지금 재직 중인 XL8에서는 초기 시니어 디자이너로 올 수 있어서 처음부터 이를 고려하여 환경을 설정할 수 있었습니다. 내가 설정한 환경은 아래와 같습니다.




방법


1. 먼저 피그마에서

피그마에서의 Section 사용예시


1. 먼저, 피그마에는 Section이라는 기능이 있습니다. 이 기능을 이용하여 특정 기능별로 Section을 나누어 정리합니다.


2. Section 하위에 다른 Section을 소속시킬 수 있으며, 이를 이용하여 색인을 구성할 수 있습니다.


3. 예를 들어 메모라는 기능이 있다면, 메모라는 기능을 Parent Section으로 만들고 그 안에 Create, Update, Read, Delete 같은 식으로 Child Section을 만들어 메모의 세부적인 사항들까지 나누어 표현합니다. 


4. CRUD 형식으로 위와 같이 분류해도 좋고, UI의 각종 상태에 따라 분류해도 좋습니다. 상황에 맞게끔 적절한 분류 방법을 사용합니다.



2. 노션에서

노션에 정리한 사례 예시


1. 그리고 만들어진 Section의 링크를 노션에 넣어 문서를 만듭니다. 그리고 이곳에서 주요한 설명들을 작성합니다.


2. Paste as preview를 사용하여 해당 피그마 섹션의 이미지와 함께 붙여넣으면, 디자인과 설명을 함께 볼
수 있으므로 이해하기가 훨씬 쉬워집니다.


3. 또한, 노션이기 때문에 특정 내용을 검색하고 찾기가 쉽고, 편집 부담이 적어집니다.


4. 이렇게 노션에서는 여러 기능의 디자인 링크를 모아서, 색인과 해당 설명을 담은 문서로 사용합니다.


즉, 피그마에서는 디자인의 시각적인 측면만 표현하고, 자세한 설명은 노션에서 작성하고 관리하는 것입니다.




3. 주의할 점

간단한 방법 같지만, 운영시 주의할 점들이 몇 가지 있습니다. 


1. 노션과 연동되고 있는 피그마는 늘 최신화된 것으로만 유지하겠다는 생각으로 유지해야 합니다. 이를 위해서는 피그마에서 라이브러리를 잘 사용하는 것이 효과적입니다


2. 또한, 피그마의 링크가 깨지지 않고 유지될 수 있도록 Section을 다른 페이지로 옮길 때는 Copy+Paste 같은 방식으로 옮겨서는 안 되며, Move to page로 옮겨야 합니다.





결론


개인적으로 코로나 3년과 다른 시간대와의 리모트 근무 환경 2회를 겪으며, 리모트 근무가 더 편해졌고 집중도 더 잘 되서 선호합니다.

앞으로도 계속 서로 다른 장소와 시간대에서 일하더라도, 마치 같은 장소와 시간에서 일하는 것과 같이 느껴

지도록 리모트 환경이 더욱 발전하면 좋겠습니다.





사족


이 글은 제가 그동안 작성해왔던 글과는 다른 어조로 작성되었습니다. 이유는 이 글이 노션 AI를 이용하여 다듬어졌기 때문입니다. 노션 AI를 처음으로 적용해본 글인데, 상당히 매끄럽게 다듬어져서 놀라웠고 만족스럽습니다.

(노션 원문의 위치: https://todddy.notion.site/3c8af08a61d94df1ac31c4cae80590ed)


제가 일을 시작하고 지금까지 다양한 기술 트렌드를 경험해봤지만, 이런 AI 트렌드만큼 제 삶을 밀접하게 향상시켰다고 느낀 적이 없습니다. 요즘 경험하며 지금 제가 XL8에서 AI 도메인에 속하게 된 것에 정말 기쁘게 생각합니다.






브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari