디자인
iOS 개발자의 디자인공부 (1)
시르베어
2025. 2. 24. 22:23
최근 참가중인 부트캠프에서 첫번째 프로젝트를 진행했다. iOS 개발자 4명이서 진행했고 개발자 4명이서 했지만 기획, 디자인 등은 제대로(?) 이루어져야했다
이번 프로젝트를 하면서 느끼고 배운 것 중에는 개발자가 디자인(느낌, 색, 툴 사용법 등)을 알아두면 경쟁력이 생긴다는 사실도있었다. 그렇기에 조금씩은 알아두는게 좋을것 같아 공부하기로 했다.
프로젝트 앱의 디자인을 구성하면서 두 분이 8배수 여백, 컴포넌트 등을 언급해 주셨다. 처음엔 우리팀의 내부적인 룰로 인지를 했지만 알고보니 디자이너들이 8배수로 많이 작업하셨다고 하셨고 참고 자료1, 참고 자료2를 보내주셨다.
참고 자료1의 요약
- 수치상 잘맞아 떨어지고 짝수가 수정과 기타 작업들을 하기에 적합하다.
참고 자료 2의 요약
- 해상도 : 디스플레이의 선명한 정도, 픽셀의 개수
- 8x8 해상도(64)는 4x4 해상도(16)보다 4배 더 선명
- 8포인트 - 그리드 디자인 : 간격을 8배수로 맞추는 법
- 0.75, 1.25, 1.5, 2, 3, 4배를 해도 깔끔하게 떨어짐
- 디자인을 망가뜨리지 않고 축소할 수 있고 유연하게 대처가 가능
- 디자인시스템
- 반복적인 UI를 효율적으로 관리할 수 있고 팀 전체가 일관적으로 이해할 수 있음
- UI 구조, 쓰는 방법, 유의해야하는 부분까지 상세하게 적혀 있는 문서
- 파운데이션
- 컴포넌트를 만들기 위해 사용하는 공통 재료
- 색상, 글꼴, 아이콘, 레이아웃
- 폰트 스타일(폰트 스케일)
- 패밀리(Family), 굵기(무게감, Weight), 크기(Size), 행간(Line Height), 자간(Letter Spacing)
- 일반적으로 16px부터 시작, 2px씩 줄이거나 늘림 / 20px 이상은 제목에 사용
- 행각의 경우 제목은 120~135 %, 본문은 150%가 좋음
내용을 정말 간단하게 정리를 한 상태이고 더 자세한 내용이 있지만! 지금은 이 정도의 기초만 알아도 도움이 될듯하다. 더 필요한 내용이 생기면 이후로 점차 추가하면 좋을듯 하다
이건 개발자들끼리 머리 맞대고 짠 디자인 시스템
- 폰트, 컬러셋, 공통으로 사용하는 버튼 등
마지막으로 서두에서 말한 프로젝트는 곧 회고와 함께 찾아올 예정입니다!!!