Ep2. Abstract으로 소통하기

디자이너 셋, 파일은 하나.

Jiun U_dum
Pliary
8 min readDec 28, 2019

--

00.Introduction

안녕하세요. ‘Pliary’에서 System flow Plan/UI/Motion 작업을 진행한
디자이너 유지은 입니다.

넥스터즈 활동은 2번째로 ‘식후감'과 ‘Pliary' 어플리케이션을 런칭했습니다. :-)

주체적으로 프로젝트를 참여하고 결과물을 내는 것 또한 꿈틀거리는 자기 계발의 한 과정이라고 생각합니다.

평소 UX Research에 관심이 많아 대부분 프로젝트에서 wireframe을 제작하지만, 이번 프로젝트는 각자 하고 싶은 롤에 투입되어 작업을 진행했습니다.

01.Make a role

👊가장 먼저! 디자이너 3명의 롤을 나누고 프로젝트를 시작합니다.

(Tip: 명확한 롤은 프로젝트의 속도를 올려줍니다!)

-잘하는 분야 vs 하고 싶은 분야
우리는 이 사이에서 엄청난 갈등을 겪고 결론적으로 후자를 선택했습니다.

각자 하고 싶은 역할 배치도

“각자 하고 싶은 역할을 논의하고 정해보자!”

디자이너 첫 킥오프 때 각자 하고 싶은 역할에 대해 이야기를 나누었습니다. 우리 모두 회사일에서 벗어난다는 해방감에 대담한 wish roles을 나열하기 시작하였습니다…한 달 동안 3명이 동시에 UI 작업하는 것은 비효율적인 업무 분배라고 생각하여 우리는 서로 욕심을 덜어내기로 합니다.

main과 sub로 나눈 역할 배치도

역할을 main rloe과 sub role로 나누어 역할을 재배치 합니다. 처음보다 명확하게 나누었습니다. 앞단 UX Research를 A와B가 진행한 후, Wireframe은 C친구가 마무리를 합니다. 그것을 바탕으로 A,B는 UI를 기능별로 나누어 작업을 하고 A친구가 UI 전반적인 작업을 마무리합니다. B친구는 일러스트 작업에 선투입되어 그래픽 스타일을 잡고 진행을 하면 wireframe작업을 끝낸 C친구가 스타일에 맞춰 일러스트 작업을 도와줍니다.서로 부족한 역할을 꽉꽉!!채워주고 의지하며🤝진행을 했습니다.

02.Use Abstract

디자인 아웃풋 목표 기간 ‘한 달’
앱스트렉 무료 기간도 ‘한 달’

2019년 7월 그루트 디자인 ui 일정

디자인 파일은 ‘Abstract’을 통해 히스토리 관리를 했습니다. 간단히 앱을 소개하자면, 특정 스케치 파일을 여러 개의 브런치로 나누어 각자 작업을 하고 다시 하나의 파일로 합칠 수 있는 버전 관리 툴입니다. 이 툴 덕분에 많은 시간 단축을 했습니다…good!👍 태어나주셔서 감사합니다❣️

때가 된 Appstract

앞단 ux research 단계와 wireframe 제작이 완료되면
Abstract 사용 준비를 합니다.(시간 상 한사람이 세팅을 준비합니다!)

✍️간단히 그루트 팀에서 사용한 방법을 서술해보겠습니다.

Step1. 각자 계정을 생성 후 프로젝트 초대

Step2. Master Sketch file 정리

마스터 스케치 파일 Pages

Master sketch file은 기준이 되는 스케치 파일입니다. 우리는 크게 ‘wireframe/iOS/And’ 3가지 pages로 나눴습니다.프로젝트 화면 수가 많지 않기때문에 한 파일에서 관리를 하게 되었는데 훨씬 가볍고 편리했습니다. 생각보다 맥북 환경에서 앱스트렉을 사용하기엔 무거웠습니다. 밤새 비행기 타던..나의 맥북..💻

(Tip : Wireframe 설계 단계에서 중요한 점은 누락되는 화면 없이 모든 플로우의 화면을 그려줘야합니다. 이후에 UI 그리는 친구들이 편하고! 빠르게! OS page로 불러와 작업을 할 수 있습니다.)

Step3. Master file upload!

생성된 마스터 파일

Step4. Branches 생성!

master tap에서 branches 생성

작업자 당 하나의 branch를 만든다! 라는 원칙 바탕으로 ‘작업자 이름_날짜' 규칙을 지켜 branch를 생성합니다.(여러개의 branch가 생겨나면 짧은 기간동안 각자 어떤 작업을 하고있는지 효율적으로 관리 되지 않기 때문에 하나의 branch를 생성합니다.)

이후 ‘open’ 버튼을 통해 스케치파일을 열어 작업합니다.

Step5. Commit

실제 나의 커밋 내용…

각 작업자는 작업을 완료하면 commit을 진행합니다. 대부분 큰 작업이 완료가 되거나 master file에 merge하는 단계일 경우 commit을 합니다. 작업 했던 내용,다음에 할 일,피드백등 히스토리를 남겨 다른 팀원에게 공유를 합니다.

Step6. Merge

master file에 본인 작업을 merge를 합니다. commit과 마찬가지로 어떤 화면이 추가되는지 어떤 작업을 했는지 서술을 합니다.

merge를 할 때 꼭!! 팀원이랑 상황을 공유해줍니다! (소통 단절은 걷잡을 수 없는 머지지옥😈으로 가는 지름길..)

⚪️Abstract 사용 후기

Abstract를 만나기 전… 에어드랍으로 스케치파일을 던지고 받던 시절이 생각납니다. 정글 같은 바탕화면에서 파일을 찾고 작업이 완료되면 어떤 이는 카카오톡 방에…어떤 이는 구글 드라이브에..올려두곤 했었는데요. 모든 고통에서 해방되어 프로젝트 파일을 깔끔히 관리할 수 있었습니다. 특히나! Abstract을 사용해본 적이 없는 분들은 넥스터즈 활동에서 시도해보는 것도 좋은 방법입니다.

⭕️ 장점

  • 시간 단축!
  • 다운로드에 쌓여가는 ‘copy1(2)3(4)’에서 벗어날 수 있다.
  • commit과 merge기록 앞에서 팀원이 딴소리를 못한다. 또한 니가 무슨 작업을 하는지 다 지켜보고 있다.🤢

단점

  • 한 달 무료. 하지만 이것도 감사합니다.
  • 무겁다. 아이맥에서도 무겁게 돌아간다. 하지만 감사합니다.

03.Finish

<최종 발표>

다음 넥스터즈 활동하는 분들께 도움이 되고자 간단하게 그루트 디자이너팀에서 작업했던 경험을 공유 드렸습니다! 짧은 시간 안에 서비스를 만드는 것은 엄청난 애정과 희생이 필요합니다. 전체 일정 관리부터 새벽 대응까지 밤을 같이 샜던 우리들! 그리고 2달 동안 원하는 기능과 인터렉션을 넣기 위해 달려온 팀원분들께 감사를 표합니다.🤞

작업하면서 가장 중요하게 생각했던 점은 일정 관리였는데요. 이를 위해 기능을 축소하고 계획을 변경하는 등 많은 변수를 맞이했습니다. 2019년 7월과 8월은 오로지 Pliary에 모든 걸 갈아 넣은 달이었습니다.

Pliary의 2020은 새로운 기능 업데이트를 그루트 팀원들과 진행할 계획입니다. 모두들 Pliary를 통해 반려식물의 무궁한 앞길을 함께하세요!💚

(다음 Ep.3은 개발자 친구가!)

App Store, Google Play Store 에서 Pliary를 다운 받으실 수 있습니다. 🧚‍♀️

◆ 버그 및 건의사항은 pliary.kr@gmail.com을 통해 연락해주세요.

--

--