VisBug chrome extension

Version: 0.3.55
VisBug
Open source browser design tools
4.83 Based on 216 user rates

What is VisBug?

VisBug is a developer tools chrome extension. it's a free extension , it has 100,000+ active users since released its first version, it earns an average rating of 4.83 from 216 rated user, last update is 570 days ago.


What’s new in version 0.3.55?

                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**            

How to install VisBug?

You could download the latest version crx file or older version files and install it.


Preview of VisBug


Technical Features:

  • Latest Version: 0.3.55
  • Requirements: Windows Chrome, Mac Chrome
  • License: Free
  • Latest update: Thursday, October 20th, 2022
  • Author: ArgyleInk

VisBug Available languages:

English.


FAQ


Reviews of visbug:


Moutasem Abdullatif March 30th, 2023
Moutasem Abdullatif

amazing


Henry Moran December 28th, 2022
Henry Moran

amazing tool and makes doing QA a whole lot easier. pair this with the Jam extension to create bug tickets and you're workflow will improve exponentially.


Molly December 12th, 2022
Molly

Seems really cool for what it is: a way to visually change a webpage using mainly keyboard commands. What it doesn't do is save your changes in any meaningful way: it'll be up to you to take a screenshot or find your code changes in either Chrome's built-in developer tools or another extension. The second thing it doesn't do super well is onboarding. There's a "training" mode to learn the key commands that's kind of nifty, but at first I couldn't figure out how to close it without refreshing the page and losing my changes. (Answer: I think Esc or just hitting the VisBug extension icon will do it.) Check out the master list of key commands https://github.com/GoogleChromeLabs/ProjectVisBug/wiki/Keyboard-Master-List , and then the wiki pages, which include training videos: https://github.com/GoogleChromeLabs/ProjectVisBug. But I felt like I was missing things, e.g. I discovered a /skeleton command in the search bar by accident that produces a wireframe, and then found other commands with the down arrow next to the search icon, but couldn't figure out how to un-apply those styles. I also couldn't quickly figure out when/what the newest updates were to see if/when save changes is coming. (Not suuuper familiar with GitHub, which I think is the target audience here.) I'm looking for something that can help me save my changes as code, so I'll be moving on. But I hope this continues to develop, since keyboard accessibility is soooo overlooked and under-supported. Tons of cool web projects only exist because the internet was allowed to become a Petri dish for spontaneous creativity and collaboration; imagine how much untapped potential, creativity, and new projects we'd have access to if an entire group of contributers weren't effectively locked out of using most of the web since its early days?

Read more review & comments of visbug