Sketch에서 UX 디자인 시작하기

새로운 UX 디자이너와 디자인 학생들을위한 입문서

우리는 지난 2 년 동안 UX Power Tools에서 스케치 팁에 대해 많은 글을 썼습니다. UX에 막 시작한 디자이너들을 도울 수있는 방식으로 팁을 구성하고 싶었습니다.

또한 어떤 도구가 가장 적합한 지 논의하지 않겠다고 언급해야합니다. 이미 Sketch가 최고라는 것을 이미 알고 있고이를 UX 디자이너로 사용하는 방법을 알고 싶다고 가정하겠습니다.

나는 새로운 디자이너가 초보자에서 숙달로 발전하는 방법을 보여주는 5 개의 섹션으로 기사를 나 broken습니다.

  • 아이디어 얻기
  • 시작하기
  • 더 빨리
  • 더 똑똑해지기
  • 비주얼 얻기

아이디어를 얻기

UX 디자인은 도구를 사용하기 전에 시작합니다. 아이디어는 머리에서 벗어나기 시작합니다 (실제로 연구를 시작하기 전에 시작하지만이 기사를 20 분 미만으로 유지하도록하겠습니다).

분명히, 나는 초기에 디지털 툴로 곧장 뛰어 들었다. 디자인 팀과 함께 화이트 보드에서 더 많은 일을하고 공동으로 스케치하기 때문입니다. UX 디자이너는 문제 공간을 탐색하고 실수를하면서 실제로 충실도를 낮춰야합니다.

화면에 무언가를 얻을 준비가되면, 이것을 진정으로 촉진시키는 두 가지 도구가 있습니다. 첫 번째는 Freehand라는 InVision 도구입니다.

이 설계 단계를 용이하게하는 두 번째 도구는 Matt D. Smith의 Flowkit이라는 Sketch 용 프리미엄 라이브러리 세트입니다. 29 달러의 가격표 가치가 있습니다.

충실도 와이어 프레이밍에 적합 할뿐만 아니라 설계를 전달하기 위해 핵심 워크 플로우를 충실하게 매핑해야 할 때 설계의 후반 단계에서 사용할 수 있습니다.

시작하기

Sketch for UX Design의 가장 큰 장점은 반복 가능하고 빠른 작업을 강조하는 것입니다.

얼마나 많은 스케치 디자이너가 공유 스타일만큼 단순하고 강력한 기능을 사용하지 않는지 또는 중첩 된 기호와 같은 최근의 진보를 사용하는 것은 여전히 ​​놀라운 일입니다. 디자이너가 참을성이 없어서 물건을 꺼내고 싶어하기 때문인 것 같습니다. 나는 그것을 완전히 얻는다.

그러나 훌륭한 디자인은 디자이너가 구성하는 것만 큼 좋습니다. 우리는 요리의 은유를 좋아합니다 :

그리고 우리는 스타일 시트 개념을 코드에서 디자인으로 확장하는 것을 좋아합니다. (우리는 이것을 작성했기 때문에 디자인 시스템이 실제로 현장에서 폭발했지만 이러한 기술의 대부분은 오늘날에도 여전히 관련이 있습니다) :

마지막으로 Sketch에서 프로젝트를 시작하는 방법에 대한 기사의 성배를 위해 (폴더 구조까지) 모든 것을 다룹니다.

반응 형으로 Sketch에서 레이아웃을 설정하는 방법에 대한 보너스 기사 :

더 빨리

이제 Sketch 프로젝트를 효과적으로 시작하는 방법을 이해 했으므로 이제 도구를 사용하여 더 빨리 시작할 차례입니다. 개인적으로, 디자이너가 디자인하는 동안 지름길을 사용하지 않는 것을 보는 것은 불쾌감을 느낍니다. 내 영혼이 진정으로 아프다는 것을 의미합니다. 그 사람 / 갈인이되지 마십시오 :

이 기사를 쓴 이후로 약 백만 분의 일의 새로운 도구와 플러그인이 나왔지만 사실 Sketch의 가장 좋은 동반자는 내 의견으로는 바뀌지 않았습니다 (Nudg.it는 이제 Anima Sketch에서 기본적으로 지원됩니다 일부는 Sketch의 레이아웃 기능에 구워졌지만 여전히 유용합니다.)

팁과 요령

존 무어 (Jon Moore)는 단순성과 힘으로 당신의 마음을 날려 버릴 몇 가지 기사에서 파워 유저의 지혜를 전했습니다.

더 똑똑해지기

프로젝트를 설정하는 방법을 알고 Sketch로 더 빠르게하는 방법을 배웠으며 이제 모든 것을 UX 디자인에 적용 할 차례입니다.

앞에서 말했듯이 Sketch는 반복, 일관성 및 모듈화가 쉬워 UX 디자인에 적합합니다. Sketch를 사용하여 UI 요소를 지능적으로 만드는 방법에 대한 몇 가지 예는 다음과 같습니다 (모두 공짜 ).

아이콘과 그래픽을 효율적으로 처리

다음 섹션에서는 UX의 시각적 디자인 측면을 다루지 만 그래픽을 다루는 것은 종종 UX 디자이너의 조타실 밖입니다. 아이콘 생성에 대해 걱정하지 말고 아이콘 사용법에 대해보다 현명하게하십시오.

중첩 된 심볼은 실제로 상당히 자동화 할 수 있습니다.

마지막으로, 지난 12 개월 동안 Sketch의 가장 큰 발전을 지적하지 않으면 해고 될 것입니다. 라이브러리 :

비주얼 얻기

이것으로 충분하지 않은 것처럼 오늘날의 UX 디자이너는 시각적 디자인과 관련하여 훨씬 더 높은 표준을 충족합니다.

UX 디자인을 시작할 때 가로 세로 비율, 글꼴 크기, 무게, 색상 대비 등과 같이 디자인해야하는“재료”에 익숙해지는 것이 어려웠습니다.

더 나아지기 위해 기존 제품을 복사하여 UI 구성 방식에 대한 느낌을 얻을 수있었습니다.

우리는 작년에이 내용을 다루었으며 Sketch에서 다시 생성 된 몇 가지 일반적인 제품에 대한 링크를 제공합니다 (그들 중 일부는 다시 디자인되었지만).

거기에서 약간의 작은 기술을 사용하여 디자인에 약간의 감각을 더할 수 있습니다.

그러나 정확한 샘플 데이터는 비주얼 자체만큼이나 비주얼 디자인에 매우 중요합니다.

* 우리는 2 부를 쓰지 않았습니다

마지막으로, 경력의 어느 시점에서 대시 보드를 디자인해야하며 UX 디자이너에게는 가장 큰 악몽 중 하나입니다. 개인적으로, 대시 보드가 테이블에 한계 값을 가져다 준다는 것을 알게되었으므로 차트가 좋아 보이는 데 며칠이 걸리지 않습니다.

UX Power Tools를 통해 디자인 커뮤니티를 돕는 것은 놀라운 18 개월이었습니다. 스케치는 디자이너가 무기고에서 반드시 가져야하는 유일한 도구는 아니지만 가장 강력합니다. 이 부록이 UX 커리어를 시작하거나 디자인 워크 플로우를 위해 Sketch로 전환하려는 분들에게 도움이 되길 바랍니다.

새로운 프로젝트를 시작하기에 완벽한 바닐라 디자인 시스템에 관심이 있으시다면, 우리가 만든 시스템을 확인하고 싶습니다. 설계 시간을 수천 시간 절약 할 수 있습니다.

Medium에서 스케치 기사를 수집하지 않을 때는 UX Power Tools의 스케치 디자인 도구를 사용하여보다 효율적이고 효율적인 디자이너가 되겠습니다.

트위터에서 UX Power Tools 팔로우
트위터에 날 따라와