search

vuestorefront / storefront-ui

A frontend library for Vue and React that helps developers quickly build fast, accessible, and beautiful storefronts. Made with 💚 by Vue Storefront team and contributors.
https://storefrontui.io
MIT License
2.33k stars 455 forks source link

[FEATURE] Handling videos in gallery molecule #1947

Closed animyrch closed 1 year ago

animyrch commented 3 years ago

Hello,

Describe how this feature will help us improve It is quite common to want to use videos on product galleries alongside images.

Is your proposal related to a problem? No

Describe the solution you'd considered My proposed solution is the following :

Other relevant info

┆Issue is synchronized with this Jira Zadanie by Unito

Baroshem commented 3 years ago

Hi @animyrch

This is a very cool idea. I have seen many online stores with videos in their gallery. Could you please create a pull request with that feature? It will be very beneficial to have such a functionality in Storefront UI 😉

animyrch commented 3 years ago

Update : first iteration for this development is published on my forked repo in case anyone wants to give feedback or start using it. https://github.com/animyrch/storefront-ui/tree/%231947-feat/video-integration-in-gallery

Indeed, I would very much like to get some feedback about the following points : 1/ I think 'making it possible to arrange videos and images in any preferred order' is too complicated compared to the value it adds. I think it would be a good idea however to give the user the option to display either the images or the videos first in the thumbnail list. Yet, I would like to leave it for a second iteration if the demand arises and for the moment, display the videos first if any (since videos are usually more attractive and gripping to the user than images). What do you guys think ?

2/ I think in the future, we can create a sfVideo atom that would handle the most prominent video players (youtube, vimeo, etc.) in an optimized way according to the platform. But within the framework of this first iteration, I wanted to keep it simple and assumed that we will be given a youtube link and integrated an iframe in the way Youtube recommends. What do you guys think ?

Baroshem commented 3 years ago

@animyrch

Thanks for that! I will review this idea tomorrow as todat I am off work.

@AdamPawlinski could you please take a look at that?

animyrch commented 3 years ago

Hi @Baroshem ,

Thank you for your time and attention on this issue.

In addition to the above, I had another question in mind. Should we add a 'video play button' icon on video thumbnails automatically ? Or should we leave it to the end user ? Imho, we should handle it automatically (or least have an option to activate such functionality via a prop) for the reasons below :

Video thumbnails look no different than image thumbnails and when the user switches to an image and then wants to go back to the video, the thumbnails are not very helpful. Play icon would help with that. Also, almost all users would want to add such an icon on their video thumbnails programmatically instead of adding such an icon on the thumbnail image itself (for example, Youtube provides an endpoint for fetching a video thumbnail automatically but there is not play icon on that image).

If this idea is a go, do we already have a play icon in the project ready to use ? Last time I checked, I felt like there wasn't one. IF that is the case, how would I go about adding one ?

Thanks once more.

Emir

Baroshem commented 2 years ago

@animyrch

Sorry for the late response but we had been very busy recently. @dt2patel could you take a look at it? This is really an interesting feature that could be usable in many cases

aniamusial commented 1 year ago

Hey @animyrch - we will no longer support new features in SFUI 1.0, as it now in maintenance mode. I highly recommend to try out and migrate to SFUI 2.0: https://docs.storefrontui.io/v2/vue/getting-started.html