테마 · 플러그인 입문
브랜드색 하나에서 필요한 변형을 전부 뽑는 법
브랜드색 하나로는 화면을 그릴 수 없습니다. 호버 · 눌림 · 틴트 배경 · 비활성까지 필요한 변형을 규칙으로 뽑아내면, 화면마다 색을 새로 고르는 일이 없어집니다.
Technote
디자인과 사용자 경험을 책임지는 디자이너를 위한 가이드. 테마 선택 · 웹폰트 · 이미지 최적화가 속도와 전환에 미치는 영향을 다룹니다.
글 80편· 디자이너
테마 · 플러그인 입문
브랜드색 하나로는 화면을 그릴 수 없습니다. 호버 · 눌림 · 틴트 배경 · 비활성까지 필요한 변형을 규칙으로 뽑아내면, 화면마다 색을 새로 고르는 일이 없어집니다.
테마 · 플러그인 입문
파일 두 개면 끝납니다. 다만 헤더의 Template 한 줄과 스타일 로드 순서를 잘못 잡으면, CSS 를 아무리 써도 화면이 바뀌지 않습니다.
테마 · 플러그인 입문
연한 회색 본문은 시안에서 가장 세련되어 보이고, 실제 화면에서 가장 먼저 읽히지 않습니다. 기준값 세 개만 알면 색을 고르는 그 자리에서 판단할 수 있습니다.
테마 · 플러그인 입문
좁은 화면에서 시작하면 결정할 것이 줄어듭니다. 넓은 화면에서 시작하면 매번 무엇을 버릴지 정해야 하고, 그 결정은 끝나지 않습니다.
테마 · 플러그인 입문
웹의 기본 행간은 라틴 알파벳을 기준으로 정해진 값입니다. 한글은 같은 크기에서 글자 안의 획이 더 촘촘하고 받침 때문에 실제 글자 높이도 커서, 같은 1.5가 훨씬 답답하게 읽힙니다.
테마 · 플러그인 입문
시안에 붙은 색 견본과 디자인 토큰은 값이 같아도 다른 물건입니다. 차이는 값이 아니라 이름에 있고, 그 이름이 6개월 뒤의 수정 비용을 정합니다.
성능 최적화 입문
사진과 평면 도형은 압축이 작동하는 원리가 다릅니다. 그 차이를 알고 고르면 눈에 보이는 화질은 그대로인 채 파일만 작아집니다.
테마 · 플러그인 입문
테마 업데이트는 폴더를 통째로 교체합니다. 그것이 정상 동작이고, 그래서 우리 수정은 교체되지 않는 자리에 있어야 합니다.