LLM/Clock generation: Difference between revisions

Revision as of 20:00, 23 November 2025

Some co-workers showed me Brian Moore's AI World Clocks project.

The prompt (“Create HTML/CSS of an analog clock showing ${time}. Include numbers (or numerals) if you wish, and have a CSS animated second hand. Make it responsive and use a white background. Return ONLY the HTML/CSS code with no markdown formatting.”) seems simple enough, but it is fascinating each model is able to 'almost' get it on a consistent basis.

My curiosity piqued, I initially asked my local LLM “write me a program to display a clock in javascript” and and it did, but the clock was a digital one: video (source)

So in the same session, I simply added "I want an analog clock" and it gave me a pretty decent one, but with no numbers on the face: video (source)

Finally, I wrapped up that LLM session with "Add numbers to the face of the clock" and got something that compared pretty favorably to the best clocks found on Brian Moore's site: video (source)

@@ Line 3: / Line 3: @@
 The prompt (“Create HTML/CSS of an analog clock showing ${time}. Include numbers (or numerals) if you wish, and have a CSS animated second hand. Make it responsive and use a white background. Return ONLY the HTML/CSS code with no markdown formatting.”) seems simple enough, but it is fascinating each model is able to ''''almost'''' get it on a consistent basis.
-[[File:Qwen3-coder digital clock.mp4|right|200px|thumb]]My curiosity piqued, I initially asked [[LLM|my local LLM]] “write me a program to display a clock in javascript” and and it did, but the clock was a digital one: ([https://gitlab.com/hexmode1/clock-llm/-/blob/4125b20e46f23c044c3ecabdb502765ee1854942/generated-clocks/initial-attempt.html source])
+My curiosity piqued, I initially asked [[LLM|my local LLM]] “write me a program to display a clock in javascript” and and it did, but the clock was a digital one: [[:File:Qwen3-coder digital clock.mp4|video]] ([https://gitlab.com/hexmode1/clock-llm/-/blob/4125b20e46f23c044c3ecabdb502765ee1854942/generated-clocks/initial-attempt.html source])
-[[File:Qwen3-coder-analog-clock-1.mp4|right|200px|thumb]]So in the same session, I simply added "I want an analog clock" and it gave me a pretty decent one, but with no numbers on the face: ([https://gitlab.com/hexmode1/clock-llm/-/0blob/4125b20e46f23c044c3ecabdb502765ee1854942/generated-clocks/clock.html source])
+So in the same session, I simply added "I want an analog clock" and it gave me a pretty decent one, but with no numbers on the face: [[:File:Qwen3-coder-analog-clock-1.mp4|video]] ([https://gitlab.com/hexmode1/clock-llm/-/0blob/4125b20e46f23c044c3ecabdb502765ee1854942/generated-clocks/clock.html source])
-[[File:Qwen3-coder-analog-clock-2.mp4|right|200px|thumb]]Finally, I wrapped up that LLM session with "Add numbers to the face of the clock" and got something that compared pretty favorably to the best clocks found on Brian Moore's site: ([https://gitlab.com/hexmode1/clock-llm/-/blob/4125b20e46f23c044c3ecabdb502765ee1854942/generated-clocks/new-clock.html source])
+Finally, I wrapped up that LLM session with "Add numbers to the face of the clock" and got something that compared pretty favorably to the best clocks found on Brian Moore's site: [[:File:Qwen3-coder-analog-clock-2.mp4|video]] ([https://gitlab.com/hexmode1/clock-llm/-/blob/4125b20e46f23c044c3ecabdb502765ee1854942/generated-clocks/new-clock.html source])