티스토리 뷰
안녕하세요. 손누누입니다. 오늘은 "UI UX 디자이너"라는 타이틀을 적었지만,
모든 '디자이너'들이 사용하는 소프트웨어에 대한 특징을 이야기해보고자 합니다.
모든 '디자이너'들이 가장 많이 사용하는 소프트웨어는 바로!! 포토샵과 일러스트입니다 ㅎㅎ
포토샵은 비트맵 기반이고, 일러스트는 백터 기반입니다.
* 비트맵: 점(픽셀, 네모, 사각형)이 모여서 만들어진 이미지입니다.
점이 많이 모일수록 해상도가 높아져 이미지가 더욱 더 선명해집니다.
비트맵의 장점은 백터와 달리 다양한 색상과 명도차를 자연스레 보여준다는 점입니다.
그렇지만 해상도가 높아질수록 용량이 많이 차지하기 때문에 다소 무거운 단점이 있습니다.
* 백터 : 점과 점을 잇는 선들이 모여 수치를 이용해서 만들어진 이미지입니다.
이미지 확대 시 깨지지 않고, 계단 현상이 없지만, 비트맵만큼 다양한 색상과
풍부한 작업물을 만들기에 한계가 존재합니다.
포토샵은 비트맵 기반이기 때문에 주로 사진 작업을 보정하거나 특별한 특수효과, 합성 등 다양한 표현을 위해
사용되는 경우가 많습니다.
편집디자인, 웹툰, 원화 그리는 곳에 사용되기도 하면, 웹 디자인 작업할 때 사용합니다. ( 저는 주로 웹 디자인 작업할 때는 포토샵을 잘 사용하지 않습니다 / 사진보정 용도로만 사용합니다.
타 툴에 비해 무겁기 때문입니다 :)
이미지를 주로 다루는 소프트웨어라서 타 소프트웨어보다 저장할 때마다 작업의 용량이 무거워질 수 있습니다.
일러스트는 백터 기반이기 때문에 단순한 로고나 패키지 디자인 작업물, 앱디자인에서는 아이콘 디자인할 때
유용합니다. 일러스트는 드로잉/ 손 그림을 잘 그리는 사람이 쓰기에 좋은 소프트웨어입니다.
포토샵과 일러스트 소프트웨어로도 충분히 다양한 디자인 작업이 가능합니다.
그러나 UI UX 디자인 ( 웹, 앱 ) 디자인 작업하기에는 한계가 존재합니다.
앱이나 웹 디자인이 끝나면 프론트엔드 개발자나 퍼블리셔가 디자인 작업물을 살펴보면서 마크업을 진행하게 됩니다.
그런데 프론트엔드 개발자나 퍼블리셔 컴퓨터 안에 포토샵과 일러스트 프로그램이 없다면 작업물을 열어서
확인할 수 없기 때문입니다.
( 보통 포토샵에서 웹디자인 시안작업물을 png, jpg 파일로 저장하여 전달하고, 이미지를 잘라서 마크업이 진행됩니다만
즉각적인 피드백을 주고 받기에는 한계가 분명 존재합니다. )
포토샵과 일러스트에 저장되는 파일의 용량, 관리함에 번거로움이 존재하게 됩니다.
앱이나 웹 제작에서 협업하기에는 한계가 존재하였습니다.
이에 웹과 앱 디자인하기에 편한 소프트웨어로 어도비 xd, 스케치, 피그마가 등장하게 됩니다.
어도비 xd, 스케치, 피그마는 백터기반에 소프트웨어입니다.
기획자와, 개발자랑 작업할 때 의사전달을 나누기에 좋습니다. 프로토타입을 구현할 수 있기 때문에 개발자가
개발을 진행하지 않아도 대략적으로 어떤 화면으로 만들어질 지 가상적으로 살펴볼 수 있습니다.
간단하게 와이어프레임 작업이 가능합니다. 앱이나 웹 디자인에 큰 틀을 잡고 레이아웃을 구성할 때 사용하기에 편리합니다.
일러스트툴을 어느 정도 다룰 줄 안다면, 별도의 배움이나 지식 없이 디자인 작업이 가능합니다.
어도비xd, 스케치 경우 제플린으로 연동하면 개발자가 css의 코드 내역이 공유되어 작업의 호율성을 높여줍니다.
피그마 경우 별도의 소프트웨어 없이 웹 기반이라서 실시간으로 디자인 작업 내역을 개발자와 기획자에게 공유가 가능합니다.
피그마 또한 개발자에게 css의 코드 내역을 공유할 수 있습니다.
오늘은 포토샵, 일러스트 소프트웨어와 웹과 앱 디자인할 때 사용하기 유용한 어도비xd, 스케치,
피그마에 대해 간단히 살펴봤습니다.
웹과 앱을 디자인할 때 간단하게 레이아웃과 틀, 아이콘 작업을 한다면, 어도비xd나 스케치를 이미지
작업을 세밀하게 진행하고자 한다면 포토샵이나 일러스트 사용을 추천드립니다.
목적과 용도에 따라서 이 소프트웨어를 사용하면 좋을 듯 합니다 :)
긴 글 읽어주셔서 감사합니다 :)
'We think about IT' 카테고리의 다른 글
[Front-end] 프론트엔드 성능 최적화 - 1 (2) | 2021.01.10 |
---|---|
[Python] Anaconda(아나콘다) 설치 (4) | 2020.12.20 |
[NLP] 한글 유니코드 자모 분리 (Python) (8) | 2020.11.15 |
[gRPC] gRPC 톺아보기 (6) | 2020.11.08 |
[Recoil] Facebook이 만든 새로운 상태 관리 라이브러리 Recoil를 사용해 보자 (8) | 2020.10.11 |