Multi-Resolution / Scalable UI Apps for Android / iPhone

Started by
0 comments, last by frob 9 years, 1 month ago

Hey there.

I can imagine that this has been talked about, but my non-native chosen search terms seem to be amiss again.

So feel free to just point where this is discussed already ;-)

It's not about a game, but about an app with another target group which really likes colorful, fancy user interfaces: musicians.

So far we got a proof of concept app with pixelgraphics for exactly one type of phone ;-)

As we'd like to have a broad audience, we envision an app for iPhone and Android which works on the multitude of screen formats which there are.
When I think of "scalable", I think of vectors.

But my impression of vector graphics based stuff so far is that it can look semi-fancy but rather "functional".
Luckily we don't have anything photo-like on the screen, it's all drawn stuff so far, modern, with gradients. But there are some animations, which are currently done with a series of bitmaps...

EDIT: Let me add that we're not mobile developers. We might look into it, but an external party was doing the demo app. But they may not be experienced in doing fancy looking apps for multiple screen formats or even platforms, so I'm looking around myself a bit, to get some idea what to expect.

How to best go about this? Is this even a reasonable goal? What kind of resolution and dpi differences can be spanned, things still looking good, typically?
- unshaven

Advertisement

Usually in mobile games it just means having several resolutions of UI elements available.

There are two factors: the density of the pixels and the number of pixels.

Consider that screen sizes range from 320x200 on the tiny end up through high definition like the Galaxy Tab 8.4 at 2560x1600 screen. Also consider the number of dots per inch varies widely.

You need to consider both factors when picking your display. you want the buttons big enough that they can be finger sized, but not so big that they block your screen. A tiny screen with high pixel density you still want moderately big buttons so people can fat-finger them. On a big tablet screen with high density you may want bugger buttons, but a big tablet low density you want small size buttons so they don't take up too much screen space, and on a tiny device with a low screen density you want something that doesn't block the screen.

Often it means supporting a small number of display layouts, perhaps from 3 to 8, often supporting LDPI, MDPI, HDPI, XHDPI, and XXHDPI, optionally supporting both landscape and portrait variants of each.

In practice, relative to the difficulty of making a game, intelligently selecting and placing your UI buttons is a minor task. Have the UI artist provide several sizes of icons (eg 144x144, 96x96, 72x72, 48x48, and 36x36) then select your preferred buttons and layouts when the app starts. When you need to rotate send out a notification to all your components, and be done.

This topic is closed to new replies.

Advertisement