brunch

You can make anything
by writing

C.S.Lewis

by Shaun Jan 15. 2019

인터페이스와 컨텐츠 디자인.

Episode 08 : 컨텐츠를 디자인하는 툴 포토샵.


"포토샵의 종말이다."

"스케치, XD, 인비전이 대세다."

"포토샵은 UI디자인에서 활용도가 없다."

"그렇기 때문에 이제 포토샵을 공부할 필요가 없다."






컨텐츠를 디자인하는 툴
포토샵





디자인 툴에 대한 생각.

아날로그의 사실감을 묘사하는 스큐어모피즘에서 플랫 디자인, 메터리얼 디자인으로 트렌드가 바뀐 지 수년이 흘렸다. 그 과정에서 UI 디자인 툴의 세대교체가 이루어졌다.

비트맵에서 벡터로.


디자이너들은 수많은 모바일 해상도의 대응하기 위해 비트맵을 버리고, 벡터 기반의 플랫 디자인을 선택했다. 그에 따라 UI 디자인 단일 툴이었던 포토샵은 UI 디자이너들 사이에서 한 발 뒤로 물러서게 되었다. 그 자리를 이제 스케치, XD, 인비전등의 새로운 툴이 차지하게 되었고, 디자이너들은 조직 환경에 맞는 UI툴을 선택하게 되었다. 이제 SNS나 디자인 커뮤니티에서도 스케치에 대한 문의뿐 포토샵은 주니어 디자이너들의 아웃 오브 안중이 되었다. 그럼 이제 포토샵의 종말은 기정사실인 것인가? 결론부터 말하자면 아직은 아니다.  




인터페이스 디자인과 컨텐츠 디자인.

컨텐츠는 인터페이스의 핵심이며, 사용자에게 최종적으로 전달하는 정보이다. 인터페이스 디자인은 정보를 효율적으로 전달하기 위한 디자인이다.

컨텐츠가 핵심이다.


모바일의 발달로 인터페이스의 트렌드는 프로모션 인터페이스에서 서비스 인터페이스로 이동됐다. 그에 따라 스케치, XD, 인비전 같은 UI 디자인 툴에 대한 활용도가 높아졌다. 하지만 이 UI 디자인 툴들은 인터페이스 디자인에 제한되어 있다. 디자이너는 인터페이스와 컨텐츠 둘을 모두 디자인해야 한다. 포토샵은 아직 컨텐츠 디자인에서 활용도가 높다. 이제 디자이너는 비트맵과 벡터 환경의 툴을 번갈아가며 써야 하는 상황이 되었다.

인터페이스, 컨텐츠 둘 모두 디자인해야 한다.


UI 툴을 건축으로 예를 들면, 전체 구조를 설계하는 툴이다. 큰방이 어디 있고, 문이 어디 있고, 출구와 입구 공간에 대한 설계 및 사용성을 디자인한다. 그 공간이 미술관이면 미술관에 맞는 컨텐츠를 만들어 넣어야 한다. 포토샵은 그 공간 안에 채워 넣을 컨텐츠를 디자인하는 툴이다. 물론 벡터 기반 UI 툴로 컨텐츠 디자인이 가능하다. 하지만 툴의 제한된 기능으로 표현의 완성도를 높이기는 어렵다. 툴의 기능은 디자이너의 표현력에 어느 정도 영향을 끼친다. 현재 트렌드는 플랫 디자인이고 디자이너들은 그에 맞는 기능들만 사용하게 된다. 하지만 명심하자 트렌드는 변한다. 또 문제는 항상 리소스가 제공되지 않는다. 간혹 컨텐츠 리소스가 없다는 이유로 디자인을 할 수 없다는 디자이너들이 있다. 물론 퀄리티 높은 컨텐츠를 제공받는다면 고민할 문제는 아니다. 하지만 언제나 컨텐츠 리소스가 제공되지 않는다. 리소스가 없다면 만들어야 하지 않겠는가?




컨텐츠를 만드는 디자인 툴 포토샵.

포토샵은 원래 UI 디자인 툴이 아니다. 포토샵은 비주얼 디자인 툴이다. 텍스트 기반의 웹 환경에서 프로모션 중심의 웹으로 발전되면서 포토샵은 웹 UI의 영역도 품게 되었다. 하지만 포토샵의 본질을 겪어보지 못한 세대들은 포토샵의 활용성을 간과한다. 이는 컨텐츠의 퀄리티 하락으로 이어진다. 인터페이스 디자인에 투자하는 만큼 컨텐츠 디자인에 투자를 아끼지 않아야 한다. 주니어 디자이너들은 포토샵의 크리에티브 기능을 공부해야 한다. 포토샵 역량을 높이는 방법은 간단하다. 적은 리소스로 컨텐츠를 디자인할 수 있어야 한다. 포토샵이 손에 익을수록 적은 리소스로 컨텐츠를 제작할 수 있는 능력이 생긴다. 디자인을 하다 보면 다양한 경우가 많다. 리소스 제공 없이 디자인 요청이 있을 때도 있다. 그때 어떻게 할 것인가? 난 UI 디자이너이니까 UI만 디자인하겠다고 할 것인가? 아니면 컨텐츠 없으면 디자인할 수 없다고 할 것인가? 여기 2개의 이미지 리소스를 활용하여 새로운 비주얼 컨텐츠를 만드는 포토샵의 활용을 예로 들어본다. 수년 전 아무런 소스가 제공되지 않았던 렉서스 iPAD 개발 사례다. 제공받은 이미지는 차량의 3D 모델링 컷뿐이었다. 세계 럭셔리한 건축물 이미지를 렉서스에 투영시키자는 컨셉으로 진행했다.

Esplanade와 IS 250.


포토샵에서 레이어를 어떻게 활용하는지에 따라 고수와 하수로 나뉜다. 주니어 디자이너들이 포토샵의 레이어 개념을 익히고 활용하길 바란다.

포토샵 레이어 .


포토샵을 활용한 컨텐츠 디자인은 다른 툴에 비해 비교적 손이 많이 간다. 이미지 톤과 그림자를 일관되게 맞춰야 하고 컨텐츠의 주인공인 제품이 부각될 수 있도록 임팩트를 주어야 한다.

컨텐츠 제작 과정.


포토샵은 컨텐츠를 디자인하는 툴이다. 인터페이스 사용성을 고민하듯, 컨텐츠 크리에티브도 고민해야 한다. UI 디자이너도 컨텐츠를 디자인할 줄 알아야 한다.

실제 LEXUS iPAD에 사용한 IS 250 이미지.


인터페이스를 디자인하는 만큼, 컨텐츠도 디자인 하자.




컨텐츠 완성도가 퀄리티를 결정한다.

전체적인 구조와 사용자의 편의성을 디자인하는 인터페이스 디자인은 중요하다. 그에 맞는 툴을 사용하는 것도 시대 흐름이기 때문에 거부할 수 없다. 하지만 사용자가 최종으로 보게 되는 것은 컨텐츠다. 사용성을 디자인하는 것은 최종적으로 사용자에게 효율적으로 컨텐츠를 제공하기 위함이다. 컨텐츠의 퀄리티가 올라갈수록 디자인의 전체적인 완성도 또한 올라간다. UI 디자이너들도 컨텐츠를 디자인할 수 있어야 한다. 주니어 디자이너들은 포토샵도 공부하자.

 



디자이너들이여!

툴의 세대교체가 아니다.

포토샵도 공부해야 한다.

컨텐츠 완성도가 퀄리티를 결정한다.


매거진의 이전글 브랜드가 미디어로 성장할 때.

작품 선택

키워드 선택 0 / 3 0

댓글여부

afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari