How can I make a gradient across stroke in a 3D Text Circle/Ring?

Question

Level 4

1,296 points

How can I make a gradient across stroke in a 3D Text Circle/Ring?

Hi, I need some directions for the best way to get a gradient 'across' stroke with a 3D ring shaped 3D text object.

The image attached is from a replicator - this is how i would usually get this look for a flat graphic. But, I want to do the same with a 3D text circle - so that it has some depth - it needs to have full 3D depth for the project.

So far I have tried using a replicator ( like shown here) as a texture.

Also I tried using a radial gradient as the substance paint - but it seems like the the gradient controller has become a bit buggy - one of the 'middle' stoppers in always missing - so it is hard to refine it.

Is there a way to get a texture to wrap/repeat 360 around the direction of the circle - like a replicator can repeat in a circle to make it?

Hoping for some good advice, many thanks.

This is the look I'm trying to get ...

Posted on Oct 9, 2019 2:46 AM

Reply

Answer 1

Top-ranking reply

fox_m

Level 6

12,583 points

Oct 10, 2019 1:13 AM in response to rowie302

I'm not clear on what you want. You're talking about a Stroke, but that's really something that goes shape objects, not 3D Text.

If you're trying to apply a gradient stroked shape as a texture applied to a 3D Text object, then that gets a little tricky. I just want to make sure: Is this what you're talking about?

If it is, then basically, you need to create a circle shape with a gradient stroke that goes from edge to edge (not over the "life" of the stroke, so to speak). In order to do that, draw a rectangle and fill it with your gradient. The circle shape must be created inside a 2D Fixed Resolution Group with the width and height roughly the same as the circle shape, so make the circle large enough to closely match the 3D Text object (it doesn't have to be exact). [When you've finished setting it up, turn off the Group's visibility.]

You will need to adjust the Rectangle > Style > Fill > Gradient Start and End Y parameters to fit in appearance from the gradient you want. And, you will probably have to adjust the Rectangle > Geometry > Size > Width so that it looks smooth on the circle.

The 3D Text "circle" needs to have 0 Depth. Set the Front Edge to Round Ring (with the Back Edge Same as Front). Adjust the width and depth of the Front Edge Size to taste. Set the Substance to Generic and it's Surface to Image. Drag and drop the Group containing your texture into the source well. You will need to open up Placement and play with those properties.

Set Side Placement to Stretch From Edge. Open up Scale and deselect Scale with Font Size. Adjust the Scale down until you see the gradient more or less fit the edge. You may have to adjust Position X and Y to line up the gradient on the circle.

If you run into trouble, let me know where.

Reply

Answer 2

BenB

Level 6

12,631 points

Oct 9, 2019 10:56 PM in response to rowie302

First, a replicator is completely the wrong approach. Use text, use the "Emoji & Symbols" pallet. Go to System Preferences, to Keyboard, and set to show keyboard and emojis viewers in the menu bar.

In Motion, use your text tool, pull up the emojis & symbols viewer, find a circle, double-click to insert it into your text.

Then in the Inspector, Appearance, set the File With in the Face section to Gradient.

If you want it to be 3D, with depth, make it 3D text. Then in the Substances section under Material, set Color Type to Gradient.

And if you seriously want to work with 3D shapes, look into the mO2 plugin from Motionvfx.com.

Reply

Answer 3

rowie302 Author

Level 4

1,296 points

Oct 9, 2019 11:46 PM in response to BenB

I'll add a better quality screen shot to be more clear about what I am trying to do.

The gradient runs on the stroke.

I am already using 3D text.

If it was to be just a flat 2D graphic then I would have used a replicator. For this project, I need to have depth - hence using 3D text instead.

I want to get this gradient effect onto a 3D text circle.

Using the radial gradient on a text substance is really hard to work with - so I am wondering if I can do it with texture sources instead.

Even better, do you know how to make the 3D text circle tubular? I know all about mO2 - it is not what I need for this project.

Please let me know if you have any advice for this, many thanks.

Reply

Answer 4

rowie302 Author

Level 4

1,296 points

Oct 10, 2019 1:57 AM in response to fox_m

Hi Fox M

Thank you for your time

Yes - my description of things isn't the best.

I want to reproduce the 'gradient on stroke style' on a 3D text circle - so I guess I should be saying I want to create a 'gradient across 3D text surface/front edge' - that is the goal here.

In the end I sort of got there using the radial gradient on the substance/smooth paint surface. The controls for it are really messy - things don't line up - this is why I cry 'buggy & broken' but really it is likely I just don't really know how to set things up to create a good alignment with the gradient

Here - i cannot get the lighter part of the gradient to run around the middle exactly. I put a screen shot of the gradient settings too.

This is to give it some context

The circle is going to sit on a plate like this - and my plan was to create a gradient appearance to 'cheat' the roundness - this is my progress so far

aha - but - naturally- the illusion only lasts so far when the group is rotated - too much on the Y or X and the flatness is revealed.

I can just avoid too much rotation to get around this - but I would really like to get the 'rim' looking more tubular/rounded

so my questions are

1) How can I perfect that gradient on the 3D text surface to sit in correct alignment

2) Is there way to turn the 3D text circle into a more of tubular object - rather than squared depth?

or - is it just better to try again with the texture method instead?

Thanks for all your help.

(to put things into context - I received a set of references from a graphic designer, featuring very 3D stylised 'embossed' indented' designs - all done in Adobe Illustrator and Photoshop - so my goal here is interpret/reproduce these designs in Motion 5. Using what I've learned from you about 3D text - it has all been very achievable - but this 'rounded/circular' one has been a real challenge.)

Reply

Answer 5

rowie302 Author

Level 4

1,296 points

Oct 9, 2019 11:13 PM in response to BenB

Hi Ben B

Thanks if the input, but this isn't what I am looking for. In my post I explain that I am already working with 3D text. I want the gradient across the stroke, like in the screen shot I added - not a gradient on the object. Using the radial gradient option with 3D text -substance-paint seems to be broken and buggy - so I posted here to ask if there are any alternative methods.

I don't understand the 'completely wrong' reference regarding the replicator - I simply said that the replicator is being used to demonstrate the gradient effect I want to make. There is nothing wrong at all about using a replicator to create a circle path with a gradient across stroke - it has many advantages for publishing over airbrush and image brush.

Reply

Answer 6

fox_m

Level 6

12,583 points

Oct 10, 2019 11:05 AM in response to rowie302

Convert the Front and Back Edges to Round Ring (Depth=0). You may not need a gradient if your lighting is sufficient.

The Gradient: Set the End Y to near 0 to start and adjust Start Y until you can start centering the gradient into the "ring". Then adjust End Y, Start Y in small increments until you get your target look

Also, tighten up your gradient so that the 3 locations are something like 90%, 92% and 94%. Aligning will be easier to see. When you get the ring gradient centered you can start spreading them out.

Exact numbers for all these things will depend on the size of your 3D Text object, the width of the Front/Back Edge Size, etc., so I can't just supply you numbers for these parameters.

Reply

Answer 7

rowie302 Author

Level 4

1,296 points

Oct 10, 2019 4:51 PM in response to fox_m

Hi Fox M

Thanks again for all the help.

I followed your advice and got the gradient more precise. It turns out I was using the wrong object to start with - I was starting out with a ring shape - so when I used 'round ring' I got 2 rings. Now I changed to just a solid circle to start - and I got the tubular style. I am so grateful for your guidance :)

Reply

Answer 8

fox_m

Level 6

12,583 points

Oct 10, 2019 1:18 AM in response to fox_m

PS - I forgot to add that when you apply the Rectangle gradient as the Stroke "Image" you need to go into the Stroke inspector and turn on Align Brush Angle!

Reply

How can I make a gradient across stroke in a 3D Text Circle/Ring?

Similar questions