본문 바로가기

카테고리 없음

스켈레톤 애니메이션 - OLED 저명도 알파 합성 플리커 현상

고사양 안드로이드 단말에서
어두운 배경의 스켈레톤 알파 애니메이션이 미세하게 깜빡이는 현상을 보신 적 있으실 것임.

특히:

  • 암막 환경
  • 어두운 백그라운드
  • 낮은 명도 영역
  • 최대 밝기 상태

이 조건에서 더 잘 보임.

이 현상은 단순 UI 버그라기보다
OLED 특성과 알파 합성 구조에서 비롯된 구조적 문제에 가까움.


1. OLED 저명도 영역의 물리적 한계

OLED는 구조적으로 저명도(0~10 수준) 표현이 어려운 상태임.

특징은 다음과 같음.

  • 0~10 구간에서 밴딩 발생
  • 블랙 근처 전류 제어가 매우 민감
  • 미세한 전압 변화도 눈에 크게 인지됨

알파 애니메이션이 이 영역을 건드리면
1단계 값 변화만으로도 플리커처럼 체감될 수 있음.


2. 알파 합성과 정수 단차 문제

알파 합성은 기본적으로 다음 계산임.

 
result = background * (1 - alpha) + foreground * alpha
 

내부 계산은 float지만
최종 출력은 정수 픽셀 값임.

즉 반올림이 발생함.

예시:

  • 10.4 → 10
  • 10.6 → 11

저명도 영역에서 10 → 11은 체감상 큰 차이임.
이 변화가 프레임 단위로 반복되면 깜빡임처럼 보이게 됨.


3. 왜 고사양 단말일수록 더 잘 보일까?

직관과 반대일 수 있음.

저사양 단말

  • GPU → 패널 전달 과정에서 지연 발생
  • 드라이버 단계에서 암묵적 스무딩
  • 결과적으로 값이 약간 뭉개짐

완벽하지 않아서 덜 티나는 상황임.


고사양 단말

  • 연산 결과가 즉각적으로 패널에 전달
  • 보정 없이 그대로 출력
  • 10 → 11 단차가 명확히 노출

정확하게 계산될수록
정확하게 티나게 됨.


4. 배터리 최적화와 합성 경로

안드로이드의 합성 경로에서는
일부 상황에서 디스플레이 하드웨어가 알파 연산을 수행함.

전력 최적화 관점에서:

  • GPU 대신 디스플레이가 일부 처리
  • 저전력 상황에서 전류 안정성이 완벽하지 않을 수 있음
  • 저명도 영역에서 변동이 더 도드라질 수 있음

단, 이 부분은 제조사 및 SoC별 차이가 있음.
모든 기기에 동일하게 적용된다고 단정하긴 어려움.


5. 웹뷰에서 덜 보이는 이유

웹뷰는 Google Chrome 기반 렌더링 엔진을 사용함.

브라우저 엔진은:

  • 디더링
  • 내부 노이즈 처리
  • 색공간 보정

등을 통해 저명도 밴딩을 완화하는 경우가 있음.

그래서 동일한 알파 애니메이션이라도
웹뷰에서는 덜 티나는 것으로 보일 수 있음.


6. iOS는 왜 상대적으로 덜 보일까?

Apple Inc.

  • 하드웨어
  • SoC
  • GPU
  • 디스플레이
  • OS

를 모두 통합 설계함.

저명도 영역에서:

  • 의도적 노이즈 삽입
  • 내부 색 보정
  • 드라이버 레벨 스무딩

등을 통합적으로 제어 가능함.

반면 안드로이드는

  • OS는 Google
  • 하드웨어는 다수 제조사

조합이 매우 다양함.
일괄적인 디스플레이 보정 전략 적용이 현실적으로 어려운 구조임.


7. 환경이 플리커를 증폭시키는 이유

  • 암막 상태 → 동공 확장
  • 어두운 배경 → 저명도 영역 집중
  • 최대 밝기 → 전류 변화 대비 극대화

결론적으로

고사양 OLED 단말을
어두운 환경에서 최대 밝기로 보면

알파 애니메이션의 단차는 보일 수밖에 없는 구조임.


8. 실무적 해결 방향

글로벌 서비스들은 스켈레톤에서

  • 알파 페이드 최소화
  • 고정 회색 블록 사용
  • 쉬머링(shimmer) 중심 애니메이션 사용

알파 값이 저명도 영역에서 진동하는 구조 자체를 피하고 있음.

근본 해결은:

  • 저명도 알파 애니메이션 제거
  • 최소 밝기 클램핑
  • 디더링 삽입
  • 명도 높은 스켈레톤 사용

설계 단계에서 접근하는 것이 현실적인 해결책임.


디더링이란?

4

디더링(Dithering)은
표현 가능한 색상 단계가 부족할 때 인위적으로 노이즈를 섞어 자연스럽게 보이도록 만드는 기법임.

쉽게 말하면,

부족한 단계 수를 “눈을 속여서” 부드럽게 보이게 하는 기술임.


왜 필요한가?

디스플레이는 보통 8bit (0~255) 단계로 표현함.
하지만 저명도 영역에서는 0~10 구간의 단계 수가 매우 제한적임.

예를 들어:

  • 실제 계산값은 10.4
  • 출력은 정수 10

이 상태가 반복되면 계단 현상(밴딩)이 발생함.

이때 디더링을 적용하면:

  • 어떤 픽셀은 10
  • 어떤 픽셀은 11

을 섞어서 배치함.

멀리서 보면 평균값 10.4처럼 보이게 됨.

반응형