stackd
실제 개발자들이 어떤 상황에서, 어떤 순서로 도구를 쓰는지 워크플로우를 카드 한 장으로 공유하는 서비스.
스크롤을 애니메이션의 트리거가 아니라 재생 헤드로 다뤘습니다. 사용자가 속도를 지배하므로 어느 지점에서 멈춰도 화면이 완결된 상태여야 했고, 그래서 모든 구간을 '중간에 멈춰도 읽히는가'로 검사했습니다.
가장 많이 고쳐 쓴 부분은 모션을 줄인 환경 대응입니다. 핀과 스크럽을 걷어내는 것만으로는 부족했고, 초기 상태를 CSS가 아니라 GSAP이 잡게 바꾼 뒤에야 요소가 영영 보이지 않는 경우가 사라졌습니다.
타이포그래피는 컨테이너 폭에서 크기를 역산합니다. 문자열마다 값을 손으로 맞추는 대신 글자 수로 계산해, 문구가 바뀌어도 다시 조정할 일이 없습니다.
- NEXT.JS
- TYPESCRIPT
- TAILWINDCSS
- SHADCN/UI