Ux Architect, post bugs/questions here Options

[xomp]

Okay, this is hard for me to explain but here goes..

I have a background picture with a moon in it, I would like for the "Game Icon" to show up in this moon as a circular (exactly like the moon if at all possible) instead of being a big dumb square, is there anyway of doing this? I have tried fiddling with it for hours last night and couldn't figure out a way Any insight would be most appreciative

[jonathan2007]

Yeah there is but it is complicated. You need to make transparent square that is a little bit bigger than the area for the moon. The copy the outside of the moon and paste it onto the transparent square. You should then have the moon on the outside and the inside should be a transparent circle. You can use the circle marque tool to crop the inside of the moon. Then in UXA tell it to insert an image and put this transparent pic over the moon. Then look at it on your box and make sure the moon lines up alright. Then put the game icon over the transparent pic. This should then allow the icon to be seen but only on the inside of the moon circle. Sorry if this all sounds pretty complicated. It took me along time when I first tried it and it never did work very well. You could always see the outside of the transparent pic even if it was lined up perfectly. I don't know maybe I should try it again when I get some more time. I believe someone posted a long time ago bout doing this all and that is how I learned. You might be able to find it if you search. If you need more help let me know.

[xomp]

Yeah there is but it is complicated. You need to make transparent square that is a little bit bigger than the area for the moon. The copy the outside of the moon and paste it onto the transparent square. You should then have the moon on the outside and the inside should be a transparent circle. You can use the circle marque tool to crop the inside of the moon. Then in UXA tell it to insert an image and put this transparent pic over the moon. Then look at it on your box and make sure the moon lines up alright. Then put the game icon over the transparent pic. This should then allow the icon to be seen but only on the inside of the moon circle. Sorry if this all sounds pretty complicated. It took me along time when I first tried it and it never did work very well. You could always see the outside of the transparent pic even if it was lined up perfectly. I don't know maybe I should try it again when I get some more time. I believe someone posted a long time ago bout doing this all and that is how I learned. You might be able to find it if you search. If you need more help let me know. 

Wow, heh thanks for the reply back. However I'm unable to follow this mainly because of your English heh no offense but I'm somewhat fluent with Photoshop and trying to follow along to what you are saying is very hard to do

[jonathan2007]

Ok open the background pic that contains the moon in it. Hit control A to select everything. Then hit control C to copy it. Then start a project and tell it size from clipboard which it probably picks up automatically (meaning it will default to clipboard if you have an image copied). Then make sure that the Background Contents is set to transparent. That is the most important step. Then say ok and then do a control V to paste the other picture. Ok now use the eliptical marque to highlight the region of the moon you want (you are going to delete the inside of the pic so just highlight right outside of wherever you want the game icon to go). Then first goto image and crop then while the area is still selected hit delete. So now you should have a relatively small square with a transparent circle in the middle and the moon on the outside parts. Then save this a picture file and then open up UXA. First put in the game icon. Make sure you do this first because you are then going to cover that up with your other image. Also make sure the icon is big enough to fill the entire circle you made in the other image. Tell it you want to use an image overlay. Then line this up with the background picture so it is to your satisfaction (it helps uploading it to your xbox and looking at it on your tv too as sometimes things look diff on your tv). You should then have a circular game icon. Sorry for the explanation earlier. I didn't explain it that well. Post if you need more help.

[neverwill]

O.k, first....

1. With your main picture of the moon use the rectangular marquee tool and select a sqare that includes the moon and some area around it (above below side to side). Copy and paste this and put it behind the main moon picture (in the layer selection).

(Note photoshop should probably have pasted it in the exact same place it was copied from so you shouldnt need to move it.

2. On your main moon picture use the "magic wand" tool , (with a tollerance setting at prob like 15 or so) and select the moon while holding down the "shift" key so that you can select all of it, once you have done this press "delete" on your keyboard.

(Note your picture should look no different because of the piece we copied and pasted from step one).

3. Now, you are going to need to save two layers. Make it so that you can only see the moon pic in the background that we copied and pasted. (to turn off layers click on the eye beside the layer you want to turn off, same thing to turn it back on)

Save it as background.png or something. Has to be .png though, not jpeg or something.

4 Now save you're main moon pic. (turn on the main moon layer and turn off the copied and pasted pic layer). Save as moonoverlay.png or something like that.

5. Now in UXArchitect place the background.png down first, then put down the icon over top of the moon so that it covers all the moon.

6. Now insert moonoverlay.png over top of that, the icon will now appear in the moon when something is selected, and if there is no icon , all you will see is the moon.

Here's some pics:



This post has been edited by neverwill: Jan 26 2005, 07:40 AM

[xomp]

O.k, first....

1. With your main picture of the moon use the rectangular marquee tool and select a sqare that includes the moon and some area around it (above below side to side). Copy and paste this and put it behind the main moon picture (in the layer selection).

(Note photoshop should probably have pasted it in the exact same place it was copied from so you shouldnt need to move it.

2. On your main moon picture use the "magic wand" tool , (with a tollerance setting at prob like 15 or so) and select the moon while holding down the "shift" key so that you can select all of it, once you have done this press "delete" on your keyboard.

(Note your picture should look no different because of the piece we copied and pasted from step one).

3. Now, you are going to need to save two layers. Make it so that you can only see the moon pic in the background that we copied and pasted. (to turn off layers click on the eye beside the layer you want to turn off, same thing to turn it back on)

Save it as background.png or something. Has to be .png though, not jpeg or something.

4 Now save you're main moon pic. (turn on the main moon layer and turn off the copied and pasted pic layer). Save as moonoverlay.png or something like that.

5. Now in UXArchitect place the background.png down first, then put down the icon over top of the moon so that it covers all the moon.

6. Now insert moonoverlay.png over top of that, the icon will now appear in the moon when something is selected, and if there is no icon , all you will see is the moon.

Here's some pics:

VERY impressive!! Thanks for the screenshots

[xomp]

VERY impressive!! Thanks for the screenshots

Okay, I followed this verbatim but it doesn't seem to work for some reason. When I go to the "Games" section of my dash it shows the icons as square still. In UXA I put the background.png in, placed the game icon over top the moon and went back and told UXA to use moonoverlay.png as a background then saved it as a zip, uploaded to the xbox and when I load the skin itself it's not working The steps you both gave for Photoshop are very easy to understand, but I think the problem lies with UXA for me

[jonathan2007]

Hmm well first of all how did that magic wand work for you. I have a pic I am trying and I can't seem to get the whole circle highlighted and yes I know that you can add more parts using shift but that takes a while and still doesn't give you the whole circle. And to answer your question I believe that you might need to manually edit the skin.xml xomp. I think whichever comes first in the skin.xml is what will be displayed first and whatever is last in the xml file then it comes last. So you want the moon overlay to come last. So check you skin.xml file using notepad and see which comes first and reorganize em if you have to.

P.S. Thanks neverwill for the screens and could you give a few more tips about the magic wand. The pic for the skin I have been trying to make for ages know doesn't seem to want to select the whole circle area. Could it be because it is 2 diff colors. I could send the file to you if you were interested and you could try it? Only if your interested.

[neverwill]

Okay, I followed this verbatim but it doesn't seem to work for some reason. When I go to the "Games" section of my dash it shows the icons as square still. In UXA I put the background.png in, placed the game icon over top the moon and went back and told UXA to use moonoverlay.png as a background then saved it as a zip, uploaded to the xbox and when I load the skin itself it's not working The steps you both gave for Photoshop are very easy to understand, but I think the problem lies with UXA for me

K, your problem is this-

DO:set background.png as THE BACKGROUND
DO:put the icon over top of the moon
DO:lay down moonoverlay.png on top of it
DO NOT: set moonoverlay.png as the background (which is what you did and this is why you are having the prob )

so in order it goes:

1.background.png (set as background) (in the pics I made it corresponds to #2)
2.game icon (from UXArchitect)
3.moonoverlay.png (in the pics I made it corresponds to #3)

Good luck man, after you fix this it should work.

This post has been edited by neverwill: Jan 28 2005, 02:09 AM

[xomp]

K, your problem is this-

DO:set background.png as THE BACKGROUND
DO:put the icon over top of the moon
DO:lay down moonoverlay.png on top of it
DO NOT: set moonoverlay.png as the background (which is what you did and this is why you are having the prob  )

so in order it goes:

1.background.png (set as background)  (in the pics I made it corresponds to #2)
2.game icon (from UXArchitect)
3.moonoverlay.png (in the pics I made it corresponds to #3)

Good luck man, after you fix this it should work.

Great!, just one last (hopefully last) question heh.. How do I "lay down moonoverlay.png on top of it" ? I am unable to figure this out in UXArchitect
Thanks for your patience

[jonathan2007]

Great!, just one last (hopefully last) question heh.. How do I "lay down moonoverlay.png on top of it" ? I am unable to figure this out in UXArchitect
Thanks for your patience

Go to the layers tab and hit the little folder icon under the Images Section. You should then be able to browse to your overlay image and then hit open and it will insert it.

[xomp]

Go to the layers tab and hit the little folder icon under the Images Section. You should then be able to browse to your overlay image and then hit open and it will insert it. 

I don't seem to have a folder icon anywere in my Layers tab Infact, there's nothing but the "Game Icon" under the Layers tab and I can do nothing to it via this tab, no right-click submenu or anything I think my version of UXA is old? I'm using UXArchitect_1[1].0d.rar

[neverwill]

I don't seem to have a folder icon anywere in my Layers tab Infact, there's nothing but the "Game Icon" under the Layers tab and I can do nothing to it via this tab, no right-click submenu or anything I think my version of UXA is old? I'm using UXArchitect_1[1].0d.rar 

The version of UXArchitect I have is 1.0b.

Anyway, to insert the moonoverlay.png

(jonathan2007 had it right, he just told you the wrong tab to look under )

1. Click on the "Visual" tab in UXArchitect
2. Under the "Images" section click on the folder with the magnify glass to open your image (moonoverlay.png).
3. If for some reason moonoverlay.png gets hidden in the layers, right click on it and select "bring to front".

Now you should be rockin. Good luck.


This post has been edited by neverwill: Jan 28 2005, 09:51 AM

[xomp]

The version of UXArchitect I have is 1.0b.

Anyway, to insert the moonoverlay.png

(jonathan2007 had it right, he just told you the wrong tab to look under  )

1. Click on the "Visual" tab in UXArchitect 
2. Under the "Images" section click on the folder with the magnify glass to open your image (moonoverlay.png).
3. If for some reason moonoverlay.png gets hidden in the layers, right click on it and select "bring to front".

Now you should be rockin. Good luck.
 

That did it! Got it to work finally, I appreciate both of you for helping me through this heh, for some reason when I put the overlay (the copy of the moon and outside edges) ontop of the background, positioning is rather odd, it appears as they are lined up but there is a visable edge around the overlay picture that I cannot get to blend with the background, I've checked the alignments and they are spot on but can't seem to beat this edge effect with the overlay. Think I'll try to use the rectangle marquee tool with a sligh feathering to see if it defeats it. Thanks so much guys, I really appreciate the help.

[jonathan2007]

That did it! Got it to work finally, I appreciate both of you for helping me through this heh, for some reason when I put the overlay (the copy of the moon and outside edges) ontop of the background, positioning is rather odd, it appears as they are lined up but there is a visable edge around the overlay picture that I cannot get to blend with the background, I've checked the alignments and they are spot on but can't seem to beat this edge effect with the overlay. Think I'll try to use the rectangle marquee tool with a sligh feathering to see if it defeats it. Thanks so much guys, I really appreciate the help.

No problem and sorry about the wrong tab. Let me know how you turn out with the feathering thing because I tried this once with an overlay and the same thing happend to me. I had a black background in the area so all of it should have shown up black but it did not. You could see the edge just like you mentioned. Anywho let me know if you get it working.