개발자 입장에서 필요한 최대 단위 토큰은 어느정도일까요?

Question

범쌤님 질문 답변 정말 감사합니다. 궁금했던 속이 뻥 뚫리네요.ㅜㅜ 추가질문1. 프론트 개발자 입장에서 필요한 최대 단위 토큰은 어느정도일까요? 전역에서 베이스단위 토큰으로 관리되는것만으로도(큰단위 필요 없이) 개발에 매우 용이한것이라는거죠? 개발자가 아니여서 어느정도 매력적인지가 감이 안와서 여쭤봅니다. (현재 '토큰'으로 개발되어있지 않음) 사실 디자인 관리측면에서는 아무리 못해도 원자단위 까진(버튼,인풋) 만들어서 개발연동해두고 싶어서요. 생각의 차이인듯해서 어느정도가 서로가 생각하는 필요선의 합의점일지가 궁금합니다. 추가질문2. 버튼 토큰은 무료버전에서 만들수없을까요? 테스트 단계라 아원자보다 더 큰 단위의 토큰까지 테스트 해보고싶습니다. 그리고 유료버전 강의는 생각하고 있지 않으신걸까요?

hongsi0602 · Answer

답변 감사합니다 :) 너무너무 도움이 많이 되었습니다.

범쌤 · Answer

안녕하세요 hongsi0602 님 :) 답변1. 아원자 디자인 토큰들만 전달이 잘 되어도 개발자들은 해당 토큰들을 사용해 보다 큰 형태의 ui를 컴포넌트로 관리할 수 있고 재사용할 수 있습니다. 버튼과 인풋들을 개발과 연동해두고 싶다고 하셨는데, 이는 개발자가 작은 토큰들로 ui를 구성해 버튼과 인풋을 만들고 해당 컴포넌트를 잘 관리하여 재사용하게 된다면 그게 원자 컴포넌트가 되는 것이지요. 그런 컴포넌트를 구성하기에 디자이너가 해줘야 할 역할은 피그마를 사용해 해당 컴포넌트에 전달된 props들을 깔끔하게 정리해놓는겁니다. (피그마에선 variant를 설정하는겁니다) 그래야 개발자들이 해당 버튼을 사이즈별로 구성하며 상태를 설정해 재사용 가능한 컴포넌트로 만들어 놓으며, 이런 내용들이 문서로 정리가 된다면 보다 정교한 설계가 이루어진 디자인 시스템이 이루어지는겁니다. 아래의 링크는 우버에서 사용하고있는 디자인 시스템을 기반으로한 웹 문서 링크이니 참고해보시면 좋을 것 같습니다. https://baseweb.design/components/button/   제일 중요한건, 잘 만들어놓은 디자인 토큰들과 정확한 컴포넌트의 variant가 있다면 , 개발단에서 쉽게 구현이 가능하고 이를 기반으로 재사용 가능한 컴포넌트를 만들어 사용할 수 있다 입니다.   답변2. 앞서 말씀드린 내용이라 넘어가겠습니다. 유료버전 강의는 피그마의 업데이트 내용에 따라 달라질 것 같으나 아직 계획은 없습니다. 피그마가 업데이트를 거치고 다른 방법으로도 사용할 수 있는 내용들이 나온다면 추가 강의를 제작할 계획은 있습니다. 또는 어쩔 수 없이 피그마의 유료 기능들을 사용할 수 없는 환경이 구성된다면 이 또한 고민해볼 계획입니다.   감사합니다 :)