디자인토큰3 풀투리프레시 디자인 (트리거 거리, 햅틱 피드백, 결과 카피) 트리거 거리(Pull Distance)를 80px에서 60px로 줄였더니 풀투리프레시 사용률이 11%에서 27%로 뛰었습니다. 처음 이 수치를 확인했을 때 솔직히 반신반의했습니다. 고작 20px 차이가 이렇게 큰 행동 변화를 만든다는 게 직관적으로 와닿지 않았거든요. 그런데 반복 검증할수록 결과는 같았고, 이후 외주 4건에서 같은 파라미터를 표준화하면서 이 수치가 단순한 우연이 아니라는 확신이 생겼습니다.트리거 거리풀투리프레시에서 가장 먼저 건드려야 할 건 트리거 거리입니다. 트리거 거리(Pull Distance)란 사용자가 화면을 아래로 당겼을 때 리프레시가 실제로 실행되기 시작하는 임계 지점까지의 픽셀 거리를 말합니다. 이 거리가 너무 길면 사용자가 "아, 이게 되는 기능이구나"라는 걸 인지하기 전에.. 2026. 6. 5. Cursor 디자이너 활용 (온보딩, 디자인토큰, 자동화) 디자이너가 코드 저장소에 접근하는 순간, 보통 두 가지 반응이 나옵니다. "생각보다 별거 없네"와 "이거 건드렸다가 서버 날리는 거 아니야?" 저도 처음 외주에서 GitHub 레포 접근권을 받았을 때 후자였습니다. 그런데 Cursor를 쓰기 시작하면서 그 경계가 조금씩 무너졌고, 지금은 디자인 토큰 동기화부터 Storybook 스토리 생성까지 디자이너 단독으로 처리하고 있습니다.온보딩 장벽, 디자이너는 어디서 막히나디자이너가 코드베이스에 합류할 때 가장 먼저 부딪히는 것이 권한 문제와 환경 설정입니다. 실제로 팀 단위 온보딩을 진행해 보면 처음 한 시간이 거의 퍼미션 이슈로 날아가는 경우가 많습니다. 대기업일수록 더합니다. 엔지니어링 리소스가 디자이너에게 미리 프로비저닝(provisioning)되지 않는.. 2026. 5. 21. 디자인 토큰 (토큰 구조, 네이밍 컨벤션, 자동화 파이프라인) 버튼 하나의 컬러를 바꾸는 데 이틀이 걸렸습니다. 수동으로 화면 수십 개를 뒤지고, 개발자에게 헥스코드를 일일이 붙여 넣어서 전달하던 시절 얘기입니다. 디자인 토큰을 도입하고 나서야 그게 얼마나 비효율적인 구조였는지 실감했습니다. 이 글은 그 경험을 바탕으로, 토큰 구조 설계부터 네이밍 컨벤션, 자동화 파이프라인까지 실무에서 어떻게 작동하는지 풀어봤습니다.손으로 하나씩 고치던 시절, 토큰 구조가 바꾼 것디자인 시스템을 도입하기 전 저는 프리랜서 UI/UX 디자이너로 B2B SaaS 프로젝트를 진행하고 있었습니다. 당시의 작업 방식은 단순했지만 끔찍했습니다. 디자인 수정이 생기면 Figma에서 화면별로 일일이 컬러를 찾아 바꿔야 했고, 개발자에게 넘길 때는 "#1A1A2E입니다"처럼 헥스코드를 직접 전달했.. 2026. 4. 10. 이전 1 다음