–
화면 설계 시, 포함된 텍스트를 수정하는 일이 꽤 잦습니다. 기획 과정에서 작성한 문구나 단어들이 프로토타입 제작 후 테스트 과정에서 수정 되는 일도 많고, 디자인 후 해상도 등을 고려하거나 다국어 적용 시 변경되는 경우도 있는데요. 이때 매 번 피그마 등의 화면에서 직접 수정하는 과정에서 변경사항을 놓치는 경우가 발생하기도 하고, 기획-디자인-개발 담당자가 각 업무 진행 시 수정된 내용을 발견하지 못하는 경우도 있어요. 오늘은 이런 상황에서 유용하게 사용할 수 있는 서비스 ‘ditto’를 소개하고자 합니다.
–
시작은 피그마 연동으로 시작 됩니다. (현재는 피그마만 연동 가능해요) ‘ditto’ 가입 후, 피그마 계정을 연결 할 수 있어요.
연동이 끝났다면 간단한 정보를 입력한 뒤 바로 ‘ditto’ 개인 프로젝트 화면으로 이동하게 됩니다.
아직 생성 또는 피그마에서 가져온 내용이 없어 ‘프로젝트’는 비어있는 상태입니다. 안내에 따라 첫 번째 프로젝트를 생성할 수 있어요.
프로젝트 생성 및 내용을 불러올 수 있는 방법은 두 가지로, 하나는 피그마 파일 링크(위 이미지에는 공유 링크라고 제가 입력했는데, 정확히는 파일 링크입니다)를 직접 등록하는 것이며 또 하나는 피그마 플러그인을 활용하는 방법입니다.
저는 피그마에서 ‘ditto’ 플러그인을 설치해봤어요. 플러그인 실행 후 파일 내 원하는 프레임을 선택하면, ‘ditto’로 불러올 수 있습니다.
이제부터 ‘ditto’의 매력을 느낄 수 있는 시간이에요. 프레임에 포함된 텍스트를 불러와 한 눈에 볼 수 있도록 도와줍니다. 원하는 텍스트를 선택하면 ‘ditto’ 안에서 바로 수정이 가능하고, 동기화 작업을 통해 피그마에 적용할 수 있어요.
특정 화면 내 포함된 텍스트를 한 눈에 볼 수 있는 모습이에요. 왼쪽으로는 이렇게 내용을 확인할 수 있고, 오른쪽으로는 선택한 텍스트를 수정하거나 코멘트를 작성하는 등 ‘텍스트’에 집중할 수 있는 환경을 볼 수 있습니다. 화면 미리보기가 지원되기에 피그마를 동시에 확인하며 작업할 필요가 없어요.
수정 화면 역시 어렵지 않게 구성 되어 있어요. 각 텍스트 별 진행 상황을 설정할 수 있으며 (진행중, 리뷰 요청, 완료) 코멘트, 메모, 태그를 입력할 수 있습니다. 코멘트를 작성하게 되면 텍스트에도 바로 적용되어 코멘트 등록여부와 개수를 확인할 수 있어요.
‘ditto’는 2명이 무제한 프로젝트 이용 기준 무료로 사용 가능합니다. 연 결제 기준, 멤버 1명 당 월 15달러를 지불하면 프로젝트 즉 문구들을 CSV, JSON으로 내려받을 수 있으며 텍스트 컴포넌트 라이브러리를 따로 관리할 수 있어요. 이렇게 되면 단순히 텍스트를 함께 보고 쉽게 수정하는 것을 넘어 스프레드 시트 등으로 관리하던 스트링을 팀 단위로 더 편리하게 관리할 수 있는 환경을 갖출 수 있습니다. 무엇보다 피그마와 실시간 연동이 가능하다는 점은, 피그마를 적극적으로 활용하는 팀에게 매력적일 수 밖에 없어요.
문구를 작성하는 사람은 함께 일하는 팀원들과 협업할 수 있는, 더 좋은 환경을 접할 수 있으며 디자이너 역시 문구를 피그마에서 매 번 수정해야 하는 불편함을 줄일 수 있고, 개발자 입장에서도 스프레드 시트 등으로 문구를 보며 수정사항을 확인 후 적용해야 하는 귀찮음을 없앨 수 있다고 생각해요. 이는 ‘ditto’ 팀에서도 핵심 가치로 제공하는 내용이기도 하고요.
무료로 먼저 활용할 수 있으니, 기획 – 디자인 각 1명씩 대표로 활용해본 뒤, 유료 결제를 고려해보는 것이 좋은 방법일 것 같네요! 아래 영상은 8분 길이의 사용 방법이니 살펴보시면 도움이 될 수 있을거라 생각합니다.
‘ditto’는 이런 편리함을 인정받아 캔바, 코스트코 등에서 이미 사용중이라고 해요. 더 자세한 내용은 ‘이 곳’을 통해확인해주세요!
–
제 첫 도서가 출간되었어요. 제목은 ’10년 차 IT 기획자의 노트’입니다. 뉴스레터와 이 블로그를 시작하게 된 이유는 사수 없이 일하는 어려움을 저보다 조금 늦게 출발한 분들이 덜 느꼈으면 하는 마음 때문이었는데요. 같은 맥락에서, 9개 노트(기록)를 바탕으로 기획과 PM의 주요 업무를 어떻게 하면 좋을지 정리한 내용입니다. 아래 링크를 통해 자세한 내용을 확인하실 수 있어요!
–
