Altering the Icon Art?

Special forum to share and discuss skins for Pano2VR and Object2VR
Post Reply
RLemen
Posts: 75
Joined: Tue Mar 13, 2018 10:22 am

Hello, I am still waiting to figure out how to get the wp/filezilla issue resolved, meantime more tweaking if possible.

Tweak 3. Is it possible to change the icon art, that is the node art, and the direction arrows, pano button, etc. say to hand drawn looking art, or customized shapes like if I had a soda shop photo could I use an ice cream soda as the node icon, a vector form so it has a visual distinction to the image space?

Or as an example, like playful arrows each a primary color for the move arrow icons if they were skinned over a kids play room sphere?
User avatar
Tony
Posts: 1341
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

HI,
Tweak 3. Is it possible to change the icon art
Do you mean change the icons in the supplied skins like the example below..

controls.jpg
controls.jpg (30.97 KiB) Viewed 5827 times

and in use https://s3-ap-southeast-2.amazonaws.com ... index.html

If so then all you have to do is create new .svg files and replace the ones currently in the default skins. When you save a default skin it will prompt you to give it a new name. You can also save the new elements as a component for easy reuse.

I just quickly drew these in Illustrator and saved them as SVG.

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: https://tonyredhead.com - https://redsquare.com | Pano2VR Tutorials: https://tonyredhead.com/pano2vr | instagram: https://www.instagram.com/tonyredhead/
RLemen
Posts: 75
Joined: Tue Mar 13, 2018 10:22 am

You can. Oh yes. Thank you Tony. This is fantastic to know.
RLemen
Posts: 75
Joined: Tue Mar 13, 2018 10:22 am

Tony,

Is it possible to replace the target icon for the Nodes? The white cross hair icon?

Thank you for the help.
RLemen
Posts: 75
Joined: Tue Mar 13, 2018 10:22 am

So if I am doing this correctly, I should be able to replace any icon, after which I assign it its action and any art should work for any button? Thank you again. If this is so, I have just fixed a big aesthetic issue.
User avatar
360Texas
Moderator
Posts: 3684
Joined: Sat Sep 09, 2006 6:06 pm
Location: Fort Worth, Texas USA
Contact:

As Tony mentioned

When you
save a default skin it will prompt you to give it a new name
. You can also save the new elements as a component for easy reuse

The default skin is still the default. I don't think you can over write it. However, you can always use your newly created skin
Dave
Pano2VR Forum Global Moderator
Image
Visit 360texas.com
User avatar
Tony
Posts: 1341
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Is it possible to replace the target icon for the Nodes? The white cross hair icon?
Yes, just select it and then in the SVG dropdown menu replace it with a new one that you have created.


hand-drawn-0.jpg
hand-drawn-0.jpg (845.4 KiB) Viewed 5807 times

cheers,

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: https://tonyredhead.com - https://redsquare.com | Pano2VR Tutorials: https://tonyredhead.com/pano2vr | instagram: https://www.instagram.com/tonyredhead/
CLeary
Posts: 16
Joined: Tue Jan 30, 2018 12:05 pm

I want to start to customize one of the default skins included with pano2vr. I've replaced the default svg image for the ht_node_image with one of my own (svg image) but it doesn't appear when I publish the tour (yes, I've saved it as a user defined skin) - can't figure out what I'm doing wrong. According to the directions in this thread its a seemingly a simple procedure.
User avatar
Tony
Posts: 1341
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Hi,

If you just load the svg rather than replacing an existing one does the svg appear in the skin? I'm wondering if there is an issue with the svg itself. Can you post a link to the svg or add it to a post.

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: https://tonyredhead.com - https://redsquare.com | Pano2VR Tutorials: https://tonyredhead.com/pano2vr | instagram: https://www.instagram.com/tonyredhead/
CLeary
Posts: 16
Joined: Tue Jan 30, 2018 12:05 pm

Thanks for your prompt reply Tony. You were right, it was the file. I was trying to take a business logo in a png file format and then convert to svg with photoshop. The skin editor works fine with replacing with other standard svg files but not with ones converted from other file formats.
User avatar
Hopki
Gnome
Posts: 13004
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi Guys,
Just as a bit of info, you would use an SVG as this looks good in Hi DPI screens, but what you can do is use a PNG file as well and still make it look good too.
How:
If you have a button that will be 32 x 32px, then make the PNG 64 x 64px.
Add to the skin editor then click the Reset Size /2 button.
This will make it now appear 32 x 32px in the skin and will be displayed this size in the output.
However when opened on a Hi DPI display, which is normally just double density, you will have all 64 x 64px to use.
The end result is the image will still look good.
The only negatives are larger file size but ever so slightly.
Of course if you can use SVG then this is the best option but most only have Photoshop and can create PNGs.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
Danny
Posts: 19
Joined: Fri Nov 13, 2020 8:44 pm

Great that we can use .png instead on .svg's
But how do we add them to the skin editor? I realise this is probably very straight forward question but I just cant see how..
User avatar
Hopki
Gnome
Posts: 13004
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi,
If replacing an SVG with a PNG you can not use the Replace button, as you can only replace images of the same type, SVG to SVG.

Follow these steps to replace an SVG with a PNG.

Depending on the size you want the PNG you would make them double the size, so, for example, 64px X 64px, so it would be 32px in the output.
Add it to the skin either as an image or button.

1.png
1.png (17.61 KiB) Viewed 4026 times

Or just drag it into the canvas of the skin to be added as an image.
Note: Images have a Convert to button, button if you need it.

The difference is a button will let you add an over and select state, an image does not.
It will be 64px in the skin, select the image's properties and select the Resize /2 button to make it 32px.

Now it's in the skin, go to the Tree, drag the image to just above the SVG in the skin, so it's the same level as the SVG.

2.png
2.png (26.5 KiB) Viewed 4026 times

In the above screenshot, you can see the SVG is anchored in the top left and is position 0/0.
The new image is also anchored top left, but it is currently positioned -110/-267px.
This needs to be changed to 0/0 the same as the SVG.

Now, copy the actions from the SVG to the PNG.
Once done, you can hide the SVG in the skin by deselecting visible, test to see if all is ok then when you are happy, open the skin and delete the SVG as it's no longer needed.
Regards,
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
Danny
Posts: 19
Joined: Fri Nov 13, 2020 8:44 pm

Fantastic - thanks
Post Reply