Technote

워드프레스 실무 노하우 골라 읽는 기술 노트

글 17편· 개발 워크플로우 · 디자이너

개발 워크플로우 심화

배포 전 디자인 QA 체크리스트

배포 후에 발견하는 디자인 문제의 대부분은 배포 전에 순서대로 확인하면 잡힙니다. 규칙 · 상태 · 실기기의 세 단계로 정리했습니다.

디자이너 3분 읽기

개발 워크플로우 심화

되돌릴 계획 없이 배포하지 않습니다

롤백은 버튼 하나가 아니라 코드와 데이터베이스 두 갈래이고, 되돌리는 순서가 있습니다. 그 순서를 배포 전에 적어 두는 것까지가 준비입니다.

디자이너 5분 읽기

개발 워크플로우 실무

간격은 숫자가 아니라 척도로 넘깁니다

"여기 37px" 은 그 자리 하나만 해결합니다. "간격은 이 열두 단계에서 고른다" 는 그리지 않은 화면까지 함께 해결합니다.

디자이너 3분 읽기

개발 워크플로우 심화

스크린샷 회귀 검사로 바뀌면 안 되는 화면 지키기

한 줄 고쳤는데 엉뚱한 화면이 틀어지는 일은 CSS 에서 흔합니다. 스크린샷 비교는 그것을 잡아 주지만, 실제 작업은 지킬 화면을 고르고 거짓 경보를 줄이는 쪽에 있습니다.

디자이너 4분 읽기

개발 워크플로우 실무

취향 논쟁을 규칙 확인으로 바꾸는 디자인 리뷰

"좀 답답해 보인다" 는 반박할 수 없고 고칠 수도 없습니다. 간격 척도 밖의 값, 팔레트 밖의 색, 기준 미달 대비, 빠진 상태 — 네 항목만 규칙으로 바꿔도 리뷰의…

디자이너 4분 읽기

개발 워크플로우 실무

시안은 실제 콘텐츠로 만들어야 합니다

길이가 고른 자리표시자 문장은 레이아웃의 문제를 전부 감춥니다. 실제 문장은 길이가 제각각이고, 그 불규칙이 바로 화면이 무너지는 지점입니다.

디자이너 3분 읽기

개발 워크플로우 실무

스크린샷이 아니라 실제 화면으로 리뷰받습니다

스크린샷은 가장 좋은 조건의 한 순간입니다. 상태와 예외와 실제 콘텐츠는 스테이징에서만 드러나며, 스테이징에는 지켜야 할 조건이 있습니다.

디자이너 3분 읽기

개발 워크플로우 실무

상태와 예외를 그리지 않으면 구현이 갈라집니다

기본 상태만 그린 시안은 화면의 절반만 정의한 것입니다. 나머지 절반 — 빈 목록 · 오류 · 긴 제목 — 은 구현 중에 즉흥으로 채워지고, 그 즉흥은 대체로 의도와…

디자이너 3분 읽기

개발 워크플로우 입문

디자인과 코드가 같은 이름을 쓰게 만들기

이름이 다르면 대화마다 번역이 한 단계씩 붙습니다. 그 번역은 시간이 지날수록 사람 머릿속에만 남고, 새로 합류한 사람에게는 전달되지 않습니다.

디자이너 3분 읽기

개발 워크플로우 입문

핸드오프에서 넘길 것은 시안이 아니라 규칙입니다

시안을 스무 장 넘겨도 개발자는 스물한 번째 화면을 묻습니다. 그리지 않은 화면까지 스스로 만들 수 있게 하는 것은 규칙이고, 규칙은 시안과 다른 형태로 넘겨야 합니다.

디자이너 3분 읽기

Cited

함께 보면 좋은 기술 노트

워드프레스 밖의 주제는 같은 팀이 운영하는 동지커뮤니케이션 기술 인사이트에 정리돼 있습니다. 아래 요약은 원문 그대로 인용했으며, 제목을 누르면 원문으로 이동합니다.

기술 인사이트 전체 보기

₩270,000 · 신청하기