Skin Feature request

[rika]

Steven
If we could ad angle and fade for covers and categorys the skins would have cool new possibilities .
Here are some mockup screen form my new weather skin showing what i would like to do. (Big weather png:s running as backgrounds)

4:3 Menu





Colby wrote:

Yeah if we are going to copy Itunes, lets do it better.

For cover flow, I totaly agree
why not a "Domino cover wall" ??



Last screen is skined in 1366x768 wide, fullscreen HERE

Edit:
What i like the effect to be is a "reversed" domino toppling effect. The covers zoom out when focused.
Is this doable if we have the tilt, angle and fade effects?
I know it´s been said that this might be a later feature but i just want to know if it´s worth skining ahead

Rika

[Colby]

Rika nice skin; are you still using fireworks? or Photoshop? Do you chat on any client, we should get together you bring up some intersting ideas.

[rika]

Thanks!
I use Fireworks. Never got around P.S that well. No chat right now...

Rika

[defrag]

Hey Rika, that looks awesome - love the backgrounds and 1366x768 is a great size to skin to. There is already a fade for the scrolling category that Steven uses in his menu in the last (free) xlobby, I use it for my skin (old shot but still in use) ...

but I agree, adding angles, especially 3D would be really cool

[scobob]

I thought you might find this script useful. I see you are using Fireworks to mock your layouts. I have been doing the same but ran into a problem of exporting the individual elements. I could Export by Layers but that really wasn't much help and slices just don't work in this situation. The script below will export all visible elements in your PNG layout (hidden are skipped) to their own file, cropped to size, alpha channel intact, and the filename will match the element name you gave it in FW. You may know of a way to do this but I couldn't find it. I am also working on another script to export selected so if you tweak one or 2 elements you don't have to export all.

Copy this code to a file named 'Export Elements to PNG.jsf' (or whatever you like but must have the .jsf extension). Save the file to a folder called 'Export' under the installation folder for Fireworks. Like this:
C:\Program Files\Macromedia\Fireworks 8\Configuration\Commands\Export\Export Elements to PNG.jsf

Code: Select all

function exportAllElementsToPNG(){
   var dom = fw.getDocumentDOM();
   var filepath = fw.browseForFileURL("save");
   if (filepath == null) return false;
   var defaultname = Files.getFilename(filepath);
   filepath = Files.getDirectory(filepath);
   var elems = new Array().concat(fw.selection);
   dom.selectNone();
   
   dom.setDocumentCanvasColor("#ffffff00");
   var sXO = dom.exportOptions;
   var oldcrop = sXO.crop;
   sXO.crop = true;
   sXO.ditherMode="none";
   sXO.ditherPercent=100;
   sXO.exportFormat="PNG";
   sXO.colorMode = "32 bit";
   sXO.optimized = true;
   sXO.paletteTransparencyType="rgba";
 
   var f = dom.currentFrameNum;
   var n = dom.layers.length;
   var i, j, m, elem;
   
   var visArr = new Array();
   
   for (i=0; i<n; i++){
      if (dom.layers[i].layerType == "web" || dom.layers[i].frames[f].visible == false) continue;
      m = dom.layers[i].frames[f].elements.length;
      for (j=0; j<m; j++){
         elem = dom.layers[i].frames[f].elements[j];
         if (elem.visible) {
            elem.visible = false;
            visArr.push(elem);
         }else{
            visArr["_"+i+"_"+j] = true;
         }
      }
   }
   
   var rect, name, filename, counter = 1;
   for (i=0; i<n; i++){
      if (dom.layers[i].layerType == "web" || dom.layers[i].frames[f].visible == false) continue;
      m = dom.layers[i].frames[f].elements.length;
      for (j=0; j<m; j++){
         if (visArr["_"+i+"_"+j]) continue;
         elem = dom.layers[i].frames[f].elements[j];
         rect = elem.pixelRect;
         elem.visible = true;
         name = elem.name;
         if (name == null) name = defaultname + counter++;
         filename = filepath + "/" + name + ".png";
         sXO.cropLeft = rect.left;
         sXO.cropRight = rect.right;
         sXO.cropTop = rect.top;
         sXO.cropBottom = rect.bottom;
         fw.exportDocumentAs(dom, filename, sXO);
         elem.visible = false;
      }
   }
   
   i = visArr.length;
   while (i--) visArr[i].visible = true;
   
   sXO.crop = oldcrop;
   dom.lastExportDirectory = filepath;
   fw.selection = elems;
   return true;
}
exportAllElementsToPNG();

It's works slick and saves a ton of time. I'm going to post complete instructions in the Tips and Tricks area if you need them.

Hope you find it useful.

[rika]

Big Thanks!
This is for sure going to be useful!!

Rika