As of the moment, we can only use one (1)one (one (1) photo for our Cover Image. This image may be used all throughout the platform or even in other react/front-end sites based on Steemit (if that site chooses to adopt it). Currently, we have issues with its scaling when using Steemit in mobile.
Since the image we used is either suitable for desktop or suitable for mobile but not for both - we end up getting either a misaligned image, a smaller image, or a larger one.
I think we can easily resolve this by letting users Upload and use two (2) (two (2) cover images. One for Desktop View and another for Mobile view.
GIF by @deveerei.
The settings page can look like what you see above you (without the spinning Photo icons lol). Enabling a space where you can add both a Desktop and a Mobile Cover Image URL.
This gives users the freedom to scale their own images based on the required/suggested file sizes (width x length) that will be used for either the Desktop or the Mobile modes of Steemit.
This is the cover image I'm using for my blog:
I'll show you my cover image in Desktop mode next, in the current Steemit settings, here's what it looks like:
Steemit scales it automatically depending on the length of your description and depending on the reader's view and screen resolutions.
Now, here's what my cover image looks like in Mobile mode:
Implementing separate images used between the desktop and mobile view will fix this since I'll be able to put things into focus since I have control because I know what sizes they should be.
Let's say they implement it, great, the 2 recommended sizes could be these:
Graphics by @deveerei.
- 1080 pixels in width by 360 pixels in height in Desktop Mode.
GIF by @deveerei.
- 480 pixels in width by 360 pixels in height in Mobile Mode.
Those are just suggestions, I'm sure they would know what's the best resolution for cover images in both modes for better scaling in multiple devices and screen resolutions.
What do you think? Will this be a great addition to the User Experience of Steemit? Thanks for reading!
Open Source Contribution posted via Utopian.io