스케치 (4) 썸네일형 리스트형 텍스트에 컬러스타일 먹이기 (not 오버라이드) 스케치에서 텍스트 컬러를 변경하려면 여러 방법이 있다. 나는 아래 4가지의 방법을 테스트해보았고 각 장단점을 얘기해볼 거다. 결론을 빠르게 보고 싶다면 4번 방법으로 스크롤해서 보자! 1. 컬러 피커로 컬러 지정 2. 텍스트를 심볼로 만들어 override로 컬러스타일 적용 3. 텍스트에 마스크 씌워 override로 컬러스타일 적용 4. 텍스트를 그룹으로 묶어 컬러 스타일 적용 1. 컬러 피커로 컬러 지정 1번이 기본적으로 사용하는 방법일 것이다. 하지만 나는 매번 컬러 팔레트를 불러와서 피커로 찍어야하는게 너무 귀찮았다. 일단 킵해두고 다음 테스트로 진행. 2. 텍스트 심볼 오버라이드 이 방법은 Apple의 UI kit에서 착안되었다. Apple의 몇몇 UI들은 들여다보면 오버라이드에서 텍스트 컬러를.. 2020 Sketch Inspector 베타 버전 | 테스트 후기 2020년 1월, 스케치가 Inspector 기능을 업데이트했다. 다른 UI 디자인 툴도 제공하고 있지만, 많은 디자이너들이 사용하는 스케치에서 내놓은 만큼 파장이 더 클 것 같다. 과연 제플린을 대체할 수 있을지 사용해보기로 했다. 업데이트 내용 웹에서 Inspector 지원 Copy버튼으로 수치 복사 가능 컬러값을 각 개발 언어에 맞춰서 복사 가능 앞으로 업데이트할 내용 심볼, 오버라이드, 텍스트 스타일을 명확하게 볼 수 있도록 디자인 시스템에 대한 지원 레이어부터 전체 디자인까지 에셋 추출 기능 코드와 컬러 포맷 형식 개선 (CSS와 다른 언어 포함) 언어 저장 (컬러 포맷같은 곳에서 개발 언어를 한 번만 선택해두면 전체 설정됨) Sketch blog에서 업데이트 내용 확인하기 사용 후기 제플린과 .. Sketch meet up in Korea 디자이너와 개발자의 협업 : AB180의 에어브릿지 (https://airbridge.io/) 디자인 시스템을 구축하는 도전기 (스케치,리액트,깃) 디자인 요소 정리 반복적으로 쓰이는 디자인 요소들의 수정 용이를 위해 예외 처리된 부분은 과감히 제외하고 컴포넌트화할 수 있는 부분들을 정리. 개발과 네이밍을 통일. 동기화를 유지하기 위해서 네이밍을 같이 고민하는 것이 매우 중요하다. Ui 구현 프로토콜 UI 구성을 코드 관점으로 이해 커뮤니케이션 간극을 축소 (CSS를 배워서 디자이너가 직접 수정하고 Git으로 커뮤니케이션) 구현의 순도를 높이고 View QA 프로세스 개선 시스템 활용 자주 스타일이나 기능이 바뀌는 스타트업의 성격상, 디자인/기능을 완전히 제한시켜버리면 나중에 변화를 위해 써야 할 시간 .. 디자인과 개발 아웃풋의 컬러가 다르다면 ? 내 컴퓨터에서는 색을 잘 맞췄는데 실제 아웃풋에서는 생각보다 쨍하거나, 칙칙하게 나오는 일이 많다. 디자인과 실제 아웃풋 컬러가 다르게 보이는 일이 발생하는 것이다. 이런 일을 타파하기 위해서 컬러 프로파일의 개념을 알아둬야한다. 디지털 디자인과 컬러 프로파일의 관계 컬러 프로파일은 크게 3가지로 나누어진다 sRGB, Adobe RGB(ARGB), P3 sRGB : 모니터 및 프린터 표준 RGB 색공간 ARGB : sRGB에서 손실되고 부족한 영역대를 보완한 색공간, 어도비의 인쇄장비 기준 P3 : sRGB보다 약 25% 더 많은 컬러를 제공, 디지털 시네마 기준 대표적인 제품은 Iphone 7, 아이패드 프로, 아이맥 등 ARGB는 인쇄 기준 색공간이므로 크게 신경쓰지 않아도 된다. 실제로 요즘 많은 .. 이전 1 다음
