Spec Driven Development
MCP Server that facilitates spec-driven development workflows, not just Vibe Coding.
คำอธิบายจากผู้ทำ (ภาษาอังกฤษตามต้นฉบับ)
Frame screenshots and screen recordings in Apple device bezels (device mockups). macOS only.
สามเรื่องนี้ไม่รวมเป็นคะแนนเดียว เพราะความเห็น การวัด และความนิยม เป็นคนละเรื่องกัน
ตัวนี้ยังไม่ได้เรียบเรียงเป็นภาษาไทย ด้านล่างคือข้อเท็จจริงที่เราอ่านจาก registry
เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง
ต้องเตรียมก่อน
คุณใช้แอปไหน
เลือกแอปด้านบน เราจำไว้ให้ ครั้งหน้าปุ่มจะขึ้นว่า “ติดตั้งลง …”
เปิด Claude Desktop → Settings → Developer → Edit Config แล้ววางค่านี้ในไฟล์ claude_desktop_config.json
{
"mcpServers": {
"bezelbub": {
"command": "npx",
"args": [
"-y",
"@dgr_labs/bezelbub-mcp"
]
}
}
}พิมพ์คำสั่งนี้ใน Terminal
claude mcp add bezelbub -- npx -y @dgr_labs/bezelbub-mcpวางในไฟล์ .cursor/mcp.json ของโปรเจกต์ หรือ ~/.cursor/mcp.json
{
"mcpServers": {
"bezelbub": {
"command": "npx",
"args": [
"-y",
"@dgr_labs/bezelbub-mcp"
]
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
วางในไฟล์ .vscode/mcp.json ของโปรเจกต์
{
"servers": {
"bezelbub": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@dgr_labs/bezelbub-mcp"
]
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
ตัวนี้รันในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะ server บนอินเทอร์เน็ต ลองเลือกแอปอื่น
ตัวเลือกเก็บในคุกกี้บนเครื่องนี้ ไม่ต้องมีบัญชี
ค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README
รันในเครื่องคุณ รายการเครื่องมือจะขึ้นในแอป AI หลังติดตั้ง
เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 7 พ.ย. 2569
ชื่อใน registry ยืนยันด้วยบัญชี GitHub cwooddgr ซึ่งเป็นเจ้าของ repo
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต
ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน
รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต
เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo
จากการตรวจเบื้องต้นของเรา ผ่าน 1 จาก 1 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น
registry ไม่ได้ระบุว่าต้องใช้กุญแจ แต่บางตัวจะขอให้ล็อกอินตอนใช้ครั้งแรก
รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)
repo บน GitHub มีการแก้โค้ดล่าสุด – และส่งรุ่นล่าสุด (0.4.0) เข้า registry 19 วันที่ผ่านมา
โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js ในเครื่องด้วย
ในหมวดเดียวกันมี Spec Driven Development, Remote Desktop Commander, Intervals MCP
server หมวดเดียวกันจากผู้ทำคนอื่น เรียงตามดาว
อ่านการ์ด:★ ดาว GitHubiสามเสา: รีวิว · ผลตรวจ · การใช้งานiอัปเดต = วันที่ส่งรุ่นล่าสุดเข้า registryi
MCP Server that facilitates spec-driven development workflows, not just Vibe Coding.
Remote Desktop Commander: use files, terminal and processes on your own computers from any AI app.
Remote MCP server for intervals.icu run data and analysis
ส่วนนี้คัดจาก repo ของผู้ทำตามต้นฉบับ PopNx MCP ไม่ได้ตรวจหรือรับรองเนื้อหา ตัด HTML รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ
Bezelbub puts your screenshots and screen recordings inside realistic Apple device bezels, so you get pixel-accurate device mockups for iPhone, iPad, Mac, and Apple TV as framed images and videos. You can use it three ways:
bezelbub (brew install cwooddgr/tap/bezelbub). Frame a screenshot from a script, add a device frame to a screen recording, or export a transparent HEVC-with-alpha video with a VP9/WebM copy for Chrome and Firefox. We built it for shell scripts, CI, and AI agents. Jump to the CLI docs.Get Bezelbub on the App Store for Mac, iPhone, and iPad.
.mov, ready to lay over any web page or presentation.iphoneduo), the outer display with the phone closed (iphoneduoouter), or the outer display with the phone open and seen from the back (iphoneduoouteropen), in portrait or landscapebezelbub command-line toolWith bezelbub you can frame screenshots and screen recordings from a shell script, a CI pipeline, or an AI agent. There is no GUI and nothing ever prompts you. Every input is a flag with a sensible default, you can ask for JSON output, and when something goes wrong you get a distinct nonzero exit code plus a concrete suggestion on stderr (valid ids, matching devices, nearest screen sizes), so one failed call tells you how to fix the next one.
Install it with Homebrew:
brew install cwooddgr/tap/bezelbub
# Frame a screenshot. We detect the device from its pixel size.
bezelbub frame --input shot.png # writes shot-framed.png
bezelbub frame --input demo.mp4 # writes demo-framed.mp4
bezelbub frame --input demo.mp4 --background transparent # writes demo-framed.mov
bezelbub frame --input demo.mp4 --background transparent --webm
bezelbub devices [--json]
bezelbub devices --input shot.png # or demo.mp4, or --dimensions 1206x2622
bezelbub frame --input shot.png --device iphone17pro \ --color "Cosmic Orange" \ --orientation landscape \ --background "#1D1D1F" \ --output-size 50% \ --output framed.png --json
frame is the default subcommand, so bezelbub --input shot.png works too.
Leave out --device and we work out the device from the input's pixel dimensions. For iPhones and iPads that means an exact match on screen resolution, within a pixel. For Macs, iMac, Studio Display, and Apple TV it means an exact match on capture size: every macOS display zoom setting captures at a known pixel size per model, so a 3420×2214 screenshot can only have come from a 15" MacBook Air, whatever zoom it was taken at. Sizes we don't have on file, such as external monitors or downscaled recordings, fall back to aspect-ratio matching. When you frame a display capture, we scale it to fit the bezel's screen.
Detection succeeds when exactly one device matches. If several models share the size, the error lists them so you can run again with --device . If nothing matches, we suggest the nearest devices by aspect ratio. To check before framing anything, run bezelbub devices --input or bezelbub devices --dimensions WxH.
Pass --background transparent with a video input and you get HEVC with an alpha channel in a QuickTime .mov instead of an MP4: a device-framed recording with a fully transparent background, ready to lay over anything. Safari and Apple's frameworks (AVFoundation, AppKit, UIKit) play HEVC-with-alpha. Chrome and Firefox don't decode it.
For those browsers, add --webm and you also get a VP9/WebM copy that keeps the alpha channel. To make it we render a temporary ProRes 4444 master and hand that to ffmpeg, which must be on your PATH. We deliberately don't hand ffmpeg the HEVC .mov: ffmpeg builds older than 8.0 can't decode HEVC's alpha layer and silently write an opaque WebM. Version 8 and later decode it fine, but the ProRes route works on any build. Serve both files, with the .mov first:
<video autoplay loop muted playsinline>
The order matters. Safari can play VP9/WebM but drops its alpha channel, so if you list the WebM first, Safari shows your transparency as solid black. With the .mov first, Safari takes the HEVC-alpha file, while Chrome and Firefox skip video/quicktime and fall through to the WebM.
If you pass --output for a transparent export, the path must end in .mov. The WebM lands beside it with a .webm extension.
bezelbub frame --input <path> [options]
bezelbub devices [--input | --dimensions WxH] [--json]
Options for frame:
| Flag | What it does |
|---|---|
--input, -i | The screenshot (PNG, JPEG, HEIC) or video (.mov, .mp4, .m4v, chosen by extension). Required. |
--device, -d | A device id from bezelbub devices. Leave it out to detect from pixel size. |
--color, -c | A color name or id, case-insensitive. Defaults to the device's default color. |
--orientation | portrait, landscape, or auto (the default, taken from the input's shape). |
--background | A hex color (#RRGGBB or #RRGGBBAA) or transparent. Defaults to transparent for images and black for video. transparent on a video switches the output to HEVC-with-alpha .mov. |
--output-size | Scale the result, keeping the bezel's aspect: a width (1920), an exact WxH that matches the aspect, or a percentage (50%). Images go from 16 to 16,384 px, videos from 16 to 7,680 px. |
--output, -o | Where to write the result. Defaults to -framed.png, .mp4, or .mov beside the input. |
--webm | Also write a VP9/WebM copy with alpha. Video with --background transparent only; needs ffmpeg on PATH. |
--json | Print a JSON result on stdout instead of a text summary. |
devices lists the whole catalog (ids, display names, colors, orientations, screen sizes, and each display device's known capture sizes), or narrows it to the devices that fit an --input file or a bare --dimensions value. Filtering always exits 0. An empty matches array is the signal that nothing fits, and nearest (by aspect ratio) fills in when that happens.
frame --json prints one object:
{
"color" : "Cosmic Orange", "device" : "iphone17pro", "height" : 2760, "kind" : "image", "orientation" : "portrait", "output" : "/path/shot-framed.png", "width" : 1350 }
kind is "image" or "video". For video you also get "transparent": true|false and, when --webm ran, the "webm" output path. devices --json prints an array of {id, displayName, defaultColor, colors, landscapeOnly, hasPortraitBezel, screenWidth, screenHeight, captureSizes}. With --input or --dimensions it prints {width, height, matches, nearest} using the same device objects, and nearest is filled only when matches is empty.
Each failure type has its own code, so a script can branch without parsing stderr:
| Code | Meaning |
|---|---|
| 0 | Success |
| 1 | A flag value we couldn't parse, such as a malformed --background or --output-size |
| 2 | Unknown, ambiguous, or undetectable device. stderr lists the candidates. |
| 3 | Unknown color. stderr lists the device's valid colors. |
| 4 | We couldn't read the input image or video |
| 5 | Compositing or video export failed |
| 6 | We couldn't write the output |
| 7 | The --webm conversion failed because ffmpeg is missing from PATH or returned an error |
| 64 | Malformed arguments (the standard EX_USAGE) |
We built the CLI for non-interactive, programmatic use, by LLM agents (Claude Code, MCP tool wrappers, CI bots) as much as by people:
bezelbub devices --input shot.png --json to check the match, then bezelbub frame --input shot.png --json and read output from the result.This repo also includes a ready-made Claude Code skill at skills/bezelbub-cli/ that teaches an agent the whole wor
ตัดมาแค่ช่วงต้น อ่านต่อใน repo