시스템 설정에 따라 애니메이션 제한 하기 iOS, 웹, 안드로이드

감각에 민감한 사용자들은 화면의 과도한 애니메이션, 전환 효과, 번쩍임 등에 불편을 느낄 수 있다.

그래서 OS에서 "애니메이션 줄이기" 기능을 제공하고 앱이 이 설정을 따라서 애니메이션을 줄여줘야 한다.

---

iOS 에서는?

• 시스템 설정 : 설정 > 손쉬운 사용 > 동작 > 동작 줄이기
• 이 설정을 켜면, 앱페이지 전환 애니메이션, 파티클 효과 등 불필요한 움직임을 줄요야 한다.

Swift 대응 방법 (iOS)

if UIAccessibility.isReduceMotionEnabled {
    // 애니메이션 없는 대체 처리
    myView.alpha = 1
} else {
    // 원래 애니메이션 처리
    UIView.animate(withDuration: 0.5) {
        myView.alpha = 1
    }
}

 

---

 

웹에서의 처리는?

CSS에서도 아래와 같이 처리 가능하다

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
}

 

---

 

Android에서는?

• Android도 시스템에서는 애니메이션 줄이기 기능 제공(Settings > 접근성 > 애니메이션 줄이기)
• Java/Kotlin에서 시스템 설정을 감지해서 animate() 호출 조건 분기 가능