Svg로 Rounded rect형태의 progress bar 만들기 (feat. animation, path)

Progress bar를 구현해야한다.웹에서 찾을 수 있는 여러 예제들을 참고하여 사용해도 되지만, 커스텀하기 어려운 경우 직접 구현을 해야한다.바로 생각나는 엣지 케이스는 무엇일까 ? Rounded progress bar의 코너 부분채워지는 bar의 Corner 부분! base bar의 코너가 rouneded가 아니거나 + 채워지는 bar도 roun

04_UX 💅Accessibility

2021-01-24

피츠의 법칙과 Touch Target

[UX/UI의 10가지 심리학 법칙] 책을 읽으며 법칙별로내용 요약 + 개인적으로 찾았던 레퍼런스 + 그밖에 자료들을 모아서 작성한 글입니다. 사용하기 위해 움직이는(소비하는) 시간을 줄인다. → 접근성 인터렉션은 최소한의 노력만으로 불편없이 간단하게 이뤄져야 한다. 사용자가 인터랙티브 요소를 사용하려고 움직이는 데 드는 시간은, 인터렉션의 중요한

04_UX 💅Notion

2021-01-10

프론트엔드 개발자에게 UX는? 연기에 몰입해서 나오는 배우들의 애드립

피플웨어 책 초반에 이런내용이 나온다. .. 우리가 아는 프로젝트 대다수에서 그 어떤 기술적인 난관보다 사회적인 복잡도가 훨씬 더 컸다는 사실이 분명해 졌다. 그러면서, 불가피하게, 우리는 아주 속상한 결론에 도달했다. 다분히 사회학이 기술보다 더 중요하다는 사실을 오랫동안 느낌으로 알아왔으면서도 정작 우리 중 누구도 그렇게 관리하려 시도하지 않는다는 사

2018

04_UX 💅Motion

2018-02-25

Airbnb - lottie - bodymovin 웹에서 사용해보기

airbnb 앱을 쓰다보면 곳곳에서 다양한 애니메이션을 볼 수 있다. 한 서비스에 애니메이션이 있으면 있을수록 자연스러운 사용성 유도, 사용자의 감성에도 메세지를 전할 수 있고, 서비스의 브랜드가 더 기억에 오래남고 강해진다고 생각한다. 모션을 좋아하는 성향과 모션이 줄 수 있는 위의 특징때문에 곳곳에 모션을 넣는 것을 좋아하는데, 그러던 중 airbnb

필오의 개발 docs ✨✊

Category: 04_UX 💅

Svg로 Rounded rect형태의 progress bar 만들기 (feat. animation, path)

피츠의 법칙과 Touch Target

프론트엔드 개발자에게 UX는? 연기에 몰입해서 나오는 배우들의 애드립

Airbnb - lottie - bodymovin 웹에서 사용해보기