If you have Facer premium, you can design watch faces and utilize the theme picker (color picker) which is pretty cool and offers end users to choose a theme. To do this you simply tap on the paint brush of any layer that you wish to be theme-able.
But, what if some of the Facer theme colors don’t work with your idea? If you want to create your own custom palette, you can do so using VAR functions.
In this tutorial I will be using custom backgrounds but you can use the theory for many other things.
1st, create the number of backgrounds (layers) you want, and choose the custom color for each background.
In the opacity setting for each layer you will use the following code:
$#VAR_1#%A==B?100:0$
Change A to the total number of backgrounds you have and keep it the same for every layer.
Change B for each layer starting at 0 and increase consecutively to the last layer.
For example, if you only wanted 3 backgrounds you would create three layers and in each opacity field you would enter the following:
1.
$#VAR_1#%3==0?100:0$
$#VAR_1#%3==1?100:0$
$#VAR_1#%3==2?100:0$
In my example face attached, I have 10 colors (layers), so the 1st layer (white) uses
$#VAR_1#%10==0?100:0$
Layer two uses:
$#VAR_1#%10==1?100:0$
and so on.
Finally, add a VAR increment and VAR decrement layer so that your users can cycle through your chosen themes. Please let me know if you have any questions, and remember to have FUN!!
Thank you for this, a great solution to the very limited Theme option and a shame Facer developers never pushed/added such features.
Just tried this out on various elements and works well, ideal for those wanting to design watches with only a pre-set/certain colour range (i.e. pastel ranges).
@chaficfeguri I note after Inspecting the work of Pascal you have flagged he does not use the VAR for the Colour changing on the Face but the Facer Theme . This Tutorial was specifically about changing Colours with VAR . The thing with these Tutorials is to keep them simple for People who are starting out on thier Face Making Journey not at the End Like Myself .
Very well scored, I sing more simply explained so that we can use Facer to the maximum. I think there are others like me who don’t know programming and we look at some formulas and then put our hands in our heads because we don’t know what to do with them.
Some use the Descriptive form of maths . Peter is brilliant as well . I will not invoke him but you see him here as petruuccios I have removed the @ as I keep invoking him . Again well done @thomasfmal .
You will be surprised what you are able to remember and do after you have put in your 1000 hours . I would say to myself I can never remember this .
That is the way Increment and decrement works in this example. White is the 1st background (0) so think of it as the default. If you tap on reset it brings you back to white. So, the decrement (or back) works as intended, not going back beyond the default.
I did a test with this code on my watch . It did not hang , Modulo ensured that it started round the cycle again Exactly as Modulo is suppose to work . Having decrement and Reset is a Luxury .
Hi I’m new to the Facer Creator and just published my first few faces.
I will try this coding. I think it’s great people are willing to share and pass on thoughts and their own ideas.
Could you possibly help with a tutorial or better still coding to create a mask for a font?
Ian[quote=“thomasfmal, post:1, topic:86708, full:true”]
CGE TUTORIAL - CUSTOM COLORS
If you have Facer premium, you can design watch faces and utilize the theme picker (color picker) which is pretty cool and offers end users to choose a theme. To do this you simply tap on the paint brush of any layer that you wish to be theme-able.
But, what if some of the Facer theme colors don’t work with your idea? If you want to create your own custom palette, you can do so using VAR functions.
In this tutorial I will be using custom backgrounds but you can use the theory for many other things.
1st, create the number of backgrounds (layers) you want, and choose the custom color for each background.
In the opacity setting for each layer you will use the following code:
$#VAR_1#%A==B?100:0$
Change A to the total number of backgrounds you have and keep it the same for every layer.
Change B for each layer starting at 0 and increase consecutively to the last layer.
For example, if you only wanted 3 backgrounds you would create three layers and in each opacity field you would enter the following:
1.
$#VAR_1#%3==0?100:0$
$#VAR_1#%3==1?100:0$
$#VAR_1#%3==2?100:0$
In my example face attached, I have 10 colors (layers), so the 1st layer (white) uses
$#VAR_1#%10==0?100:0$
Layer two uses:
$#VAR_1#%10==1?100:0$
and so on.
Finally, add a VAR increment and VAR decrement layer so that your users can cycle through your chosen themes. Please let me know if you have any questions, and remember to have FUN!!
[/quote]
Brill! I will try this.
Can you possibly help with setting up a mask for a font. I’ve tried to find if anyone has addressed anything about this but couldn’t find anything.
Ian
What do you mean by that? Please describe what should it do.
For changing text color you have to use same principle as for background, prepare multiple duplicates of your text layer adjust their individual colors and use the formulas with variable tag like in those examples given above. Or inspect the one below
What I’m trying (without success) is to have the minutes font not as 1 colour but the font having a gradient colour (I’m calling this a mask) so that when the number is on screen the number is a coloured gradient. Example is Gulliver’s watchface GLL - BN 3.0 BIG NUMBERS
I think the Face you refer to is created with transparent images as numbers (Like cut out numbers so to speak) then a rotating colored background under the image layers. I could be wrong but its what it seems like to me
Inspect this example. It changes colors fluently. The font has all letters and digits as full black squares with hollow glyphs and the gradient runs below them.
