VisBug
Open source browser design tools
VisBugとは何ですか?
VisBugはhttps://visbug.web.appによって開発されたChromeの拡張機能で、その主な機能は「Open source browser design tools」です。
拡張機能のスクリーンショット
VisBug拡張機能のCRXファイルをダウンロード
VisBug拡張子のファイルをcrx形式でダウンロードし、ブラウザにChrome拡張機能を手動でインストールするか、crxファイルを友達と共有して簡単にChrome拡張機能をインストールします。
拡張機能の使用方法
Open source web design debug tools built with JavaScript: a FireBug for designers.
- Point, click, move, resize & tinker
- Edit or style any page, in any state, like it's an artboard
- Inspect styles, spacing, distance, accessibility and alignment
- Nitpick layouts & content, in the real end environment, at any device size
- Leverage adobe/sketch skills
- Edit text, replace images
- Design within the chaos: use production or prototypes and the odd states they produce, as artboards and design opportunities
- Design while DevTools simulates latency, i18n, media queries, platform constraints, CPUs, screensize, etc
- Make more decisions on the front end of your site/app (a11y, responsive, edge cases, etc)
- No waiting for developers to expose their legos, just go direct and edit the end state (regardless of framework) and execute/test an idea
Give power to designers & content creators, in a place where they currently feel they have little to none, **by bringing design tool interactions and hotkeys to the browser** 拡張機能の基本情報
| 名前 | |
| ID | cdockenadnadldjbbgcallicgledbeoc |
| 公式URL | https://chromewebstore.google.com/detail/visbug/cdockenadnadldjbbgcallicgledbeoc |
| 説明 | Open source browser design tools |
| ファイルサイズ | 5.35 MB |
| インストール数 | 187,716 |
| 現在のバージョン | 0.3.55 |
| 最終更新日 | 2022-10-21 |
| 公開日 | 2020-06-26 |
| 評価 | 4.82/5 合計 225 レビュー |
| 開発者 | https://visbug.web.app |
| Eメール | [email protected] |
| 支払い方法 | free |
| 拡張機能のウェブサイト | https://github.com/GoogleChromeLabs/ProjectVisBug |
| ヘルプページのURL | https://github.com/GoogleChromeLabs/ProjectVisBug/issues |
| 対応言語 | en |
| manifest.json | |
{
"update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
"name": "VisBug",
"version": "0.3.55",
"description": "Open source browser design tools",
"manifest_version": 2,
"icons": {
"128": "icons\/visbug.png"
},
"permissions": [
"activeTab",
"contextMenus",
"storage"
],
"background": {
"persistent": true,
"scripts": [
"visbug.js",
"contextmenu\/launcher.js",
"contextmenu\/colormode.js",
"contextmenu\/colorscheme.js"
]
},
"browser_action": {
"default_title": "Click or press Alt+Shift+D to launch VisBug",
"default_icon": {
"128": "icons\/visbug.png"
}
},
"web_accessible_resources": [
"tuts\/*",
"toolbar\/*"
],
"commands": {
"_execute_browser_action": {
"suggested_key": {
"windows": "Alt+Shift+D",
"mac": "Alt+Shift+D",
"chromeos": "Alt+Shift+D",
"linux": "Alt+Shift+D"
}
}
}
} | |