UI 디자이너가 많이 사용하는 툴 소개 (대세는 피그마)

UI 디자이너들이 사용하는 툴은 다양합니다.

2022년까지만 해도 5가지 정도의 툴이 서로 경쟁했지만 2023년 부터는 피그마를 압도적으로 많이 사용하고 있습니다.

그럼에도 아직 현업에서는 다른 툴들을 사용하고 있는 회사들도 있으니 이들에 대해 알아보는 시간을 가지려 합니다.

각 툴은 각각 장점과 특징이 있으므로 본인이나 회사의 목적에 맞게 선택하여 사용하면 좋을 것입니다.

반응형

1. 피그마 (Figma)

피그마는 웹 기반 UI 디자인 및 프로토타이핑, 협업툴입니다.

클라우드 기반으로 웹 브라우저에서 바로 사용할 수 있으며, PC용 프로그램도 있으니 편하게 선택하면 됩니다.

부분 유료 툴이지만 개인이 사용하면 거의 무료에 가까운 점도 매력적입니다.

올인원 디자인 툴로서 다양한 기능을 하나의 툴로 쉽고 빠르게 구현할 수 있습니다.

협업에 매우 특화되어 있어서 온라인으로 실시간 작업을 진행할 수 있다는 점이 매우 큰 장점입니다.

 

Figma: The Collaborative Interface Design Tool

 

2. 스케치

스케치는 UI 디자인 툴 시장의 오래된 강자로서, 강력한 UI 디자인 기능과 다양한 플러그인을 제공하고 있습니다.

하지만 맥에서만 실행할 수 있다는 점이 최대 단점으로 꼽히며, 유료로만 이용할 수 있고,

로컬 클라이언트를 기반으로 하기 때문에 공유 및 협업을 하려면 제플린, 앱스트랙트 같은 협업, 버전 관리 툴을 함께 사용해야 하는 불편함이 있습니다.

그래도 오랜 시간을 이어온 UI 디자인 툴이기 때문에 맥을 사용하는 분이라면 스케치를 쓰는 것도 괜찮은 선택입니다.

제 주변에는 오직 스케치를 쓰기 위해 맥을 구입하는 분들도 있었습니다.

 

Sketch

 

3. Adobe XD

Adobe XD는 포토샵과 프리미어로 유명한 어도비 사에서 만든 UI 디자인 툴입니다.

UI 디자인 기능과 프로토타이핑 기능이 뛰어날 뿐만 아니라 다른 어도비 사의 제품들과의 호환성이 무척 좋다는 큰 장점이 있습니다.

스케치와 다르게 윈도우, 맥 모두 실행할 수 있어서 작업 환경에 구애받지 않는다는 장점도 있습니다.

하지만 컴포넌트 기능이 다른 툴에 비해 빈약하고, 세밀하게 선을 그리는 패스 드로잉에는 적합하지 않은 단점이 있습니다.

또한 유료 결제를 해야 클라우드에 기반한 실시간 협업 기능을 사용할 수 있다는 점도 아쉽습니다.

그리고 어도비가 Adobe XD를 포기하고 피그마를 인수하기 위해 시도를 했었는데 그 때부터 서비스를 거의 지원하지 않는 다는 점이 최대 문제로 보입니다. (현재 피그마 인수는 실패했습니다.)

 

Adobe XD 시작하기

728x90

4. 프로토파이 (Protopie)

단순히 화면을 디자인하는 것과 실제 동작하는 모습을 구현하는 것은 완전히 다른 일입니다.

프로토타입을 제작할 때는 실제 작동하는 효과, 즉 인터랙션 기능을 만드는 것이 UI 디자이너에게 매우 중요한 일이기도 합니다.

피그마, 스케치, Adobe XD 등에서 대부분 인터랙션을 넣은 프로토타이핑 기능을 지원하지만 주로 UI 디자인에 주요 기능이 맞춰져 있다는 아쉬움이 있습니다.

그래서 프로토타이핑을 중심으로 작업하는 곳에서는 프로토타이핑 전용 툴로 프로토파이를 많이 사용합니다.

UI 디자인 툴에서 완성한 디자인 시안을 프로토파이로 옮기면 실제 디지털 제품과 유사한 기능을 구현할 수 있습니다.

 

ProtoPie 코리아

 

5. 프레이머 (Framer)

프레이머는 코드를 입력해 프로토타이핑을 할 수 있는 UI 툴입니다.

물론 코딩을 할 줄 몰라도 UI 드로잉 및 디자인 기능을 적용할 수 있어서 활용도가 높은 툴입니다.

디자인한 페이지를 바로 랜딩 페이지로 만드는 기능 또한 존재합니다.

디자이너가 UI 개발 로직을 함께 고민하면서 개발자와 협업해 하나의 컴포넌트를 디자인과 개발에 모두 활용할 수 있다는 큰 장점이 있습니다.

금융 서비스인 토스에서 이 프레이머를 활용해 디자인 시스템을 활용한 사례가 유명합니다.

 

Framer — The internet is your canvas