5 Replies Latest reply on Jan 31, 2018 9:41 AM by johns94424267

    Options for a Video Gallery Not Using 3rd Party Widgets

    johns94424267 Level 1

      I want to start off by saying I'm still learning muse, so if there is a video for this I would really appreciate it.

       

      I am an animator trying to make a portfolio site for myself. I want to have a video gallery to show off my work, and I need it to size the thumb nails width and height proportionately.

       

      I basically want my website to work exactly like this page.

      Videos — 2D TV, Series, Games, and Advertising Video Animation Studio Austin TX | Joe Rothenberg Animation

       

      I would use a bunch of break points, but I can't have too many. Every time a break point is reached it refreshes the video and starts it from the beginning. So anyone who turns their screen on mobile/tablet will have the video exited on them.

       

      So I tried:

      - using the composition light box widget, but it distorts the images too much, and I need the thumb nails to be legible.

      - Making the thumb nails "Play Buttons" that will hover over regular thumb nails. I then set them to not change size, which clearly made them float away. Also too many break points defeats the purpose.
      -Tried to find free 3rd party apps, and I couldn't find them. Which is fair, because they deserve money, but the whole reason I'm designing this site is so I don't have to spend money on sites like square space.

      -I looked in to coding, and it went way over my head.

      -Putting all the youtube videos on their own slowed the site down too much.

       

      I'm not afraid to learn! But after looking for hours I can't find any videos on this. Are there any tutorials out there that can help me get this effect? Is there something I've listed that I haven't thought of?

       

      I really would appreciate any help I can get!

       

      Thanks!

       

      -John

        • 1. Re: Options for a Video Gallery Not Using 3rd Party Widgets
          johns94424267 Level 1

          Is bumping a thing that is allowed on here? Sorry if it is not

          • 2. Re: Options for a Video Gallery Not Using 3rd Party Widgets
            Günter Heißenbüttel Adobe Community Professional

            Try this:

            • Place a light box composition widget.
            • Place your thumbnail images into the triggers.
            • Drag the lightbox out of your page to the left of the canvas
            • Style the light box as you like, make it as bid as you like and place a video widget into the lightbox
            1 person found this helpful
            • 3. Re: Options for a Video Gallery Not Using 3rd Party Widgets
              johns94424267 Level 1

              First off, I want to say I really appreciate your help.

               

              I have already attempted that unfortunately.

               

              One problem is that the thumbnails become distorted as the page gets sized down. The solution to that is to add more break points. But when a video reaches a break point, it also restarts the video.

               

              So that means when someone is viewing the site on mobile and decides to switch from portrait to landscape the video restarts or closes out. When someone gives your demo reel a maximum of 10 seconds to be engaged, this can be a huge killer for possible jobs.

               

              My solution to this is to limit my break points as much as possible, that way the page would never refresh on most devices.

               

              So that makes the light box method counterintutive until the composition widgets become completely responsive for height and width.

               

              So that's why I need another alternative if it exist.

               

              Once again, I really appreciate all the help. I love muse, so I really want to get this to work. So if you have another alternative I'm all ears.

              • 4. Re: Options for a Video Gallery Not Using 3rd Party Widgets
                Günter Heißenbüttel Adobe Community Professional

                Then you shouldn’t tell us, that you are looking for a solution, which „works exactly like this site": Videos — 2D TV, Series, Games, and Advertising Video Animation Studio Austin TX | Joe Rothenberg Animation

                The linked page doesn’t has neither full screen video and neither page nor videos are responsive. And: No breakpoints at all! You definitely can achieve this by using Muse.

                „Distorting trigger“ isn’t true as well. Did you try to place (not fill) a thumbnail image in exact the triggers size? In this case they don’t „distort“, but scale proportionally. Besides that, the thumbnail can be set to „Resize: None“.

                2 people found this helpful
                • 5. Re: Options for a Video Gallery Not Using 3rd Party Widgets
                  johns94424267 Level 1

                  I do appreciate the feedback on the way I communicated originally.

                   

                  I thought it was insinuated that I wanted to get it as close as possible within muses limitations. Clearly I was wrong. I apologize for that. Let me clarify now.

                   

                  My only goal is to have view able videos all on one page. With thumbnails that are responsive in both height and width. That way I can limit the amount of breakpoints used.

                   

                  if I just place all the videos, it takes forever to load the website. So I tried all the listed things above to get lightbox to work. However, there are not enough features on the current widgets. Which is fair, I can't expect the designers to make everything special for me.   I think most portfoilos are image based anyways, so my audience takes a lot less priority.

                   

                  So, with that in mind. I'm looking for an alternative to the light box, as it's just not a viable option without having the thumb nails size down proportionally with height and width, with no cropping or distortion of any kind. The video isn't the issue. The video opens up separately anyways, and the youtube and vimeo apps both have full screen options.

                   

                  I have used fill proportionally. This in turn crops the images, thus distorting the original design. Which is something I would guess most people do not want. Using no resize option makes it so I have to add too many break points Which is also counterintuitve to what I need from this site.

                   

                  I hope I clarified what I needed better. Once again, sorry for explaining it poorly the first time.