53 lines
2.8 KiB
Markdown
53 lines
2.8 KiB
Markdown
# Demo media
|
||
|
||
README stills in `shots/readme/` are taken from the current build, not from `shots/` (those are older comparisons).
|
||
|
||
Capture at 2x, then downscale to 960 px wide: the README image is 960 px, so a 1920 px capture stays sharp on a Retina screen and does not overflow the 980 px document column.
|
||
|
||
```sh
|
||
cargo build --bin anybot
|
||
export ANYBOT_DATA_DIR=/tmp/anybot-readme-shot ANYBOT_SHOT_FRAMES=48
|
||
|
||
# 1) shoot at 2x (1920x1200)
|
||
ANYBOT_SHOT_SIZE=1920x1200 ANYBOT_SHOT_VIEW=chat ANYBOT_SHOT_NOPOPUP=1 target/debug/anybot --screenshot /tmp/chat.png
|
||
ANYBOT_SHOT_SIZE=1920x1200 target/debug/anybot --screenshot /tmp/ask.png # the default demo view: the approval card is in it
|
||
ANYBOT_SHOT_SIZE=1920x1200 ANYBOT_SHOT_VIEW=routines ANYBOT_SHOT_NOPOPUP=1 target/debug/anybot --screenshot /tmp/routines.png
|
||
|
||
# 2) downscale to 960 wide
|
||
python3 - <<'PY'
|
||
from PIL import Image
|
||
for n in ('chat', 'ask', 'routines'):
|
||
im = Image.open(f'/tmp/{n}.png')
|
||
im.resize((960, round(im.size[1] * 960 / im.size[0])), Image.LANCZOS).save(f'shots/readme/{n}.png', optimize=True)
|
||
PY
|
||
```
|
||
|
||
`ANYBOT_SHOT_NOPOPUP=1` keeps the approval card away (a plain screen). The card shot is the default demo view, which selects the computer helper mid-task, so run that one with no `ANYBOT_SHOT_VIEW` and no `ANYBOT_SHOT_NOPOPUP`.
|
||
|
||
`shots/readme/phone.png` is the current `mobile/index.html` sign-in page, captured in a 390×844 browser and downscaled to 300 px wide. It is not the old collage in `shots/phone.png`.
|
||
|
||
```sh
|
||
python3 -m http.server 8766 --directory mobile &
|
||
"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --headless=new --disable-gpu \
|
||
--hide-scrollbars --window-size=390,844 --screenshot=/tmp/phone.png http://127.0.0.1:8766/index.html
|
||
kill %1
|
||
python3 -c "from PIL import Image; im=Image.open('/tmp/phone.png'); im.resize((300, round(im.size[1]*300/im.size[0])), Image.LANCZOS).save('shots/readme/phone.png', optimize=True)"
|
||
```
|
||
|
||
After any README image change, check the page does not overflow: see [../readme-style.md](../readme-style.md).
|
||
|
||
The README shows a demo here. To record one:
|
||
|
||
1. Start AnyBot (desktop) and a bot with a key; run at 1440p, hide notifications.
|
||
2. Record a 20–40 s clip of one complete task, e.g. "organise the Downloads folder"
|
||
(chat → plan → tool steps → files moved) and one computer-use task
|
||
(bot opens the browser, fills a form, stops before Send — the approval card
|
||
popping up **is** the product).
|
||
3. Export GIF: `ffmpeg -i clip.mov -vf "fps=12,scale=960:-1:flags=lanczos,split[a][b];[a]palettegen[p];[b][p]paletteuse" docs/demo/anybot.gif`
|
||
(keep it under ~8 MB; if bigger, cut to one task).
|
||
4. Name it `docs/demo/anybot.gif`. The README comment shows where to un-comment
|
||
the `<img>` line.
|
||
|
||
Preferred: one GIF (desktop, computer-use with the approval card) + one 30 s
|
||
MP4 (`demo.mp4`) of the phone app pairing a new machine.
|