Inspired by a watch face from @a.rebolino71:
I always loved “Beaker”, this tragic hero!
I hope you enjoy my version:
10 Likes
Speaking of “cute”…
1 Like
I’m glad i have inspirate this new version of Beaker!
1 Like
Hahaha! I love this face 
When I was younger I had said I always wanted to name my first kid beaker because he’s the best! I couldn’t talk my wife into it but his nickname is definitely beaker. Check out his soft toys hand made in 2018 from a pattern from the 80s!
4 Likes
Yeah! Beaker rulez! Best one was when they had a cloning machine! Hundreds of Beakers all over.
1 Like
Very cool!
1 Like
THOSE ARE SO AWESOME!!! I love them.
2 Likes
Awe, how sweet. 
1 Like
This watch doesnt get enough credit. I think its the greatest creative watch on here. I checked how it was built and Please tell me how you were able to move .png’s like that? I have been limited to just GIF files because I didnt know you can do that. Are you able to tell me how you move them?
1 Like
Thanks a lot!
For sure i can tell you a little bit of the process to create such an animated watch face with .png´s.
Well the code for the animation of the objects isn´t that difficult. It´s mainly sine based movement in x-direction and sine based rotation, sometimes combined.
Some examples
Slow movement for Dr. Honeydew in x-direction for example in the X-field: (300+sin((#DWE#/0.8))*15)
Explanation of the values: 300 is the start position in pixel on the watch face, #DWE# the time based value, /12 the speed operator and *15 the size of the movement.
Slow rotating for Dr. Honeydew in the Rotate-field: (0+(sin(#DWE#/0.3)*6))
Explanation: Same as above but the *6 is the angle of rotation.
The nose has a size changing Animation (breath)
((sin(#DWE#*2)*20)+320)
This formulae must be filled in both the width and height fields
The figure of beeker is cutted by photoshop in single operating pieces (Arms, Nose, pupils, mouth) and saved seperately.
You have to take care at this point where you place your rotation point.
And that´s all.
I hope this mini tutorial will help you and others a little bit to create nice animations.
Greetings, GAUSS.
2 Likes
Thanks a lot for the explination. I am trying it here, and just cant seem to figure that out, even copying and pasting your code just to figure see if it will move.
May be a stupid question but where does the SIN come in? Whats that code do?
I think I am stuck with amateus status designs on this one. The reason I dont do webdesign is code gets in the way 
Appreicate the help though.
“sin” is a sinuse function, means a repeating waveform in a mathematical function, up and down, back and forth…
I think I better stick with the templated stuff. Appreciate the time, I will practice, and hopefully master it.
1 Like