Designing a Viz for Multiple Screens - A Pragmatic Perspective

I was preparing to tinker some more with a d3.js visualization from last year, with the idea to improve the experience on mobile devices. In looking at it, I had forgotten I had already done this in a first pass, so that it is roughly usable on iPhone and iPad.

Some may insist that you use feature detection, and not try to target specific devices. I have seen some insist you just manually find out where the breakpoints are by resizing your screen, etc. These are nice goals. However, you would still need to take a look on the actual devices (or in a simulator/emulator) to see what really happens, and potentially need to do something for a specific device, anyway. And there could be a LOT of breakpoints that require a reorganization of the interface. Yes, each breakpoint would result in a nice little puzzle to figure out as to a nice way to flow on the page/screen, but there could be a lot of them.

For the last month, for example, about 30% of the hits were from a mobile device of some sort. There are 411(!) different mobile devices listed. Number 411 on the list was the ZTE Z990g Merit, which apparently is a prepaid phone you can get from WalMart, with a screen size of 320x480 pixels.

Mobile Device% of Mobile Devices% of Total,
including Desktop
iPhone48%15%
iPad13%4%
Galaxy S III4%~1%
Not Set3%~1%
407 Other Devices,
each with 1% or less
~32%~9%
A Breakdown of Mobile Devices hitting a Viz for the last Month
(via Google Analytics)

Who has resources to confirm their stuff looks ok on 407 other devices (or more), and adjust accordingly for each device?.

Personally, until I see how it looks on a device (or at least an emulator), I wouldn't rely on any generic approach or reported device characteristics, and doing this for the 407 devices that make up 9% of the total seems an undertaking that requires some careful thought before embarking on such an enterprise. Sure, as a personal technical challenge, it would be fun, and you'd learn a lot. But it is not a trivial amount of time.

Maybe there's a silver bullet here. I don't know what it is.

Anyway, one thing for sure is that I need to take another look at things on the iPhone and iPad - especially the iPhone. And I happened to get a new one of those today to help test. Alas, my daughter has never been particularly charitable with letting me borrow her iPhone for the odd minute or two I need it every now and then.

Popular Posts