Design for India — Replacing Placeholders with Real Data
As a Designer, it’s our job to make things look sexy and drop the jaws of stakeholders & executives while the entire Dribbble community goes crazy with likes and comments for aesthetics & animations.
While it’s easy to follow patterns/guidelines and other things specific when designing for India, it’s also easy to forget that when you’re making these high-fidelity mockups the data that will actually be available to you will be far less pleasing and mostly congested for you to be able to please your user with that multimedia.
Here’s an example:
I’m designing for CreditMate. We help the masses get their dream bike while also providing necessary finance for the same. So, when I pull visually appealing images from Pexels & Unsplash — they look super appealing in presentations and alike.
The problem is, that when we’re pulling these glorious images, we forget to take into account what the real image will look like.
I used to design earlier thinking the image will be spectacular and we can place anything above the image to ensure it will always fit in with the images. I was wrong.
While my designs were wonderful, when real data struck, I had poor quality images which made absolutely no sense with actions on top of it, because I designed considering the image that is fetched will always be equivalent to the feature rich stock images.
What’s important to understand is, the market we’re targeting and pulling data from. We often proudly exclaim The Next Billion/ Emerging Markets/ Inclusive Design but we forget to understand that while we’re designing for India, most of our inputs are also from these users who own phones that might not have the best cameras, or even if they do we won’t get DSLR level photo quality.
Designing for Emerging Markets when your input comes from the same target audience, enforces you to think through the actual data that will show up in your mocks.
Let’s look at my mockups with a real data fetched from photos taken through the next billion users who want to sell their vehicle.
The images are barely pleasing and hardly make the user feel welcome to the website. However, the user still can see necessary information, which is decent. Also, since the images aren’t covered with UI elements, the user is able to see the entire image, which even if low quality — delivers a complete experience to the user.
Takeaway: Test your designs with real images. Leave the image alone because there can be noise and congested information or simply low quality media which will spoil your design. Instead design for transparency and providing information upfront without dependency on external factors like images. Also, account for stuff such as slow loading of images which might disturb the UI.
Take into consideration the talent strength within the organisation or company you’re designing for. Understandably, developers like to solve challenging problems instead of ensuring your pop-up has a background blur behind it. Also, developers have an extensive backlog of business logic that needs to be implemented which is far more necessary than those rounded corners and gradient perfection — design for inclusivity of everyone, not just the user.
