TalesFM

Designing a Better Way to Experience Live Radio

LIVE NOW|Smooth Jazz 24/7
THE UI EXPERIMENT
React Native Visual Performance
87.5
91.3
95.1
98.7
102.5
106.3
107.9
98.7 FM
SCROLL TO EXPLORE
LAB_02: THE_REALITY_CHECK

Visual Parity ≠ Experience Parity

Drag the slider to reveal the rendering differences between native iOS and React Native on Android

9:41

Now Playing

Smooth Glass Effect

Cosmic Journey

Album Artwork

NATIVE_FIDELITY
9:41

Now Playing

Blocky Blur Fallback

~45fps

Cosmic Journey

Album Artwork

ABSTRACTION_FRICTION
DRAG_TO_COMPARE

iOS_NATIVE

Blur Effects98%

Hardware-accelerated Gaussian blur with real-time rendering at 120fps

Bottom Sheets95%

UIKit spring animations with natural momentum and rubber-banding

Transition Performance99%

Metal-backed layer compositing with implicit animation batching

ANDROID_RN

Blur Effects62%

Software-rendered blur with noticeable frame drops on mid-tier devices

Bottom Sheets58%

Basic easing curves without haptic feedback or gesture prediction

Transition Performance54%

Serialization delays causing 16-32ms frame drops during navigation

ENGINEERING_JUDGMENT: Framework abstraction costs must be measured in user experience, not code elegance
EXPERIMENT

EXP_03: BEHAVIORAL_SPECTRUM

Mapping the platform-specific frictions that shaped our cross-platform rendering strategy

ANDROID_RENDER

Video fallback required, memory spikes on older devices

iOS_NATIVE

RENDERING_ENGINE

GIF/Video Parity Struggle

Frame Drops

iOS0.2%
AND4.7%

The GIF vs Video rendering dichotomy forced adaptive media selection based on device capabilities.

ANDROID_RENDER

Linear interpolation, inconsistent touch velocity

iOS_NATIVE

GESTURE_PHYSICS

Bottom Sheet Behavior Gap

Gesture Latency

iOS16ms
AND48ms

iOS spring physics vs Android's linear approach created fundamentally different user experiences.

ANDROID_RENDER

60Hz baseline with inconsistent high-refresh support

iOS_NATIVE

MOTION_LOGIC

Refresh Rate Optimization

Animation FPS

iOS120
AND60

Variable refresh rate handling required conditional animation timing adjustments.

ANDROID_RENDER

Software blur with significant CPU overhead

iOS_NATIVE

BLUR_FRAGMENT

UI Effect Performance Cost

Render Cost

iOS2ms
AND18ms

Blur effects that cost 2ms on iOS consumed 18ms on Android, forcing conditional visual degradation.

SOLUTION_MODULE

THE LATENCY MIXER

Drag the faders to see how caching strategy optimized performance

CACHE_OPTIMIZER v2.1
BUFFER_TIME
2400ms
CURRENT
2400340ms
-86%
STATION_SWITCH
1800ms
CURRENT
1800180ms
-90%
CACHE_HIT_RATE
23%
CURRENT
2394%
+309%
MEMORY_USAGE
186MB
CURRENT
18652MB
-72%
COLD_START
3200ms
CURRENT
3200890ms
-72%
TOTAL IMPROVEMENT
86%
STRATEGY
Multi-tier LRU + Predictive Prefetch
TRANSMISSION_INCOMING

FUTURE_ENCODING

[SIGNAL_LOCKED]

Social Listening

Collaborative playlists & live listening rooms

MISSION_STATEMENT
"TalesFM was the laboratory where I mastered the friction between design and performance—proving that visual ambition and technical excellence aren't mutually exclusive."
AV

Anish Varshney

Team Lead & Developer

EXPERIMENT_STATUS

EVOLVED → PRODUCTION

Press to return to the main frequency

TALESFM_CASE_STUDY // v1.0.0-synthwave-edition // SIGNAL_LOCKED