Chapter9. 공유와 협업
9-1) 핸드오프
핸드오프: 디자이너가 구현한 레이아웃, 컬러, 타이포 등을 개발자로 보내는 것. 따라서 개발자와의 핸드오프 과정은 프로젝트를 명확히 전달하기 위한 과정이라고 할 수도 있음
- 유저플로우
협업 시 소통 과정이 원활해져서 기획과 개발 간의 격차를 해소할 수 있음.
화면이 어떤 흐름으로 설계되어 있는지를 보여준다면 개발자는 제품이나 서비스 구현에 문제가 되는 지점을 빠르게 파악 가능.
유즈 케이스, 베리에이션, 멀티 디바이스 OS와 같은 요소들이 포함될 수 있음. 유저 플로우는 기획과 개발 결정을 위한 시각적인 정보를 제공하고 제품의 이해관계자와 팀원 모두에게 도움이 됨
- 유즈케이스유저 플로우가 화면에 대한 전체 흐름을 파악하는 것이라면 유지 케이스에서는 사용자에게 발생할 수 있는 다양한 상황을 고민해 봐야 함.
제품이나 서비스의 의도된 동작과 디자인을 개발자가 완전히 이해하기 위해서는 콘텐츠의 다양한 양상을 보여주는 게 중요.
사용자의 행동으로 고려하지 않은 예측 밖의 상황이 발생할 수 있기 때문에 잘못된 데이터를 입력하거나 비활성화된 버튼과 상호작용하려고 할 수도 있음. 사용자 경험에 기반한 전반적인 애플리케이션의 안정성을 향상시킬 수 있음
- 베리에이션
예측하지 못한 상황에 대한 유지 케이스를 전부 파악해서 제공하는 것은 정말 어려운 일.
그래서 개발자와의 다양한 대화를 통해서 여러 가지 결과를 예측하고 작성하고 그리고 또 다음 프로젝트에는 빠뜨리지 않도록 기억해 두는 것이 중요.
베리에이션은 우리가 버튼이라는 요소에서 굉장히 많이 사용을 하게 되는데,
ui 요소 또는 컴포넌트의 상태를 함께 제공하면 개발자는 요소의 상태를 더 빠르게 이해하고 그에 맞는 서비스를 구축할 수 있음.
- 멀티 디바이스
최근에는 네이티브 앱과 반응형 웹을 동시에 구현하기도 하지만 비용적인 측면으로 인해서 하나의 방식을 추구함
그러나 디바이스의 크기는 다양해질 수밖에 없기 때문에 네이티브 앱도 다양한 해상도를 가진 디바이스로 인해서 여러 해상도로 구분하는 작업이 필요함.
반응형 웹도 어떤 크기에서 브레이크 포인트를 지정할 것인지 논의가 필요. 즉 인터페이스의 실물을 다른 해상도로 보여주는 것은
개발자들이 다른 장치에서 애플리케이션의 설계와 동작을 이해할 수 있도록 도와주기 때문에 웹이나 모바일 애플리케이션에서는
크기가 다른 디바이스에서 인터페이스가 어떻게 보이고 어떻게 작동하는지 고려하는 것이 중요함.
- OS
앱이 iOS에서 구동되는지 안드로이드에서 구동되는지에 따라 그 디자인도 달라질 수밖에 없는데, 특히 네이티브 앱은 디바이스의 크기와 함께 운영 체제도 꼭 고려되어야 할 대상임
그래서 운영 체제와 해상도 모두 인터페이스가 표시되는 방식에 따라서 사용자 경험에 영향을 준다는 것을 기억하시고 개발자와의 핸드오프 과정에서 논의되는 것이 바람직함.
9-2) 에셋 내보내기
내보낼 프레임 전체를 선택하면 내부 요소가 하나의 이미지로 합쳐져 나오기 때문에 프레임이 아니라 프레임 내부 요소를 모두 선택한 다음에 내보내기를 해야한다. 버튼에 4개의 레이어를 내보낸다고 뜨고 그 버튼을 누르면 이렇게 png가 다운로드 된다.
주의해야할 점
*파일명을 작성할 때는 소문자를 사용해야한다.
*첫글자에 숫자 금지
*띄어쓰기 대신 - 또는 _ 사용하기
*축약하기 ex) Button -> btn / Image -> img
*규칙 만들기 ex) 유형_이름_숫자 -> btn_go_hover.png
'제로베이스 UXUI 디자인 28기 > UI 강의' 카테고리의 다른 글
[5주차 - Day5] UI 디자인 기초 Chapter 2. 인터페이스 디자인기초 (0) | 2024.08.02 |
---|---|
[5주차 - Day4] UI 디자인 기초 Chapter 1. 디자인 기초 (0) | 2024.08.01 |
[1주차 - Day4] 8. 디자인 시스템 (0) | 2024.07.04 |
[1주차 - Day3] 7. 프로토타입 (0) | 2024.07.04 |
[1주차 - Day3] 6. 컴포넌트와 베리언트 (1) | 2024.07.03 |