Photos are looking crappy/pixelated in Mobile [Not solved]

Hello Bubblers,

I’m posting uploaded photos from users in my app. Nevertheless, photos are looking pixelated when accessing the app from a Smartphone.

They look way too sharper when app is accesed from a laptop or looking to the same photo through the gallery app in my Smartphone

Is there any way to improve the image “render” quality for mobiles?

-d.

ps. pardon my “crappy/pixelated” English!

1 Like

Are you using imgix by any chance? (post processing)

Also some image formats (jpeg codecs?) load images in passes. First pass may be blurry (check how Product Hunt is doing it, for instance) or pixelated, then image loads completely within 2nd or more passes.
So if you have slow internet on your phone, maybe this is the reason.

Hello @zergaka, thanks for jumping in!

No, I don’t think I’m using imgix. I’m uploading photos stored in the device and from the smartphone camera to the app using the picture uploader input form in bubble editor and showing them using the image visual element (some as page static elements and some as a result in a repeating group).

Regarding your second entry, using both 4G and WiFi images look the same.

Take a look of the dramatic difference:

Smart phone (screen capture):

Laptop (screen capture):

Any suggestions?

Without seeing the editor, It just looks like for some reason the phone actually raises the pixel width/height of the image beyond what it should be, while the laptop leaves it at its native width. Phone is 1000px wide vs Laptop which is 334px wide… That would definitely make it look pixellated.

Ok, It seems the right Track, any ideas how to solve It?

Thank you @DiscipleGeek

Anybody else want to chime in?

This can be fixed by going to settings > general

and then selecting output density of images to something like 2x or 3x depending on your needs

2 Likes

Hello,

@jjj230 this output density feature makes pictures look a lot better in mobile.

Oh wow! Such an easy fix. Thanks a bunch, dude.