Alternative wireframe
Wireframe showing the Extension Manager as a full-screen view. In the workflow described below we've shown it as a side panel, but it might make sense to give it more breathing room. The overall workflow would be the same either way.
Main workflow starts below
John opens the Extension Manager by clicking on the icon at the top of the toolbar, and the panel opens on the right.
The little gray boxes in the upper left of each item are supposed to represent icons for each extension. I actually don't know if we want icons--we had talked about using screenshot thumbnails, but those wouldn't really fit in this form factor.
The panel feels a little crowded--this would be a reason to go with the full-screen alternative shown above.
John notices the GitHub Integration plugin, which looks interesting, so he clicks the "Install" button. The button grays out and changes to "Installing...", and a progress bar appears in the status bar at the bottom of the window. The installation happens in the background so he can continue to do other things.
Now John starts typing "coffee" into the search box, and as he types the list is filtered to show the extensions that match his search string.
He clicks on one of the items, and it expands in place to show more info, including screenshots and version info.
He likes all of these extensions, so he clicks on the "Install" button on each of them, and they all start installing.
Once installed, the "Install" button is replaced with Settings, Disable, and Remove buttons.
The lack of real estate is definitely an issue here. I had to remove the category in order to make room for the buttons. That could be alleviated by using icons for the buttons instead of textual buttons, but that could make them more obscure, and also seems inconsistent with the fact that the "Install" button was textual in the original view.
Also, there wasn't a natural place to put a more visual indication that these extensions are installed. In later screenshots I cheat and replace the icon area with a checkmark.
John configures the Format CoffeeScript extension by clicking on the Settings button. The settings show up in a popover.
This could be a modal dialog instead, or we could decide to integrate the settings with a global preferences dialog.
Later, after using the extensions for awhile, John encounters a problem with the Format CoffeeScript extension. He opens the Extension Manager panel again and clicks on the "Installed" tab to see his installed extensions.
He clicks the "Disable" button on the Format CoffeeScript extension. The icon changes to show that the extension is disabled, and the "Disable" button becomes "Enable".
I removed the Settings button as a bit of a cheat so there was a place to put the Update button later, but of course that doesn't really make sense now that I think about it since enabled extensions need a place for an update button too.
John also expands the item so he can access the "Report a Problem" button, which lets him report a bug.
Again, this was because there wasn't a way to fit this button in with all the other buttons in the unexpanded view. It definitely feels like we'd need icon buttons if we go the panel route.
John also likes the CoffeeScript Quick Open extension, so he clicks on the rating to give it 5 stars. The rating turns orange to show that this is his own rating.
In order to rate the extension, John has to log in with a service. He chooses Facebook.
The next day, John opens Brackets and sees that there's a "1" badge on the Extension Manager icon in the toolbar, indicating that a new update is available.
He opens the Extension Manager and sees a notification at the top that an update is available. He can also scan the list to see that the Format CoffeeScript extension has an update icon.
