작업 환경에 대한 이해 [day_9]

디지털 환경을 구축하는 ui디자이너에게 필요한 툴들이 있다. 여러가지 툴들이 있지만 대표적으로 포토샵, 피그마, XD, 스케치 가 있다. 내가 디자인을 시작할 때 만 해도 포토샵으로 주로 웹 사이트 구축과 화면을 구성하는 오브젝트들을 제작했다. 하지만 비트맵 기반의 포토샵은 작업 용량을 효율적으로 관리하기 어렵고 이미지 추출의 번거로움 등의 문제가 있었다. 그에 반해 벡터 기반의 웹,앱 구축에 최적화된 피그마나 Adobe XD, 스케치 같은 프로토타입 툴들을 사용하기 시작했다. 사용해 본 경험으로 포토샵에 비해 너무나 가벼워서 쾌적환 작업환경을 경험할 수 있었고, 에셋 관리와 다양한 해상도에 대응하는데 효율적이었다. 나는 개인적으로 사용법이 직관적이고 주기적으로 업데이트하면서 편의성이 좋은 피그마를 선호한다. 

 

개인적으로 피그마를 사용해본 후부터 포토샵을 극혐하게 되었다.

 

 

피그마와 스케치같은 툴의 아트보드 혹은 프레임을 보면 모바일 프리셋의 경우 실제 디바이스보다 훨씬 작은 사이즈로 구성되어 있다. 그 이유는 하나의 작업 화면을 바탕으로 여러 디바이스의 해상도와 ui요소들을 대응하고 작업의 효율을 위해 1배수 단위로 표현하기 때문이다. 이런 환경에서 작업하는 것이 가능한 것은 ui디자인에 최적화된 툴들이 벡터 기반의 프로그램이고 배수별, OS별 에셋 추출이 용이하여 사용자별, 디바이스별 해상도 대응이 가능하기 때문이다. 또한 개발자에게 디자인 에셋을 전달하는 과정에서 발생하는 문제들을 방지하기 위해 1배수로 작업하고 각 환경에 맞도록 베리에이션을 하는게 효율적이다. UI디자이너에게 있어서 중요한 것은 역시 개발 과정에서 생기는 여러가지 변수들인데 프로토타입 툴을 활용한 1배수 작업이 이런 비용을 줄여줄 수 있다. 벡터 기반 툴의 장점은 이 뿐만이 아니라 그래픽 요소의 관리에서도 그 효율성을 보이는데, 비트맵 방식의 포토샵같은 툴과 달리 피그마에서 디자인 에셋의 크기 변화는 품질 저하의 우려가 없기 때문이다. 

 

운영체제별로 작업 환경의 변화가 있는데 모바일 디바이스에서 안드로이드인지 ios인지 등의 차이도 이해를 해야 디자인 최적화를 진행할 수 있다. 안드로이드에선 dp의 개념을 사용하고 ios에선 pt의 개념을 사용하는데, 쉽게 설명하면 ui디자이너가 사용하는 작업 툴에서 1px은 안드로이드와 ios에서 각자 1dp, 1pt와 유사하다. 어떤 운영체제를 사용하는 지에 따라서도 해상도의 기준을 정해야 한다. 

 

 

작고 소중한 단위들

 

 

그 외에 웹 구축에 있어서 어떤 작업 사이즈로 기준을 삼고 진행할 것인지, 서비스를 사용하는데 점유하고 있는 해상도는 어떤 해상도인지, 웹에서도 반응형인지 적응형인지 같은 여러가지 기준을 고려해서 작업해야 한다. 이러한 기준을 정하려면 디자이너와 실무자들의 합리적인 판단을 할 수 있는 환경에 대한 기본적인 이해가 필요하다는 것을 느꼈다. 디자이너가 더 많은 디지털 환경을 경험하고 그것을 이해할 수록 프로젝트 진행 시 더욱 올바른 판단을 가지며 일할 수 있을 것 같다.