스케치 47 심볼 라이브러리
스케치 47 조타~
안녕하세요.
이번에 곧 업데이트될 스케치 47 심볼 시스템이 아주 많이 좋아졌습니다.
심볼 라이브러리라는 시스템이 생겼는데
첨 들었을땐 UI가 개편되는구나 했는데 설치해 보니 시스템 개편을 했더군요.
대규모 혹은 여러 디자이너가 스케치에서 디자인을 아주 쉽고 효율적으로 작업할 수 있게 나온 시스템입니다.
일반적으로 심볼을 공유하려면 Craft Library를 쓰거나 Lingo App을 통해 심볼 공유가 가능했는데 이번 업데이트로 디자이너가 별도 외부 툴 없이 스케치 독자적으로 협업을 쉽게 할 수 있게 나왔습니다.
iOS UI 디자인이 기본으로 들어가 있습니다.먼저 기존 심볼의 Sync 아이콘 말고 Link 아이콘 같은 심볼 라이브러리가 생겼습니다. 이게 새로운 심볼 라이브러리입니디.
심볼 라이브러리 개념이 조금 헷갈릴 수 있는데
심볼 라이브러리는 서로 다른 스케치 파일에 서로 다른 디자이너가 서로 다른 컴퓨터에서 공통으로 심볼로 제작된 UI 콤포넌트/컬러 등 디자인 에셋을 공유 및 재사용할 목적으로 생긴 기능입니다.
-
간단한 제작 법을 알려드리겠습니다.
먼저
저는 (심볼)버튼만 따로 만들어서 lib_btn이라는 스케치 파일(*.sketch)을 만들어서 저장했습니다.
저 같은 경우엔 기본 Page1는 지우고 Symbol 페이지만 남겨두었는데 이유는 실제로 화면 제작할 스케치 파일에서 심볼 라이브러리에 만든 심볼만 가져와 쓰기 때문입니다.
*혹은 Page1에 별도 사용 예시를 위해 보존하는 것도 추천합니다.
그래서 저는 버튼만 모아둔 lib_btn과 컬러만 모아둔 lib_color 스케치 파일을 위 스크린샷처럼 만들었습니다.
그리고 실제 작업은 빈 스케치 파일에서 만들것이고 파일명은 47_test로 할 겁니다.
그리고 lib_color.sketch 화면을 보면 아래와 같습니다.
1단계 심볼만 구성된 스케치 파일을 만든다.
네... 꼴랑 컬러 심볼 4개입니다.
컬러는 나중에 추가하거나 수정하고 동기화하면 되는 거고 이 부분은 나중에 설명드리겠습니다.
2단계 심볼을 라이브러리에 등록한다.
Prefereces에 가면 Libries 항목이 추가된 걸 볼 수 있습니다.
거기서 Add Library... 을 클릭하고 아까 만든 lib_color 스케치 파일을 추가합니다.
그러면 이와 같이 라이브러리가 추가됨을 볼 수 있습니다.
라이브러리는 비활성화 혹은 삭제 가능합니다.
3단계 신규 스케치 파일에서 심볼 라이브러리 호출.
스케치 화면 왼쪽 Insert를 통해 보면 처음에 언급한 심볼 라이브러리가 추가되었음을 알 수 있습니다.
이상입니다.
4단계 심볼 라이브러리를 수정하면?
심볼 라이브러리 오리지널 소스파일(lib_color.sketch)의 심볼을 수정하면 화면 우측 상단에
Library Update Available이라는 알람이 뜹니다.
그리고 이걸 클릭하면 아래와 같은 팝업 알림이 뜨는데,
lib_color 심볼 라이브러리에서 가져다 쓴 심볼을 계속 유지할 건지,
lib_color 심볼 스케치 파일에서 수정한 최신 심볼로 덥어 쓸 건지 물어봅니다.
그럼 끝.
심볼 라이브러리가 싫어요 ㅠ
심볼 라이브러리 말고 내 파일로 그냥 독자적으로 건드리고 싶을 수도 있습니다. 그쳐?
그럼 해당 심볼 라이브러리를 더블클릭하면 아래와 같은 팝업이 뜹니다.
Unlink from Library:
선택한 심볼 라이브러리가 지금 작업 중인 심볼로 바뀌며 해당 파일 심볼로 변환됩니다.
Symbol 페이지가 없는 경우에도 자동으로 Symbol 페이지가 생성됩니다.
Open in Original Document:
이걸 선택하면 심볼 라이브러리 오리지널 스케치 파일을 열게 됩니다.
생각해 보기
그럼 모든 디자이너가 하나의 심볼 라이브러리를 쓰기 위해선 어디에 저장하는 게 좋을까요?
스케치 공식 웹사이트에는 Dropbox 나 repository in GitHub을 언급하는데 네트워크를 통해서도 가능하지 않을까 합니다(끊기는 경우가 있겠지만). 회사 조직에서 망을 막아놓았다면 로컬에서 밖에 못할 텐데 인제 남은 고민은 라이브러리 파일 저장을 어디로 해야 효율적인지가 아닐까 합니다.
-
샘플 파일 다운로드하기: https://www.dropbox.com/s/h2c1out4gclu8km/47_lib.zip?dl=0
