1. The Challenge
The Daily Mail data showed a significant shift: 68% of traffic originated from mobile devices by 2025.
"How do we overhaul the visual experience for the 68% mobile majority without degrading the experience for the 22% of loyal desktop/tablet users?"
Mobile traffic as of 2025
2. User Research & Insights
Pinch-to-Zoom Friction
Users dropped off when forced to manually zoom to read data points.
Information Density
Graphics failed the "glance test" on 6-inch smartphone screens.
Aspect Ratio Mismatch
Landscape graphics left massive wasted space on vertical screens.
3. Design Strategy: "Responsive Storytelling"
| Feature | Mobile (68%) | Desktop (22%) |
|---|---|---|
| Layout | Vertical Stacking | Horizontal Spread |
| Typography | Min 12px; High Contrast | 12px - 16px |
| Interactivity | Tap/Swipe Cards | Click/Hover Tooltips |
4. The "Dual-Path" Implementation
Vector-Based Rendering
Switched from static JPEGs to SVG/HTML5 for infinite scalability.
Conditional Loading
Device detection serves a "Simplified Vertical" or "Detail-Rich Horizontal" version automatically.
5. Impact & Results
Time-spent-on-page (Mobile)
Full Accessibility Compliance
One master dataset for all devices
6. Reflection
The solution wasn't about choosing one platform over the other; it was about reframing the graphic as a container for information rather than a fixed picture. By prioritizing the 68% through mobile-first design, we actually created a cleaner, more legible experience for the remaining 22% as well.