What's new
By:
Photoshop Gurus Forum

Welcome to Photoshop Gurus forum. Register a free account today to become a member! It's completely free. Once signed in, you'll enjoy an ad-free experience and be able to participate on this site by adding your own topics and posts, as well as connect with other members through your own private inbox!

Ring Mask Rotation


L

LMABit

Member
Messages
11
Likes
0
Hey guys, I was wondering if anyone knows how to create a ring that reveals based on angle rotation. Imagine a rotating knob that has a ring around and acts as a meter to show the current dial volume level. What would be the proper easy way? I guess that would only be possible in AE, right?
 
Last edited:
It's still not that clear... You talked about "individual frames for a filmstrip"... You could probably build something fast in PS and save frames from there... but it's wwaaaaayyyyy easier to achieve in after effects. Then, if you actually need it to be interactive... I'm just not sure I understand how it's gonna be used...
 
jkemp said:
It's still not that clear... You talked about "individual frames for a filmstrip"... You could probably build something fast in PS and save frames from there... but it's wwaaaaayyyyy easier to achieve in after effects. Then, if you actually need it to be interactive... I'm just not sure I understand how it's gonna be used...
Click to expand...
Well, it's not that difficult. I will have to create frames like you would need for a gif. Instead I will have to stitch the frames myself because its how it works for UI design when you cannot code it. Some coders use individual images but sometimes you are forced to have strips. I mostly do audio plugins and I wanted to know if I could do that in Photoshop so I can avoid going to AE just for that. If I have no other choice that's what I will do.
 
Also, It doesn't matter really how I have to save each frame. You can do that animation in PS or you can't. So the question was if there was a way to achieve that in PS. You, for instance, create a ring with some layer style then try to make it grow around a circle from left to right. It would be like a self-drawing line following a path or a ring that has an angle mask. That is easily achieved with some other software but the point was working in PS.
 
Sorry to say this is not how PS works. Someone might come with an idea of how to do it... but I'd say if you have access to AE, and know how to do it in AE... then just do it. It's a fairly easy thing to do...
 
That's one pretty cool way to do it.... Could also be a layer on top which you rotate the same way... As long as you can put the anchor point right in the middle, you'd be able to work it out.

Won't be animated though... That's why I'd say AE is better suited for the job...
 
jkemp said:
Sorry to say this is not how PS works. Someone might come with an idea of how to do it... but I'd say if you have access to AE, and know how to do it in AE... then just do it. It's a fairly easy thing to do...
Click to expand...

I know how PS works and I know its limitations I just wanted to know if I was missing anything.
 
hawkeye said:
Would a knockout layer help?
Click to expand...

No, it won't as it doesn't let you reveal the masked ring from let's say -120 to 120 degrees. I got a few options to achieve this so yeah as I said I was just wondering if PS would have something I didn't know.

Ring_Animation.gif
 
You can animate just about anything in Ps. The problem is the interactive component.

LMABit said:
....Imagine a rotating knob that has a ring around and acts as a meter to show the current dial volume level.........create a ring with some layer style then try to make it grow around a circle from left to right. It would be like a self-drawing line following a path or a ring that has an angle mask.
Click to expand...
In answer to your question............I think I can create something that will work similar to your animation above. It will only be animated in frames. It will be background color dependent so it will have to be altered to different colored backgrounds. I do have to go to work for now, so it will be later before I can work on it.

My idea will work on the same principle that I used here:
LeafVac_02.gif

The leaves aren't going anywhere, they are just being covered by a white moving mask. The same principle can be used for a dial going forwards and backwards revealing and covering a scaled ring.

Screen Shot 2019-08-03 at 8.37.34 AM.png

Let me know if this sounds feasible to your needs.
 
IamSam said:
Let me know if this sounds feasible to your needs.
Click to expand...

Hi Sam. Thanks for offering a possible solution. I think the problem here is that a circle will always make a mask intersect the starting point. Doing a mask for a straight line is easy to do. I think unless you could animate individual vertices of a shape, it would be impossible. Another way would be using some kind of stroke along a path with animation. That would only serve as a kind of mask if you use the background color. In the GIF I posted the background is white but sometimes that is not the case and the BG would be more complex than a single flat color.
 
jkemp said:
Out of curiosity... why are you so eager not to use AE ?
Click to expand...

Who said I don't use AE? I've been making it clear I just wanted to know if there was something I was missing for the sake of learning. I can also do that kind of stuff in another application I use from time to time. I actually just did what I needed in AE including some recreated parts of the knob that needed to rotate as well.
 
Dude, don't get mad. :D I'm really just curious...

I did get that you knew it could be done in AE... and it felt like you actually had access to AE... so... you have the right software, with the right knowledge... but you're looking for some other way to do it. I was curious about what's your motivation.

Genuine curiosity... I'm not just trying to be an ass and piss you off.... :D
 
jkemp said:
Dude, don't get mad. :D I'm really just curious...

I did get that you knew it could be done in AE... and it felt like you actually had access to AE... so... you have the right software, with the right knowledge... but you're looking for some other way to do it. I was curious about what's your motivation.

Genuine curiosity... I'm not just trying to be an ass and piss you off.... :D
Click to expand...
No worries I am not mad at all. I just thought I was clear I knew it could be done in AE but I was just looking for something in PS as I create the UI 2D elements in PS and as you might know, working in the same application for everything would always be easier if it has a proper way to do it obviously. I see now there is no way to do that so I think we conclude here. :)
 
@LMABit - In playing around with the idea that I had, (as you stated) the end of a rotating (circular) mask always intersects with the starting point unless you lesson the degree of rotation. I felt that I could employ some clever masking to alleviate the issue but I could not. This is an easy fix for animating a GIF, but it's impractical for your needs.
 
Back
Top