Hey folks. Sorry for all the posts. Combination of WAY too much caffeine and WAY too much procrastination. Anyways, I have what I think is a new technique for layout creation. I think it is new because a) I have never seen it on a file I have downloaded, b) I haven't heard it discussed and c) I don't have access to all of the official developer goodies as I am not a CI. That being said, I am including the text for my latest tutorial here. Is this something that everyone knows about and I have just missed in my relatively short time with working with this type of remote or have I stumbled on something no one really does? If no one does this, why? Below is the text and you can download the proof of concept file at my site. Here is a link:
[Link: mx-3000.com]
Just click on the "Lazy Photoshop" link. Below is the text of the tutorial (which can also be found in the tutorials section of my site). I would love some feedback

regards,
-aedile-

Lazy Photoshop Layouts

While I love the complete control suite editor, as a photoshop aficionado, I have always felt a little bit limited by the layout tools that they give. It doesn't allow for visible gridding, you are limited to a small subset of fonts. Also, it doesn't allow for any graphical tweaking (even something as simple as resizing an element takes way too much effort). That being said, I have come up with a new method of making layouts much more simply using photoshop (or other graphics software of your choice). (Note: I say "I have developed..". I say this because I have never come across a template using this method before)

To begin, open up a 320x240 photoshop document. Now, design away! I know, that is glossing over a really important step, but that isn't what this tutorial is about. This is about saving yourself time and energy after you have designed a layout. The important thing is that you remember, you aren't doing a normal template design. Here you are designing a single page layout. Along with all of the layout elements you need for that page. When you are done, you should have a "mockup" of what the page would look like. Now we will export that file as a usable graphic file (jpg is my format of choice as, in photoshop, you can tweak file size).

Now, open up the mx-3000 IDE. Create a new page and then add a new button. Now import the image file you just created onto the button. Great! You say. That's what I want! Now let me just go back to photoshop and start slicing it up and...... Not so fast there slugger!! Why go back to photoshop at all when we have our wonderful friend, the invisible button?

The next step in my method is where the magic happens. In the example file listed above, I have a transport (the thingy with play, pause, stop, etc) and some of the standard SciAtlantic PVR buttons. Rather than going in to photoshop and slicing out each individual element I am just going to add buttons that are invisible and overlay them on my already existing layout. To do this, for example, with the play button, I would first right click and add a button. Then, I would go down to the button color section and set the button to hidden. Next I would pull it over to the play button and then adjust the button size to cover the underlying play button. Repeat ad nauseum until the whole layout is covered, as necessary, by the invisible buttons.

Why do things this way? Three reasons. First, as I mentioned, photoshop offers more tools than the IDE to make layouts. Second, as I mentioned, it saves you having to slice out individual elements. Third, and finally, it allows you to do some stuff that is wicked hard when using a traditional, elements-based layout. Take a look at the example file included with this tutorial. To the left are 4 buttons that are triangular and put right next to each other to form a square. When you make a regular triangle element, it still imports to a square-shaped object. Were I to try to slice those up, I would get four square-shaped objects. Then putting them together would be a nightmare as there would be overlay and such. To slice it out properly, I would end up having to make eleven slices. Ouch.

Are there disadvantages? Sure. First, it wreaks havoc on filesize. In a normal file, you have maybe one or two backgrounds. More for something complex, but still never too many. The cool thing is, every time you use that background on a different page, it refers back to the first instance, which saves a lot of memory. In this method, you have to have a lot of 320x240 images, none of which can use the aforementioned feature, so the filesize gets large a lot more quickly than with a traditional layout method (which is why I mentioned filesize tweaking earlier). Additionally, if you see something that is a little bit off in your layout, it requires reopening the file in photoshop, tweaking it there, and then re-exporting. This can actually eradicate any timesaving if you are an incessant tweaker. That being said, make sure you save your original layer-based psd file from photoshop as editing a jpg or gif is a nightmare in complex stuff.

Still, despite the few disadvantages, I have found that designing my latest template has gone more than twice as fast as normal, as I am not relying on the layout tools of the mx-3000 IDE at all.

Perhaps the biggest disadvantage to this method is that it's out of reach to anyone who is not adept with an image editing program of some kind. It's also a "take it or leave it" method for anyone you share a file with. If they don't have your graphics source files and have the skill to edit them, they are limited to adapting their gear to fit your layout, as opposed to creating a layout for their own gear.

I personally always put "after" image states on all my buttons. Some people care about this, and others don't. For me, this method would never work because I can't put After image states on the buttons without going back to the "square one" you're trying to avoid by using a background as your button image.

However, this is just my two cents worth. I'm certainly not suggesting that the method is not valid. In fact, I'm fairly sure that some of the contest entries in the MX-3000 contest a few years ago used this method at least partially.

I am new to the MX-3000, but I have experience in both technology and programming. I would like to see some of the "graphics" designs that folks have done - you refer to a contest a few years ago and wonder if anything was published.

I have two ideas for a graphics theme. The first is somewhat obvious - a standard theater margquee with the surrounding blinking lights and a grid for the movie titles (but in this case devices). Each page could then continue the marquee theme with various movie theater subjects.

The second is a Diner theme - maybe a jukebox titles panel for the devices and the Bubble glass or spinning records for animation. The pages could then also be headed up with title stips and other graphics.

Where can I find some examples of the WOW factor all of you guys are talking about?

Go here:
[Link: remotecentral.com]

I agree with Darnitol as far as the "after" state goes. It's a small thing, but really adds a nice subtle touch to any program design.

Meh. Not gonna download every single file to see if anyone has done it before.

Good point on the after state Darnitol. As to the unfamiliarity with photoshop, well, if you are designing your own layouts you should be using photoshop or something analogous.

I can't help but notice the last two custom layouts i have done have gone REALLY fast with this method. However, the part that hit home the most was with the sharing. I have several layout schemes that I have been working on broadening with enough standard components to be worth a share and the above method really isn't conducive to that.

Still, if you have photoshop experience and are in a hurry, I suggest you try this out once or twice to see if it fits.

Regards,
-aedile-

Again, just my two cents:

If someone's actually in a hurry, they're more likely to build from a template than from Photoshop. The time saved by using prebuilt buttons, for most people, is greater than the time saved by being able to change graphics and then tweak invisible buttons to match the graphical changes.

There's no doubt that this method makes it faster to create a new graphical concept from scratch, but I feel like it's far slower than building a new setup from an existing template.

Best regards,
Dale

There are many versions of photoshop, including a free photo file manager which doesn't even support graphics development. Which version are you using ?

I use CS2. Really, photoshop doesn't matter. It's more a graphics tool you are comfortable with. I happen to do a lot of web-design and the de-facto standard in web-design is photoshop CS2 since about 6 months after it came out (lately more folks have been switching to CS3, though, wouldn't be suprised if that's what ends up as the standard until CS4).

The same techniques, however, could be used with fireworks, GIMP, etc. The important part is that your tool allows for layer-based files as that is what makes it easy to move things about.

Regards,
-aedile-

I have downloaded a few templates today, and I can see how each one works my looking at the macro steps.

Since each step uses both graphics and sounds, I wanted to be able to copy some of them to my program folders for use later.

I don't see how to copy a graphic image or wav file to my samples folder. How can I get them out of the .rcc file?