One of our customers "Nilaz" created a cool method to startup his home theater.  We are providing his How To here so others can also implement it.

Thank you Nilaz for your contributions!!

 

You can see some absolutely atrocious example videos of these at the following links. Be aware that even since I posted these videos I've changed things up a bit on my remotes. The transitions have remained but I got rid of that stupid honeycomb background graphic and switched to a more modern looking aesthetic, in most cases either straight up black backgrounds or on certain pages I'm using a nice 2 color gradient. I'm pointing this out because it helped in 2 ways. 1: It's easier on the eyes with higher contrast and overall just looks better, and 2: things actually load noticeably faster. Loading scenes are less jarring and the soft button pop-in is sped up/improved (or at least it feels faster).

Boot Sequence

Sources

Apps

For some people what follows is probably going to look a little intimidating, but that's just because I'm trying to be thorough. The transitions look cool but honestly it's mostly sleight of hand. It really wasn't difficult for me to implement this in myServer and myDesigner, though I suppose this could become at least a little complicated depending on how exactly you have your system and remote configured plus how comfortable you are working with myDesigner and myServer macros.

Preparation is key!

The first thing you're going to want to do is figure out what things you want to use these types of transitions for and measure the amount of time it takes to accomplish the task.

If you want an animation for a bootup sequence you'll want to measure how long it takes from the time you power on to when your system is ready for use. This was easy for me to accomplish because my system is configured in such a way that pressing the power button on the remote ALWAYS boots the system to my ShieldTV scene since that is what we are using the vast majority of the time. This is beneficial for me because the timing is consistent. For me this interval is almost exactly 15 seconds in my theater room, 7 seconds in my sunroom, and 9 seconds in my bedroom. Yours will likely be different depending on your equipment in use.

If you want transitions from source to source you're going to want to time the interval it takes for your system to switch to these sources. In my case these vary depending on the source so I had to plan accordingly. Likewise, you'll want to do the same if you use soft/hard button triggers to load apps, etc. Hopefully you get the idea here, but the point is that you need to know how much time you have to work with. There are practical reasons for this. If it takes 7 seconds to switch to your Apple TV no one is going to want to wait 30 seconds for your uber-intricate animation to finish playing on the remote before they can start doing their thing. Try to match the length or if that is not possible intentionally make your transition shorter than your load time.

On to the content!

The first thing you're going to need is your transition content. Once again you will want to be practical about this when it comes to length, and once again I suggest that you start  with a clip of roughly the same length as you want the transition to last, either from start to finish or maybe through some creative editing. I will caution you that the remote might choke up if your image content is extremely complicated with a lot of fast changing colors. I had a video that I was playing with for the Shield that changed a lot of colors at nearly seizure inducing warp speed and the remote presented the animation as a slideshow. You've been warned, but note that this was an extreme outlier.

Animated icon gifs and the like work well for this since they tend to loop seamlessly, full motion video clips can be somewhat more problematic but still doable in at least some cases. For example, my boot sequence timer is simply a countdown timer video I found through the Timerino Youtube channel and I trimmed it down to my required lengths. My Apple TV logo was simply an animated logo .gif I found through a Google images search. My bluray transition is a video that I chose because it was already close to the length I needed and was able to get it just right by trimming just a smidge off the beginning and end in a way that you would never even notice.

If you have a .gif file already you can skip to the next paragraph. If your content is an mp4, .mkv, or the like you're going to need to convert it into a .gif file. I use the Giphy website for this because 1: it's free, and 2: it has some basic editing/trimming tools that come in handy. You don't have to use this site and are of course free to use whatever site/software you prefer.

Now we're cooking with gas!

Once you have your new content in hand you're ready to roll. Copy your .gif's into the smartremote/images folder, or if you like to keep things tidy maybe put them in a separate subfolder.

In myDesigner create a new scene. I opted to name each one transition-xyz where xyz was the name of whatever scene/app (and sometimes room) I wanted the transition for so they are all conveniently grouped together in the Project Files list, but you are of course free to use whatever naming convention you prefer.

Once you have your scene add a new image component and use your .gif file as the image/server variable. Add whatever other elements to the page suit your fancy.

Boot Sequence Transitions:

For a boot sequence this might become a little complicated depending on how you have things configured. For my needs personally I find it easier and more intuitive to use separate poweron/off room macros. This works well for me because as previously stated I have three rooms configured with systems that I control and they all take slightly different amounts of time to boot up, but I know there are other ways to go about this so YMMV a bit here.

If you don't use discrete poweron/off macros you may need to experiment a bit to figure out the best way to trigger the transition scene using some If|IsEQ## command logic or similar. I'm not sure I can be much help with this specifically.

If you do use discrete poweron/off macros simply add a LoadScene|the-name-of-your-boot-sequence-transition and a Pause|the-amount-of-time-your-boot-sequence-takes near the bottom of the macro just before your regular LoadScene command.

For example, the last few lines of my poweron.theater macro look like:

LoadScene|transition-timer-theater!   
//!
Pause|14.5!                                        
//!
LoadScene|shieldtv-theater!              
// fini

App Transitions:

For apps you will likely need to create a new macro, and you will have to have your App soft/hard button in myDesigner call this macro. Add a Loadscene|the-name-of-your-app-transition,  then whatever command you need to launch your app, then a Pause|the-amount-of-time-your-transition-takes, then another LoadScene|the-name-of-your-current-scene to get back to your current scene, or alternatively to whatever remote page you want to load next (kodi.html, etc.)

For example, my Netflix transition macro looks like:

Macro|
LoadScene|transition-netflix!
//!
AV|6~Launch~com.netflix.ninja!       * This command is what launches Netflix on the Shield in my theater room. Yours will almost certainly be different.
//!
Pause|4!
//!
Loadscene|shieldtv-theater!
// fini

Source Transitions:

For sources, in myServer find whatever macro you want the transition to work with. For source devices this will typically be your activate-source macro. Near the bottom just before your final command (typically your LoadScene command) add another LoadScene|the-name-of-your-transition-scene, then add a Pause|the-amount-of-time-your-transition-takes between these two LoadScene commands.

For example, the last few lines of my activate-source.apple tv macro looks like:

LoadScene|transition-appletv-theater!
//!
Pause|5!
//!
LoadScene|appletv-theater!
// fini

Test and if all is well rejoice for thou art finished! Congrats on making it to the end!