백앤드개발자들을 위한 피그마 기획정리

 기능정의서와 피그마 시안을 전달하고 나면 개발자들이 어떻게 파악하며 진행하는지 궁금했다. 프론트 개발자들은 주로 피그마로 확인하며 작업을 한다면 백앤드 개발자들은 어떤 식으로 진행하는지 궁금해져서 ERD 설계세션에 참여하였다.

ERD 설계가 뭐지?

  ERD에 관해 간단히 설명하자면 데이터베이스(DB) 구조를 한눈에 확인하기 위하여 백앤드 개발자가 진행하는 것이다. 각 기능테이블을 만들고 연결하여 그것을 토대로 api를 작업한다고 보면 된다!

아무튼 기능정의서를 주로 참고하여 진행할 것이라고 생각했던 것과 달리 피그마 시안에 있는 정보구조도를 제일 먼저 참고하여 진행하는 모습을 볼 수 있었다. (이건 개발자들마다 작업방식이 다른 것으로 알고 있다!)

 로그인으로 예를 들어본다면 어떤 방식으로 로그인을 할 건지 필요한 정보들을 적어둔 것으로 기능별로 필요한 정보들을 파악하는 것이다.

로그인 정보구조도

 그 후 1차 적으로 서비스에 필요한 정보들을 훑고 나서 피그마 시안으로 돌아와 서비스 flow를 파악하여 전체적인 기획 확인을 시작하였다. 여기서 뿌듯했던 부분은 나는 디자인 작업을 할 때 유저 flow로 화면생성을 하는데 백앤드 개발자분이 화면과 flow파악을 동시에 할 수 있어서 ERD 설계할 때 화면흐름을 따라 진행하는데 시간이 덜 든다는 이야기를 해주셨다. � 그 후 ERD 테이블 작성하는 부분을 설명해 주셨다. 

 늘 기획과 디자인을 동시에 하면서 어떻게 하면 개발자분들이 피그마시안만 봤을 때도 기획과 서비스 흐름 파악을 한눈에 보면서 개발을 진행할 수 있을까에 대한 고민이 있었는데 잘 진행하고 계신 걸 확인해서 뿌듯함을 느꼈다.

 그래서 백앤드 개발자들을 위한 피그마 정리는?

첫 번째, 서비스 구조를 한눈에 확인할 수 있는 정보구조도가 필요하다.

두 번째, 피그마 시안을 제작할 때는 유저 flow대로! 

- 예를 들어 구독서비스를 진행한다면 페이지 생성을 회원가입 > 메인 > 구독 시작하기 > 구독 정보 입력 > 카드 등록 > 결제 > 완료 순으로 나열하는 것

세 번째, 백앤드 개발자들은 화면이 아닌 구조파악이 우선이라는 것을 명심하며 작업하자.

 물론 프론트도 확인하지만 api를 개발할 때는 눈에 보이는 것보다 보이지 않는 것, 구조적인 것이 우선시 되기 때문에 기획과 디자인을 하면서도 이 부분을 늘 생각하면서 진행해야 한다.

 

 눈에 보이지 않는 부분까지도 생각하며 기획하는 것이 아직도 어렵지만 업무를 진행하면서 점점 감을 잡아가는 것 같다.