A lot of people start with "mobile-first" design approach to ensure their website looks best on both desktop and mobile. This is an easy way to start, but it's not always the best way.
So what's a "mobile-first" design approach? It’s a term that refers to starting your design on a mobile size screen, with the idea that the majority of users will view your website on mobile. When should you use this approach and how do you get your designs to look great everywhere? We’ve got the answers for you!
It’s VERY important to identify that your target market actually does look at mobile first. For example, if you’re targeting to a group of hospitals for a B2B product, they will likely be using their work computer when landing on your website. So this approach should only be if more than 50% of your target audience will land on your website on mobile.
When designing mobile-first, you may loose some creativity that you could have on a desktop. For example, in our design approach we like to go BIG with lots of ideas first and then simplify. This is because it’s much harder to expand on not a lot of ideas and it’s much easier to narrow down on the ideas that you like. When designing mobile-first, you start with a limited amount of room, which in some cases can feel like a limited mindset.
The mobile-first approach is also not the best for projects that want a lot of animation and interactivity. Those complex interactions don’t hold up well on every device, so if you’re thinking of having that on your website, make sure your user base is also landing on desktop in addition to mobile so that they will see it!
Key tip: A good rule of thumb is to always treat animation and interactions as an add-on (don’t make it your core appeal because it doesn’t show up well on every device).
The mobile-first approach also can limit your thoughts on function. This is an important one because a lot of web platforms will have an enhanced version available on desktop and a limited version available on mobile. So if you start with just mobile in mind, you end up trying to cram every single feature on a small screen.
Whereas, you want to have your core features on a small screen and then additional features available on a bigger screen! Think AppleWatch for example. The apps on AppleWatch have very limited functionality because of how small the screen is.
Overall, it is absolutely important to make sure your designs are mobile-friendly — this is a must! But starting every single design on mobile in your process doesn’t work for every single project. Start by considering your needs, and then approach the design with desktop first if needed.
Considering Iris Design Collaborative for your next website project? Contact us at info@irisdesigncollaborative.com.
