docs: Add screenshot to READMEHEADmain

12 files changed, 49 insertions, 0 deletions

diff --git a/README.md b/README.md
index 92300bd..75c081a 100644
--- a/README.md
+++ b/README.md
@@ -2,6 +2,8 @@
 
 A digital clock that runs in your terminal, providing clock, alarm and timer.
 
+![screenshot](assets/screenshot.png)
+
 ## Features
 
 - Clock Mode: Digital display of current time (24-hour format)
@@ -31,6 +33,8 @@ or
 $ term-clock
 ```
 
+![clock](assets/clock.gif)
+
 ### Alarm Mode
 
 The screen flashes when the specified time is reached. Time should be specified in 24-hour format (HH:MM).
@@ -39,6 +43,8 @@ The screen flashes when the specified time is reached. Time should be specified
 $ term-clock alarm 07:00  # Alarm at 7:00 AM
 ```
 
+![alarm](assets/alarm.gif)
+
 ### Timer Mode
 
 Counts down from the specified duration. Time should be specified using Go's duration format.
@@ -50,6 +56,8 @@ $ term-clock timer 90s    # 90-second timer
 $ term-clock timer 1h30m  # 1 hour 30 minutes timer (note: maximum 99 minutes)
 ```
 
+![timer](assets/timer.gif)
+
 ### Countdown Mode
 
 Counts down from the specified number of seconds to zero, displaying the remaining seconds.
@@ -63,6 +71,8 @@ $ term-clock countdown 9999  # Countdown from 9999 seconds
 
 Note: Maximum supported duration is 9999 seconds.
 
+![countdown](assets/countdown.gif)
+
 ## How to Exit
 
 Press `Ctrl+C` or type `q` to exit.
diff --git a/assets/alarm.gif b/assets/alarm.gif
new file mode 100644
index 0000000..3849a1b
--- /dev/null
+++ b/assets/alarm.gif
diff --git a/assets/clock.gif b/assets/clock.gif
new file mode 100644
index 0000000..b2d914b
--- /dev/null
+++ b/assets/clock.gif
diff --git a/assets/countdown.gif b/assets/countdown.gif
new file mode 100644
index 0000000..abc1d13
--- /dev/null
+++ b/assets/countdown.gif
diff --git a/assets/screenshot.png b/assets/screenshot.png
new file mode 100644
index 0000000..1556a9a
--- /dev/null
+++ b/assets/screenshot.png
diff --git a/assets/timer.gif b/assets/timer.gif
new file mode 100644
index 0000000..d64b487
--- /dev/null
+++ b/assets/timer.gif
diff --git a/tools/vhs/NOTE b/tools/vhs/NOTE
new file mode 100644
index 0000000..59ce49b
--- /dev/null
+++ b/tools/vhs/NOTE
@@ -0,0 +1,5 @@
+How to generate assets/ files:
+
+$ nix run 'nixpkgs#vhs' tools/vhs/[FILE].tape
+
+See also: https://github.com/charmbracelet/vhs
diff --git a/tools/vhs/_config.tape b/tools/vhs/_config.tape
new file mode 100644
index 0000000..e532611
--- /dev/null
+++ b/tools/vhs/_config.tape
@@ -0,0 +1,4 @@
+Set FontSize 32
+Set Width 800
+Set Height 600
+Set Theme "iceberg-dark"
diff --git a/tools/vhs/alarm.tape b/tools/vhs/alarm.tape
new file mode 100644
index 0000000..188ccac
--- /dev/null
+++ b/tools/vhs/alarm.tape
@@ -0,0 +1,7 @@
+Source "tools/vhs/_config.tape"
+Output assets/alarm.gif
+
+Type "term-clock alarm 03:10"
+Sleep 500ms
+Enter
+Sleep 5s
diff --git a/tools/vhs/clock.tape b/tools/vhs/clock.tape
new file mode 100644
index 0000000..f597fb3
--- /dev/null
+++ b/tools/vhs/clock.tape
@@ -0,0 +1,9 @@
+Source "tools/vhs/_config.tape"
+Output assets/clock.gif
+
+Type "term-clock clock"
+Sleep 500ms
+Enter
+Sleep 5s
+
+Screenshot assets/screenshot.png
diff --git a/tools/vhs/countdown.tape b/tools/vhs/countdown.tape
new file mode 100644
index 0000000..28ec516
--- /dev/null
+++ b/tools/vhs/countdown.tape
@@ -0,0 +1,7 @@
+Source "tools/vhs/_config.tape"
+Output assets/countdown.gif
+
+Type "term-clock countdown 5"
+Sleep 500ms
+Enter
+Sleep 7s
diff --git a/tools/vhs/timer.tape b/tools/vhs/timer.tape
new file mode 100644
index 0000000..09a994c
--- /dev/null
+++ b/tools/vhs/timer.tape
@@ -0,0 +1,7 @@
+Source "tools/vhs/_config.tape"
+Output assets/timer.gif
+
+Type "term-clock timer 5s"
+Sleep 500ms
+Enter
+Sleep 7s