How to work with the same app at different resolutions / screens

Scenario : You need to expose the same app on different screens - say a standard 15 '' - 17 '' portable 10 '' and a mobile 4 '', possibly running at different resolutions.

Question : Are you trying to go to a fluid layout that will regroup based on the real estate you have, or you scroll N (one for each range) separate UI layers optimized for each specific resolution / screen size supported.

What is the industry standard for this kind of problem?

Does it make sense to come up with trick layouts that split the screen in priority areas that will go out / back out when the screen changes anyway?

We all know that iPhone apps (or any other palm device) cannot be anything other than the desktop version, so I guess in this case (4 'or less) you are forced to rewind different UIs , but is there average distance (say between 13 '' 7 '' screens, with the latter requiring fingers as the main entrance), where does it make sense to go for fluid layout?

+2


source to share


4 answers


You seem to have already decided that a separate user interface is needed for mobile devices, and I support that. The way the user interacts with these devices is so different that you need to think about them in a certain way.

For other screen sizes, I think they need to be approached from a user perspective. If the user interacts with screens in different ways, you need separate interfaces. However, in my experience, users tend to look at screens from about 10 inches upward as simply larger or smaller versions of the same thing, and therefore you should treat your user interface the same way. Don't change it abruptly for small screens. they need to find a way to grow or shrink it in such a way that the user feels like they have more room to work with the same old interface.



Text editors are a prime example of this. The document window is getting bigger, there is more room for editing documents, but the actual interface remains pretty static.

+4


source


Mobile applications (for cell phones and other handheld devices) usually receive a manual mobile user interface.

The 10 "- 13" case you're talking about is more in the netbook space. In this case, the device UI is similar (in most cases) to a regular desktop UI, so I would go with fluid layout and use the same interface.

EDIT



See comments to clarify requirements ...

But considering that the smaller interface will be a touch interface and the larger interface won't ... I suggest using a different user interface for each. The UX for the touch version will be much better if special considerations are made regarding touch problems.

+2


source


We are just starting a project where we have a very similar problem.

In our case, the application will work slightly differently on different screens, at different stages, and fewer options on smaller screens, for example.

We are planning to use ASP.Net MVC framework and implement a view per application / screen resolution. We'll try to keep the rest of the app consistent across all screen resolutions.

+2


source


In the context of web applications, Jakob Nielsen suggests (basing his score on the latest usability tests by reading the linked article for details) to design a custom user interface for mobile devices. I think that even if your application is not web based, some of its guidelines are helpful anyway.

It has recommendations for desktop resolution .

+1


source







All Articles