Goal: Increase user experience by allowing to share images on their profile and inside landmarkers, but to minimize data usage
Currently, users can upload an image in their profile in 3 different ways:
By pressing the plus button at photos in their own profile
Edit profile > Change background photo
Edit profile > Edit image
Method 1 and 2 make use of the same dialog popup, in which the code checks if an image is below 200kb and doesn't allow uploading if it exceeds (see image below).
Method 3 makes use of a plugin Vue Croppa. This is a nice plugin, but has its limits and I rather get rid of it.
Both methods aren't ideal, but work for now. In terms of granting the best possible user experience, I would like to create the possibilty to upload any image with any size, but that it's automatically being resized to something between 100-200kb (or less). When we can do that, it would be nice to allow users to upload pictures at landmarkers as well.
What's stopping us?
I've been trying to build a system that resizes images to 200kb automatically, but haven't been able to do so due to a lack of personal knowledge.
Beside, we should also be asking ourselves what is the best and cheapest way to store those images. For now, they are stored in Firebase Storage, but this might become a very pricy feature as there is more data stored. (see pricing below)
Goal: Increase user experience by allowing to share images on their profile and inside landmarkers, but to minimize data usage Currently, users can upload an image in their profile in 3 different ways:
Method 1 and 2 make use of the same dialog popup, in which the code checks if an image is below 200kb and doesn't allow uploading if it exceeds (see image below).
Method 3 makes use of a plugin Vue Croppa. This is a nice plugin, but has its limits and I rather get rid of it.
Both methods aren't ideal, but work for now. In terms of granting the best possible user experience, I would like to create the possibilty to upload any image with any size, but that it's automatically being resized to something between 100-200kb (or less). When we can do that, it would be nice to allow users to upload pictures at landmarkers as well.
What's stopping us? I've been trying to build a system that resizes images to 200kb automatically, but haven't been able to do so due to a lack of personal knowledge.
Beside, we should also be asking ourselves what is the best and cheapest way to store those images. For now, they are stored in Firebase Storage, but this might become a very pricy feature as there is more data stored. (see pricing below)