created by: 배창현
- 해당 문서는 내용이 추가 또는 수정이 될 수 있으며, 변경이 되면 꼭 최신화 및 공유 해주시길 바랍니다.
- 해당 문서를 수정 또는 제안하는 경우, 디자이너분께 양해를 구하시고 제안을 해주시면 됩니다. 최종결정은 디자이너가 결정 합니다.
안녕하세요? Frontend 개발자 배창현 입니다. 디자이너와 협업을 하는 상황들이 발생하는데 그중에서 디자인 에셋과 관련한 규칙을 정하고 제안드리고자 이 문서를 작성하게 되었습니다.
Design Assets 을 정의하는 이유
- 실무에서 디자인 에셋에 대한 규칙이 없는 경우, 프로젝트마다 또는 협업의 대상이 달라질때 마다 네이밍 규칙이 혼용이 되면서 복잡도 증가
- 확장자는 *.png 인데, 아이콘 자원인지 만약 아이콘이라면 무엇을 의미하는지 명확하지 않아 예측이 불가능
- 디자인 팀 단위 또는 프로젝트 팀 단위의 명명규칙을 설정하여 누구나 동일한 네이밍 규칙을 따르도록 하여 통일성을 지켜야함
Commons
디자인 에셋은 다양한 운영체제(예: Mac, Window 및 Linux)와 장치에서 사용이 되어집니다. 모든 시스템에서 동일한 디자인 에셋을 사용하고자 아래 공통규칙을 참고해주세요.
- 미국식 영어 소문자 사용(a-z) / 대부분의 시스템은 대소문자를 구분하기 때문에 항상 소문자만 사용하세요
- 확장자에도 소문자만 사용하세요
- 공백, 마침표, 하이픈 또는 밑줄로 디자인 에셋명을 끝내지 마세요
- 공백을 사용하면 안되기 때문에, 두 단어를 구분할 때 구분 기호로 하이픈(-)을 사용하세요
- 디자인 에셋명 첫글자는 숫자는 사용하지마세요
- 디자인 에셋명 이름은 명확하고 고유하게 지어주세요
- 자주 사용하는 용어는 축약해 주세요
button = btn
background = bg
image = img
- 오른쪽과 같은 문자들을 디자인 에셋명에 포함을 시키면 안됩니다. 만약 export 하는 과정에 포함이 되는 경우 수정해주세요.
