plasma-extensions / plasma-widget-paparazzi

Plasmoid to quickly launch Spectacle from the system tray.
GNU Lesser General Public License v3.0
1 stars 0 forks source link

Functionality Brainstorm #2

Closed star-buck closed 6 years ago

star-buck commented 8 years ago

note screencloud: http://www.omgubuntu.co.uk/2016/06/force-install-screencloud-ubuntu-16-04

basic mockup (icons are not matching modes really): screenwidget-tool

star-buck commented 8 years ago

also, if we simply invoke spectacle main window after taking a screenshot, we wouldnt need to autosave it nor need the image format, as it allows to capture things quickly and then later decide how to save it. So maybe the only other option we would need is "autosave" ON/OFF and only if autosave = ON then show image format option?

UriHerrera commented 8 years ago

We must take into consideration that interface guidelines about plasmoids aren't complete and that none of the default plasmoids that we can use as examples use buttons in this way so it's important that we maintain consistency with the use and execution of UI elements with the default plasmoids.

For reference this is the image: Mockup#2 And this is the previous iteration: Mockup#1 Settings window for the plasmoid:


We'd want to avoid duplicated design choices so we'd want to make the plasmoid convenient for the user so that it wouldn't be necessary to open the main application window.

For the user to use the plasmoid this should be more convenient than using the keyboard shortcut. In the mockups this plasmoid lets the user choose the image format, this feature is from Spectacle but it isn't directly available in the main application window, the plasmoid would expose this feature directly to the user. Making it convenient for the user to effect a new action after taking the screenshot like editing the image or sharing it.

Auto saving would be another feature of the plasmoid. The feature would be on by default but it can be turned off. Spectacle makes the user manually select the option to save the image however the plasmoid would offer to the user the convenience of saving the image after taking it.


If we remove the buttons we could use toolbuttons like those in the media player plasmoid. These buttons however don't use text labels but can use tooltips like this:

Thing is that these buttons are larger than normal but if we use them in the correct size they'd be too small and there would be a lot of extra space. To add more features to the plasmoid and make up for that extra space for example we could add a sort of preview of the screenshot like this:

In the mockup I cut the height of the preview image but if possible the preview would show the scaled image to fit the size of the plasmoid window and on the right side a scrollbar to move the view up and down accordingly. The open button would open the saved screenshot in Gwenview or whatever the user has set as the default application for the selected file type. The dark mask over the preview is so that the name of the preview is displayed over the image and whether the screenshot is light or dark in color the text would still be visible.

What do you think?.

UriHerrera commented 8 years ago

I made this right now:

We could move the drop down where the user selects the image format to the plasmoid settings window and just show the modes and a larger preview.

If the user hasn't made a screenshot the plasmoid would look like this:

star-buck commented 8 years ago

So how about simply having the three buttons from this: After you take a screenshot it shows filedialog or autosaves file, depending on the settings in configuration. Imo it doesnt need to show a preview.

UriHerrera commented 8 years ago

Something like this?:

It looks quite empty to be honest. Having only three buttons on the media player plasmoid works because there's an expectation of content above them like the song information and the album art. In this case there wouldn't anything that fills that empty space since there wouldn't be any drop downs, previews or other buttons. But if you agree with this design of course we'll go for it.


If auto saving is on then the plasmoid would show a notification letting the user know that the screenshot was successfully taken and where it was saved to.

If auto saving is off it would show a file dialog, asking the user where to save the file and no notification would be used.

star-buck commented 8 years ago

why not make the icons bigger and the popup smaller?

Sidenote: i find it quite bad design to squeeze everything in a onesizefitsall popup, it doesnt really even work for network (on an odroid its nearly becoming unusuable, but thats another topic).

So when someone adds this widget to the panel/toolbar have it popup small.

Please think these addons or widgets as experimental, its nothing official plasma, its something that should not need to fit any norm here so we can try out things also like bigger notification area, etc., thanks.

UriHerrera commented 8 years ago

Well, if we can make our own design choices then yeah it can look however we want it to. I'll design one that doesn't use existing plasmoids as examples.

UriHerrera commented 8 years ago

OK here's something:

The size of the buttons and the icons is the same size that the desktop applications use in their toolbars. The size of the text in the labels above them is the same as in the desktop (10 pts.) The full name of the action doesn't fit in the label so a friendlier and shorter label is used, the full name of the action is instead displayed in the tooltip. The blue title area is to make the plasmoid different in the sense that instead of the plasmoid being sort of an extension it is own little application.

What do you think?.

star-buck commented 8 years ago

That looks nice, so how fast can you get this implemented?

UriHerrera commented 8 years ago

That'd be up to @azubieta to begin implementing. I'm still learning C++. But now that we've got a design that you'd be fine with he can get started.

azubieta commented 8 years ago

Hello! Sorry for being away, I was having some troubles with my laptop, I'll try to have a prototype for tomorrow. Best

azubieta commented 8 years ago

Ok, we are taking screeshots already. Let's do the configuration window.

azubieta commented 8 years ago

Well @UriHerrera @star-buck now it's all done. The only thing left is the blue header which turned to be a bit tricky to achieve. screenshot_20160429_215144 As you can see in the capture there is a margin around the widget content which I was unable to remove because it's created by the plasma panel. My suggestion is to look for a way to avoid it, change a little the original design and move forward. Otherwise I think that will be required to alter the plasma panel code.

Any thoughts about it ?

UriHerrera commented 8 years ago

I'd figured that there would be something that wouldn't allow us to implement the mockup 100%. So in light of that I suggest we do without the blue header otherwise @azubieta mentions we literally could be running our own version of the panel which would be bit too much just to make the plasmoid use the blue header.

On the image I added the padding that the plasmoid should use to make it more aesthetic and I increased the size of the font in the title to 18 pts, the rest is unchanged. With these changes we retain the design we've been going for and we workaround that issue.

azubieta commented 8 years ago

At last I found a way of doing it. Plase check it.

UriHerrera commented 8 years ago

Yep working nicely here, awesome!.