Will this would definitely be of interest - I’ll pm you and please give me a quote. If it gets my client what they want in a reusable format we can sort out some cash.
What I did in iMovie was do a short video (0:04 seconds) of the .png on the white background, exported a still from that .mp4 and then used the still as the BG of the video. You just need to use picture-in-picture. I think if you Google or YouTube it, you can find some easy tutorials.
@manofdogz any idea what size (pixels) you will need to vids to display at (max size)? If taking the iMovie route that would be the first step. Next step would be creating the iMac frame image to meet those specs. Then the iMovie export at those specs. Below I’ve included a link to a quick screen capture that shows how to avoid those “borders” you mentioned, and a 960px x 540px iMac frame image (this size matches one of iMovie’s standard export ratios). Note I didn’t pay too much attention to the quality of the iMac frame image/resolution etc., but all of that can be quickly sorted (happy to help if needed). Perhaps Will’s efforts will yield an even better solution.
16:9 aspect ratio PNG file
Screen capture of imovie
https://drive.google.com/open?id=173tSo2tdfFal4KF8I25AwEMRenxlKpf-
1 Like
Thanks for all the input. @willwood has sorted this nicely with some custom code and it works really well - perhaps he’ll make a stack out of it? Video controls can be easily added - they may or not be there depending what the client wants. To autoplay on iOS, attributes of playsinline and mute must be added
You can see the results on the test rebuild site here: https://kikkdevelopment.co.uk/innova
5 Likes
Awesome! Looks great 
1 Like
Wills the man!
2 Likes
Glad to see and hear this is working well.
Now a question to the wider weaver community: would you like to see a new stack made from this same concept, so that you could accomplish something similar, but without needing to edit any code?
I’ve had the idea of making a stack like this. As @TINO correctly says, I already have the Showcase Ultra stack available, but this mostly only does slideshows.
I’m wondering whether a new stack that lets you place either a static image or HTML5 video within a frame, like @manofdogz got working, would be of interest to anyone?
There could perhaps be an option to toggle between using either your own warehoused image as the frame, or one of these impressive pure CSS devices:
A pure CSS device would ultimately mean the “frame” for the image or video would be near-enough zero KBs. So much smaller than a comparable PNG image. Super-fast to load and no fuzziness on retina displays.
Just putting the idea out here, to see if there’s any consensus for a new stack that can do this sort of thing.
Any constructive feedback is welcomed! 
8 Likes
@willwood while I don’t have an immediate need for such a stack, I could see myself buying and using such a stack if available.
In my opinion a stack that would allow one to easily display video (and other content) within various types of frames would be of good value. So I would be a yes on interest.
I would buy it. I can use it for my references of the sites I built…
I would definitely buy it. Whilst the css devices page looks excellent, I think the toggle option would perhaps be key - the ability to use any frame and not just a pre-supplied selection in one would allow the stack to be used in a wider variety of situations and thus hopefully appeal to a wider audience.
1 Like
I’ll buy as soon as it comes out. Great look, I think, to add some engagement for instructional videos/content in online classes.
Work has progressed well on this new stack. Here is a quick video (no audio) showing some of its capabilities:
Click through to view a larger version of the video on the YouTube website.
It has about 30 preset backdrop images you can choose from, or you can load-in your own custom images. Then use drag handles to resize the content to fit your backdrop.
Fully responsive. Retina display optimised. No messy code or configuration. Valid HTML markup. Accessibility compliant.
Within the backdrop, support currently exists for various content types including HTML5 video, YouTube, Vimeo, iFrames, Stacks or custom images. Thereby you can “frame” almost any basic content type.
If you are interested in Beta testing a copy, please contact me. I’ve also shared a link on the Discord live chat, limited to 7 days and 20 downloads.
7 Likes
Looking great Will. I’ll be getting a copy for sure.
1 Like
Me too
1 Like
looks great
1 Like
Looks great. Feature set looks awesome. Plus one on a purchase.
1 Like
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.