6

I'm new to mobile app design and I'm looking for some help.

I saw a number of screen sizes available in Adobe XD but I don't know which one is the best to start designing with.

I've heard someone saying that it's better to start with the smallest screen size because it's more compatible when scaling-up to bigger screens.

I'm wondering that is true or not. Is it better to start designing for smaller screens first?

Improve this question
3
  • 4
    Yes, you design on the smallest 'common' screen. Currently that's usually still the 320x568 format. It's easier to make your content wider than to shrink it. It also forces you to think about what you really need to show and what is essentially fluff.
    – Wendy Wojenka
    Sep 26, 2018 at 8:37
  • In addition to @Wanda comment, this is called "mobile first" or "progressive enhancement" and because above mentioned reasons is the adopted dominant logic in designing user interfaces today.
    – xul
    Sep 26, 2018 at 15:55
  • Considering the direction in which phones are headed in terms of size and resolution, pick the correct aspect ratio and design for a mid-level screen size rather than the smallest. Most phones tend to have a minimum of 1080p resolution screen so that would be a good place to start but have a 1440p mockup for higher end phones
    – Shreyas Tripathy
    Jul 26, 2019 at 11:08

3 Answers 3

Reset to default
2

Your viewport should be driven by factors such as your audience preference to a particular platform.

For example, an app we did for a previous company, allowing people to create plans for their building project - simply wasn't going to work on mobile, no matter the 'mobile first' mantra.

Understand your audience and the intention for your application, then build for the widest platform support you are able.

Improve this answer
1
  • Agreed. There are certain jobs where you know a bigger screen and a proper keyboard are going to make things easier.
    – PhillipW
    Oct 22, 2020 at 17:27
1

Smallest screen size is a good place to start because of what you mentioned; it's easier to design from that state first and adapt upwards.

But, I think there's a more informed and human-centered approach to this. What do you know about how people will interact with your app? Specifically, what's the context and technology that they're using when they need your application?

Armed with that information, you will have a little more guidance on how the interface will create better outcomes based on context, and this is where "start small and scale up" can have some blind spots. The goals of someone interacting with your app on mobile could be vastly different than those of someone using it through a tablet or desktop, and simply scaling your interface might not be the best choice. More importantly, if it is the best choice, you have some information to validate that assumption.

Improve this answer
0

Mobile-first is a great approach, but I think the question here is about something else - choosing the right artboard size when designing for mobile (we are talking about mobile devices only, so the mobile-first doesn't provide guidelines for this case). It is more about scaling your design to all screen sizes important for your chosen platform. In my opinion, a good practice is to start with XD's defaults. See the discussion here: https://forums.adobe.com/thread/2235227

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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