Clock activity: Difference between revisions

From OLPC
Jump to navigation Jump to search
(→‎Summary: fixed typo)
(Upgrade to Clock Activity version 2)
Line 20: Line 20:
* To give the children a way to know the time it is, with their XO, even they don't own a watch.
* To give the children a way to know the time it is, with their XO, even they don't own a watch.
The presentation on screen has been kept simple enough to reach these two objectives.
The presentation on screen has been kept simple enough to reach these two objectives.



===Current Use & Goals===
===Current Use & Goals===
Line 28: Line 29:
* Date and day
* Date and day
* Nice clock face
* Nice clock face
* Digital clock view

A consistent color code is used through the activity so that hours are always displayed in blue (resp. minutes and seconds), either the figures in the digital clock or the short hand in the analog clocks, or the time scale. The child will understand that these are different representations of the same concept.




Line 41: Line 45:
|-
|-
| valign="top"|
| valign="top"|
[[Image:clock-simple.jpg|300px|thumb|center|The basic clock face]]
[[Image:clock-simple.jpg|300px|thumb|center|The basic clock face (v1)]]
| valign="top"|
| valign="top"|
[[Image:clock-nice.jpg|300px|thumb|center|The nice clock face]]
[[Image:clock-nice.jpg|300px|thumb|center|The nice clock face (v1)]]
|-
|-
| valign="top"|
| valign="top"|
[[Image:clock-simple-hours.jpg|300px|thumb|center|The basic clock face showing hours marks (Roman digits used by the French localization)]]
[[Image:clock-simple-hours.jpg|300px|thumb|center|The basic clock face showing hours marks (Roman digits used by the French localization) (v1)]]
| valign="top"|
| valign="top"|
[[Image:clock-nice-date.jpg|300px|thumb|center|The nice clock face displaying the date with French localization]]
[[Image:clock-nice-date.jpg|300px|thumb|center|The nice clock face displaying the date with French localization (v1)]]
|-
|-
|}
|}
Line 55: Line 59:
===Setting the time on your XO===
===Setting the time on your XO===


You can set the date and time of the XO with [http://wiki.laptop.org/go/Sugar_Control_Panel#Time Sugar Control Panel].
You can set the date and time of your XO with the [http://wiki.laptop.org/go/Sugar_Control_Panel#Time Sugar Control Panel].



===Packages and History===

As a Python application, the full source is included in the package for you to enjoy.

* Version 2 [[:Image:Clock-2.xo|Clock-2.xo package]]
* Added Digital Clock.
* Better localization support.
* Color code.
* Version 1 [[:Image:Clock-1.xo|Clock-1.xo package]]
* Analog clocks: simple and nice.
* Initial version.




Line 63: Line 79:
==Development==
==Development==


This code is released in Public Domain, so you can do whatever you want with it. This is simple enough that Python learners can try to add or change features. The whole clock code, with many detailed comments, is a 300 lines Python source.
This code is released in Public Domain, so you can do whatever you want with it. This is simple enough that Python learners can try to add or change features. The whole clock code, with many detailed comments, is a 500 lines Python source.


Point of interests:
Point of interests:
* PyGTK events programming, when one clicks on right button.
* PyGTK events programming, when one clicks on right button.
* Cairo drawing.
* Cairo drawing and Pango layout.
* Localization. Though a clock face should look quite similar in all cultures, you can adapt the way it displays hours numbers and date.
* Localization. Though a clock face should look quite similar in all cultures, you can adapt the way it displays hours numbers and date. Use of Pango markup allows to adapt the views to cultural representations of date and time.
* SVG rendering. The nice clock background is the SVG file clock.svg (drawn with [http://www.inkscape.org Inkscape]). You can change it to your liking.
* SVG rendering. The nice clock background is the SVG file clock.svg (drawn with [http://www.inkscape.org Inkscape]). You can change it to your liking.


Look at the README file for notes and ideas.


===Localization===


The Clock activity has been written with localization in mind, though a clock should look similar in all cultures. The POT file contains strftime patterns and Pango markup, so that translators can localize the application with more freedom. For instance, they can change the way date or time are displayed, the fonts to use or the size of characters.
===Source===


I've provided 3 localizations for French, English and Spanish, but others are welcome!
[[:Image:Clock-1.xo|Clock-1.xo package]]




Line 81: Line 101:
* Open the clock activity.
* Open the clock activity.
* Check that it display the current time of the XO.
* Check that it display the current time of the XO.
* Click on right button to change clock face display. Display mode loops (simple + hours + day and date + nice clock).
* Click on right button to change clock face display. Display mode loops (simple + hours + day and date + nice clock + digital).
* Close the activity; ensure that it closes properly.
* Close the activity; ensure that it closes properly.



Revision as of 03:45, 27 March 2008

Activity-clock.svg

see more templates or propose new


  For the general public

Description & Goals

What time is it?

Summary

The Clock activity aims at two simple goals:

  • As a teaching tool to help children learn how to read time.
  • To give the children a way to know the time it is, with their XO, even they don't own a watch.

The presentation on screen has been kept simple enough to reach these two objectives.


Current Use & Goals

Click on right button to change display mode.

  • Simpler display
  • With hours numbers
  • Date and day
  • Nice clock face
  • Digital clock view

A consistent color code is used through the activity so that hours are always displayed in blue (resp. minutes and seconds), either the figures in the digital clock or the short hand in the analog clocks, or the time scale. The child will understand that these are different representations of the same concept.


Other uses

Learn how to find geographical North (or South, depending in which hemisphere you are located) using the clock hands: Findind True North Without a Compass. And from there, build a solar clock!


Screenshots

The basic clock face (v1)
The nice clock face (v1)
The basic clock face showing hours marks (Roman digits used by the French localization) (v1)
The nice clock face displaying the date with French localization (v1)


Setting the time on your XO

You can set the date and time of your XO with the Sugar Control Panel.


Packages and History

As a Python application, the full source is included in the package for you to enjoy.

* Added Digital Clock.
* Better localization support.
* Color code.
* Analog clocks: simple and nice.
* Initial version.


Development

This code is released in Public Domain, so you can do whatever you want with it. This is simple enough that Python learners can try to add or change features. The whole clock code, with many detailed comments, is a 500 lines Python source.

Point of interests:

  • PyGTK events programming, when one clicks on right button.
  • Cairo drawing and Pango layout.
  • Localization. Though a clock face should look quite similar in all cultures, you can adapt the way it displays hours numbers and date. Use of Pango markup allows to adapt the views to cultural representations of date and time.
  • SVG rendering. The nice clock background is the SVG file clock.svg (drawn with Inkscape). You can change it to your liking.

Look at the README file for notes and ideas.


Localization

The Clock activity has been written with localization in mind, though a clock should look similar in all cultures. The POT file contains strftime patterns and Pango markup, so that translators can localize the application with more freedom. For instance, they can change the way date or time are displayed, the fonts to use or the size of characters.

I've provided 3 localizations for French, English and Spanish, but others are welcome!


Functional Test

  • Open the clock activity.
  • Check that it display the current time of the XO.
  • Click on right button to change clock face display. Display mode loops (simple + hours + day and date + nice clock + digital).
  • Close the activity; ensure that it closes properly.