Tag: Sketch

  • 2018년 디자인 툴 조사

    2018년 디자인 툴 조사

    미국 유타에서 UX 매니저로 일하고 있는 Taylor Palmer(https://twitter.com/_taylorpalmer)가 진행한 조사이며, 전 세계 대상 약 2800여 명 디자이너들에 관한 설문 결과이다. 설문에서 정의하는 디자인 툴은 UX Design 관련 툴들이며, 응답자의 절대다수 또한 디지털 디자인 (웹/앱 디자인) 쪽에서 일하는 디자이너들이다.

    총 11개 분야로 설문이 진행되었으며, 분야별로 가장 많이 사용하고 있는 툴에 대해 간접적으로 파악할 수 있는 결과라고 생각된다. 본 데이터는 국내에서의 현황과는 상이하지 않을 수 있음을 참고 바란다.

    모든 익명화 된 데이터는 여기에서 다운로드할 수 있다.

    각 분야에서 최다 투표를 획득한 툴은 다음과 같다.

    1. 브레인스토밍 툴(Brainstorming & Ideation Tools): Paper / Whiteboard
    2. 유저 플로우 툴(User Flow & Site Map Tools): Sketch (https://sketchapp.com/)
    3. 와이어프레이밍 툴(Wireframing Tools): Sketch
    4. UI 디자인 툴(UI Design Tools): Sketch
    5. 프로토타이핑 툴(Prototyping Tools): InVision(classic) (https://www.invisionapp.com/)
    6. 핸드오프 툴(Handoff Tools): Zeplin (https://zeplin.io/)
    7. 디자인 시스템 툴(Design System Tools): Sketch
    8. 모니터링 툴(Experience Monitoring Tools): Hotjar (https://www.hotjar.com/)
    9. 파일 관리(File Management Tools): Google Drive (https://www.google.com/drive/)

    스케치가 많은 부분에서 1위를 차지했지만, 피그마(https://www.figma.com/)의 약진이 돋보이는 결과였으며, 많은 분야에서 스케치 다음가는 순위를 보였다. Adobe XD는 피그마(Figma)보다 비슷하거나 낮은 투표를 기록했다. (프로토타이핑 툴 분야 제외)

    더 자세한 정보는 아래 링크로 확인 바란다.

    슬라이드 자료

    원문보기
  • Zeplin integration

    Zeplin integration

    제플린(Zeplin)은 공동 작업을 위한 웹과 데스크톱을 모두 지원하는 프로그램이다. 스케치(Sketch), 어도비 XD CC, Photoshop CC, 피그마(Figma) 등과 연동하여 자동으로 작업한 결과물을 Asset 생성, 좌표값, Color Palette를 스타일 가이드로 생성해 준다.

    과거 Assistor PS를 사용하여 추출된 소스를 ppt에 정리하여 디자인 가이드 ppt 문서와 이미지 파일 asset을 개발자에게 넘겨줬었는데 몇 년 전 제플린이라는 프로그램이 나오면서 이제 제플린을 이용한 가이드를 요구하는 곳이 하나둘씩 늘어나는 추세다.

    제플린은 가이드를 생성하고 요소의 크기를 확인하는 이 모든 과정을 자동화하여 시간과 노력을 절약해준다.

    그러면 제플린에 인터그레이션 가능한 앱들이 무엇이 있는지 자세히 알아보도록 하자.

    Sketch integration

    Sketch App Icon

    Sketch 디자인에서 Zeplin으로 아트 보드를 내보내는 것은 아주 간단하다. 디자인 결과물을 내보낼 수 있으려면 데스크톱 응용 프로그램을 다운로드해야 한다. 스케치 파일에서 레이어 / 아트보드를 선택하고 ^⌘E을 누르거나 상단의 “플러그인> Zeplin> 선택된 아트보드 내보내기… “메뉴를 사용하여 내보내기 프로세스를 시작하면 된다.

    Adobe XD CC integration

    Adobe XD CC

    얼마 전 Zeplin의 새로운 Adobe XD CC 인터그레이션을 시작했다. 그 이후로 수십만 건의 디자인이 Adobe XD에서 Zeplin으로 내 보내졌다고 한다. 프로토타이핑 링크 및 그리드 내보내기와 같은 기능을 추가하여 인터그레이션 기능이 개선이 되었다고 한다. 현재 Mac/Windows 모두 지원하고 있다.

    Adobe Photoshop CC integration

    Adobe Photoshop CC

    Zeplin에 포토샵 아트보드 내보내기는 매우 간단하다. 디자인을 내보낼 수 있으려면 데스크톱 응용 프로그램을 다운로드해야 한다.

    Zeplin은 데스크톱 응용 프로그램을 설치할 때 플러그인을 자동으로 설치하며, 포토샵 메뉴의 상단 “윈도우 > 확장”에서 플러그인을 활성화해야 한다.

    Figma integration

    Figma App