0

I am developing an application which has a website and a mobile app (iOS and Android). On a particular page, A pop-up contains a "x" (close) button on the top right. I do not want the same design for the iOS app. Is it okay to have a different design for the pop-up on the website and the pop-up on the mobile app version?

1

Design could and should be different aligned to platform guidelines and specifics.

UPDATE
Here I refer to UX planes which are presented by J.J.Garrett in The Elements of User Experience and try to describe the reasons of differences in design. I include in design all the planes, not only visual design (surface plane).

reasons for differences

So, the differences in design:

  • Could be – for example, as part of strategy or reduced functionality or some other differences considering device features and constraints.
  • Should be – it's obvious there are differences in layout at desktop and mobile in most cases. Moreover each platform has its own guidelines conserning interface design principles, controls and interaction patterns (Android, iOS). So designer should apply them to create platform-consistent product.
  • Hi Alexey, can you provide some references to back your answer? – rk. Jun 16 '13 at 16:55
1

I think the main message that the pop-up is showing is more important here. The pop-up will definitely have some " OK/Cancel" button(I hope). So, in that case that will be sufficient to interact with.

The message will be conveyed to the user via the pop-up. So, the user will always be viewing the main message rather than the close button orientation. You can use the OS specific orientation of close buttons,no doubt, but it may not be very much required I guess.

This will help you, I think.

1

I concur with Alexey. Design should be different for the website and mobile, especially with reference to the scenario mentioned by you. There are different information architecture guidelines, design guidelines, platform specific guidelines when it comes to mobile and you should definitely be aware of these while developing the app rather than mimicking your website. Remember "Mobilize, Dont Miniaturize"! That being said, to maintain brand identity and consistency in the site and apps across platforms, it is advised to stick to the same theme when it comes to UI. (Custom icons, logos, color, etc)

I found these articles really useful when I first started designing for mobile:

http://www.uxbooth.com/articles/designing-for-mobile-part-1-information-architecture/

http://www.uxbooth.com/articles/designing-for-mobile-part-2-interaction-design/

Hope these help!

0

As I understand it, the dialog would be a custom one with an 'X' on the corner.

As much as possible I would go with having a consistent "look-and-feel" across platforms, with the "feel" part changing in instances where it necessary to follow the platform's design guidelines.

A good example would be the Twitter website (including mobile version), and its apps. As you might notice, Twitter defined a consistent "look-and-feel" that would associate the app as belonging to Twitter, yet follows each of the platforms design guidelines and rules.

Another example would be foursquare.

  • would iOS users feel comfortable having the 'X' on the top right corner ? – m177312 Jun 17 '13 at 6:16
  • 1
    If the popup would be custom styled to match the application's "look-and-feel", I don't see a reason why would they not be comfortable. First is, its your app. By following the each platform's design guidelines and adding your touch to it. What you want is for the user of each platform not to be alienated on your UI and still "feel" that they are in your app. Also make sure that the 'X' is big enough for the user to press. – deubaka Jun 17 '13 at 6:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.