Recent Widgets


Register for DashboardWidgets

Recent Forums Posts

Partners


iCompositions

MacDesktops.net

RSS Showcase
RSS Comments
RSS Forums

This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies. Posted in: Widget Testing
Goto page 1, 2  Next

Tag Heuer World Clock Watch

Author Message
exg5



Joined: 01 May 2005
Posts: 47

Posted: Sat Sep 17, 2005 - 3:09 am    Post subject: Tag Heuer World Clock Watch Reply with quote

I was told to move my post to this forum...

I need some help with the scripting of my widget.
If you have seen my widget, you will know that in the 3 o'clock position, ther is a date field. I would like this field to update itself without having to 'reset' the widget.

Also, I would like to animate the dial surrounding the face of the watch as an extra bonus that would look pretty cool.

Finally, I want the little knob on the side to remain visible all the time, and when the cursor hovers over the widget, the pin pulls outů

If anybody thinks that they can help me with any of these topics, I would be very grateful.

Thanks,
e

PM me for a link to the widget script, as well as for further information.
View user's profile Send private message Send e-mail Widgets
cerberus



Joined: 20 Jun 2005
Posts: 118

Posted: Sat Sep 17, 2005 - 5:46 pm    Post subject: Reply with quote

I will look into it in the next day and message you with recommended changes.

In the meantime; you need to prepare the bezel as a separate image if you want it to move separately.

You need make a "pin" with a longer stem that will be used when it is pulled out... It would be cool to animate this by showing one or two intermediate position images briefly. However it might be more elegant to use one image and to hide part of the stem when it is not is pulled out... This could be animated also.

For the date field numbers, I think a text font might be the best way to go... The date window looks tiny... Is it that small (proportionally) on the real watch ?

cerberus
View user's profile Send private message Send e-mail Visit poster's website Widgets
cerberus



Joined: 20 Jun 2005
Posts: 118

Posted: Sat Sep 17, 2005 - 6:23 pm    Post subject: Reply with quote

I see that there is a gradient on the clock face and bezel... In order for it to look proper when the bezel is turned, the gradient needs to be stationary; so the gradient also needs to be in a separate image. I suggest that perhaps the bezel gradient can be combined with the clock face/watch body (so there would be a ring in this image that is mostly transparent).

cerberus
View user's profile Send private message Send e-mail Visit poster's website Widgets
exg5



Joined: 01 May 2005
Posts: 47

Posted: Sun Sep 18, 2005 - 1:46 pm    Post subject: Reply with quote

oků, I'm a little bit confused..
View user's profile Send private message Send e-mail Widgets
cerberus



Joined: 20 Jun 2005
Posts: 118

Posted: Sun Sep 18, 2005 - 3:23 pm    Post subject: Reply with quote

The gradient is where the image gets lighter towards the top to simulate light reflecting off a curved surface. Without it, your widget would look flat, and not as realistic. The gradient and the drop shadow together infer an external light source,(e.g. the sun). So the components of the image which create this effect must remain in place when the bezel is rotated or the entire 3d illusion will be totally spoiled.

I assume that you have a good grasp of graphic arts and the tools of that trade since your widget looks so realistic. If you want parts of the image to move, these must be graphically separate from the stationary elements, including the simulated light source effects.

cerberus
View user's profile Send private message Send e-mail Visit poster's website Widgets
exg5



Joined: 01 May 2005
Posts: 47

Posted: Sun Sep 18, 2005 - 5:10 pm    Post subject: Reply with quote

Thanks for the compliment.. Very Happy

Now I understand what you mean. I actually designed the watch in photoshop, and I have the bezel designed in 4 different layers. The text is one layer with the little notches. Then the 'gradient' is actually a whole bunch of the main image repeated with different opacities and effects to produce the illusion. I can send you the .psd file and since you know more-or-less which layers you'll need to turn the bezel, you can decide?

Thanks again,
e
View user's profile Send private message Send e-mail Widgets
cerberus



Joined: 20 Jun 2005
Posts: 118

Posted: Sun Sep 18, 2005 - 8:10 pm    Post subject: Reply with quote

I need to borrow another Mac to use PhotoShop and I really don't know what I am doing. You need to cut these parts out of the bezel out as a donut shape :

1. Numbers and Tick Marks
2. Background color of bezel (this does not need to rotate, but it may help that it is there to receive mouse clicks ... or not ! See below for more on that issue..)

and make a separate image out of them...

This new image should have the general shape of a donut.. The "donut hole" and the area outside the "donut" need to be transparent.

This will leave the gradient parts remaining in the main image.

Did you see the simpleWorldClock that is in the Showcase today ? It is a good example we can follow.. However when you click on the inner ring of this clock, the bezel jumps around unnaturally. I am sure it is solvable, but such bugs prove that this function is harder to code than it looks. It will take some work from both of us to make it look good.

Another issue that might come up is needing to click -through- the gradient layer... I anticipate this problem may occur. There are a few solutions for it. If you are willing to put in the effort, I will help make sure the code runs smoothly.

Anyway, I can work on the winder stem and date problems without any new images. The date is already displaying properly; so getting it to update under all circumstances is a relatively easy thing to fix. I will work on that first, then the stem winder, and finally the bezel.

cerberus
View user's profile Send private message Send e-mail Visit poster's website Widgets
exg5



Joined: 01 May 2005
Posts: 47

Posted: Sun Sep 18, 2005 - 9:29 pm    Post subject: Reply with quote

Thank you very much. So basically, if I understand

1. My main image excluding the digits around the bezel

2. The digits on the bezel (without a backdrop?)

3. The backdrop from behind the 'gradient' layers

If that is correct, I will do that right now..

I'm assuming you want it in (.png) format like the rest?
View user's profile Send private message Send e-mail Widgets
cerberus



Joined: 20 Jun 2005
Posts: 118

Posted: Sun Sep 18, 2005 - 10:20 pm    Post subject: Reply with quote

exg5 wrote:
Thank you very much. So basically, if I understand

1. My main image excluding the digits around the bezel

2. The digits on the bezel (without a backdrop?)



Let's start with the backdrop included in the bezel and see if it can receive mouse clicks behind the gradient layer.. I think it does not hurt to have this included.

Quote:
3. The backdrop from behind the 'gradient' layers{/quote}

This one should be everything else except the parts you want to move, including all the gradient layers.

If that is correct, I will do that right now..

{quote]I'm assuming you want it in (.png) format like the rest?


Yes, .pngs are easiest for me to handle...I am slow at programming, so please be patient with me. Also in this time, I think you should change the clock hands to be more authentic. I tried substituting .pngs for the clock hands in World Clock and it works great and did not seem to affect CPU; so I don't know why Apple uses .pdfs.

cerberus
View user's profile Send private message Send e-mail Visit poster's website Widgets
exg5



Joined: 01 May 2005
Posts: 47

Posted: Mon Sep 19, 2005 - 12:35 am    Post subject: Reply with quote

I actually designed the proper hands, and they looked greatů

but when I tried adding them in, a.k.a. replacing the apple ones, I got bad results.

The second hand was no longer centred, and instead wandered in circles around the edge of the watch.

One quick question, completely off the topic, do you know anything abotu Quartz composer, and if so, do you know how to add audio to it?
View user's profile Send private message Send e-mail Widgets
cerberus



Joined: 20 Jun 2005
Posts: 118

Posted: Mon Sep 19, 2005 - 12:51 am    Post subject: Reply with quote

OK I did the stem winder first because it didn't involve mathematics...

The hands wandering about.. Yes, I have seen that, the angles used by canvas are in radians so the math there is tricky.. but it can be made to work.

About Quartz composer.. Can it do audio ? That would be interesting since I can't seem to find a way to learn Objective C to write my own widget plug-in... I did not play around with Quartz Composer yet because I haven't a clue what it's native programming language is.

The easiest way to make a widget play an audio file, I think might be to embed a QuickTime player in the widget and have it refer to an audio file that is inside the widget.. If you take a look at the MusiCalc widget's metronome.. i -think- it works this way.

That widget that PM99 wrote about in the news...(looks like a CD jacket, I forget the name.,..) that is an mp3 player also might be an avenue to explore.. I did not look to see how it streams mp3s from a website, but it probably also works with QuickTime. (or perhaps Flash or the RealPlayer plug-in).

cerberus
View user's profile Send private message Send e-mail Visit poster's website Widgets
exg5



Joined: 01 May 2005
Posts: 47

Posted: Mon Sep 19, 2005 - 1:10 am    Post subject: Reply with quote

Haha, no I wasn't planning on using it in a widget. I was trying to create a screensaver, but I got it to work... thanks anyways.

as for the pictures, I can give you a link to them if you would like, I compressed them for storage Very Happy
View user's profile Send private message Send e-mail Widgets
cerberus



Joined: 20 Jun 2005
Posts: 118

Posted: Mon Sep 19, 2005 - 1:01 pm    Post subject: Reply with quote

Send 'em.. I think the hands need to be changed. If you resize the images so that the bottom left corners and the center/pivot points line up with Apple's images then it should work without changing the code. Otherwise we can change the co-ordinates to suit whatever dimensions you want to use.

cerberus
View user's profile Send private message Send e-mail Visit poster's website Widgets
exg5



Joined: 01 May 2005
Posts: 47

Posted: Tue Sep 20, 2005 - 12:13 am    Post subject: Reply with quote

Ok.

I'm not entirely sure how to deal with the hands. I can line them up in the graphics provided by apple, and then delete their images, but I already tried that... to no success.

I'll try and send you the files A.S.A.P

The only problem is that i drew the images very large, and then scaled them down to fit the proportions designed by apple. I can't remember what percentage I scaled the images, so it's going to take a while for me to figure that out.

e
View user's profile Send private message Send e-mail Widgets
exg5



Joined: 01 May 2005
Posts: 47

Posted: Thu Oct 06, 2005 - 1:29 am    Post subject: Reply with quote

Update:

I have found the correct sizing for the graphics, I decided to update them a little bit so that they will look better when rotated. I have been very busy with school work, therefore the lack of response in this post.

Thanks again fro all the help cerberus.

ex
View user's profile Send private message Send e-mail Widgets
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.

 
Goto page 1, 2  Next
Powered by phpBB © 2001, 2002 phpBB Group