Opened 12 years ago

Closed 12 years ago

Last modified 8 years ago

#360 closed defect (fixed)

Icons for view source: Document, Activity Bundle

Reported by: erikos Owned by: eben
Priority: Unspecified by Maintainer Milestone:
Component: design Version: 0.83.x
Severity: Blocker Keywords:
Cc: garycmartin, tomeu Distribution/OS: Unspecified
Bug Status: Resolved

Description

The icons for the viewsource dialog have not been done yet. We really should get better icons in here.

Attachments (11)

document.svg (2.2 KB) - added by erikos 12 years ago.
document icon (write one without a pencil)
view_source.png (128.2 KB) - added by erikos 12 years ago.
view source of browse
view_source_document.png (134.6 KB) - added by erikos 12 years ago.
view source document of an html page in Browse
view_source_toolbar.png (13.6 KB) - added by erikos 12 years ago.
stroke=white and fill=black
view_source_toolbar2.png (11.6 KB) - added by erikos 12 years ago.
stroke=black and fill=white
view_grey1.png (9.7 KB) - added by erikos 12 years ago.
grey activity icon unselected
view_grey2.png (10.7 KB) - added by erikos 12 years ago.
grey - activity icon selected
view_trans1.png (11.0 KB) - added by erikos 12 years ago.
fill transparent
view_trans2.png (9.3 KB) - added by erikos 12 years ago.
fill transparent
view_colored.png (28.5 KB) - added by erikos 12 years ago.
colored activity instance version after discussing with eben
view-source.svg (1.5 KB) - added by eben 12 years ago.
Icon for view source button (and/or menu item)

Download all attachments as: .zip

Change History (23)

Changed 12 years ago by erikos

document icon (write one without a pencil)

comment:1 Changed 12 years ago by erikos

How about we use the Write icon without the pencil for the document icon?

comment:2 Changed 12 years ago by garycmartin

Sorry, I haven't seen the new viewsource dialogue at all (I'm 8.2.1 testing for a while), is there a quick screen grab of it anywhere? The above document.svg looks like a good generic document icon, if we get clever and have time later, it could be badged/branded/customised for different file types (FWIW I think icons would be nicer than 3 letter extension text labels, but I'm not so fussy).

Changed 12 years ago by erikos

view source of browse

Changed 12 years ago by erikos

view source document of an html page in Browse

comment:3 Changed 12 years ago by erikos

Gary, thanks for the quick reply.

I have attached some screenshots. Ok, so I think the docuemnt icon would work out. I have no idea yet for an activity icon (representing the activity bundle). I think there was some discussion about a generic activity bundle icon but not sure what the result was. Maybe it could just be the activity icon (in this case Browse) in black and white? Hmmm...

comment:4 follow-up: Changed 12 years ago by garycmartin

Ooo, interesting ;-)

Just a quick sanity check, the 2 tool bar buttons just perform a 'reveal tree view column', and a 'hide tree view column'?

If so we're really looking for a show/hide file list kinda icon/s. Could be a single toggle button with two states, or two radio buttons side by side (as you have now), or the more usual way to control a pane like that is just use the vertical split view separator handle (7 vertical handle dots I see on the view_source.png, but not the view_source_document.png).

Is there performance or other reason for wanting a view_source mode that shows both file tree and the selected document, and view_source_document mode that just shows the document? One argument would be if there were other 'view modes' planned and not just a binary 'show file tree vs. hide file tree'.

(BTW ... it's great to see the view source concept moving forward!)

comment:5 in reply to: ↑ 4 Changed 12 years ago by erikos

  • Cc tomeu added

Replying to garycmartin:

Ooo, interesting ;-)

Just a quick sanity check, the 2 tool bar buttons just perform a 'reveal tree view column', and a 'hide tree view column'?

Yes, when we select the document we only display the document (we only ever have one). The other view is basically what we find in the activity bundle. So we need a way here to select a different files.

If so we're really looking for a show/hide file list kinda icon/s. Could be a single toggle button with two states, or two radio buttons side by side (as you have now), or the more usual way to control a pane like that is just use the vertical split view separator handle (7 vertical handle dots I see on the view_source.png, but not the view_source_document.png).

So we have basically two views. One for the bundle and one for the document. There are some activities like terminal which only have the bundle view - since there is no associated document.

Is there performance or other reason for wanting a view_source mode that shows both file tree and the selected document, and view_source_document mode that just shows the document? One argument would be if there were other 'view modes' planned and not just a binary 'show file tree vs. hide file tree'.

I guess/hope I gave the answer already above :)

(BTW ... it's great to see the view source concept moving forward!)

Yeah, all tomeu's work I am just here for nitpicks and cleaning up :)

comment:6 Changed 12 years ago by eben

Why don't we go with a layout similar to the object chooser (http://sugarlabs.org/go/DesignTeam/Designs/Object_Chooser#04) which has radio buttons at the far left of the toolbar for choosing the "source". In the view-source case, this would be "bundle" or "document". As for the design:

  1. Activity: The label should read something like "Browse Activity Bundle Source". I the icon should be, as erikos suggested, the outline of the activity icon. (If you make it gray with black fill, it will still be visible when selected, akin to pulsing icons on launch)
  1. Document: The empty document icon works; using the default text icon would work as well, I think. I also think that adding an extension (yes, icons could be better, but as long as someone is viewing source anyway, exposing the actual type couldn't hurt) to the icon to indicate .py, .html, .css etc. would be beneficial. Finally, the label for the document might be settable by the activity, such that it reads "HTML Source for http://sugarlabs.com".

Changed 12 years ago by erikos

stroke=white and fill=black

Changed 12 years ago by erikos

stroke=black and fill=white

comment:7 Changed 12 years ago by erikos

  • Bug Status changed from New to Assigned

So, the problem we have is that the selected state of the radio toolbutton is grey. So we can not make the stroke color grey as well. Above screenshots are showing the standard colors (black outline on black background is unfortunate) and the inverted ones (inspired by the reload page button in Browse). What do you think?

I would push the document icon. Which name should I give it, document-generic, maybe ? And in which category do I store it (actions apps categories control device emblems mimetypes status)?

comment:8 Changed 12 years ago by erikos

A discussed with Tomeu I added the icon as document-generic in mimetypes. I have pushed the code to make use of it, code to use activity icon outline for Bundle Source and changed the order in the toolbar as Eben requested.

Changed 12 years ago by erikos

grey activity icon unselected

Changed 12 years ago by erikos

grey - activity icon selected

Changed 12 years ago by erikos

fill transparent

Changed 12 years ago by erikos

fill transparent

Changed 12 years ago by erikos

colored activity instance version after discussing with eben

Changed 12 years ago by eben

Icon for view source button (and/or menu item)

comment:9 Changed 12 years ago by erikos

Spec for the toolbar:

document available: [document, bundle, title]
no document available: [bundle, title]

The document is the default selection (the "first layer" of source). The default selection is the first item, why we have it left.

Strings for the palettes:

<activity name> Activity Bundle Source

<activity title> Instance Source

Icons:

The coloured activity icon represents the source of the activity instance. The outlined activity icon represent the bundle source for the activity itself, the template. We use this to help draw a distinction between the "activity instance" and the "activity bundle"

Using the uncoloured outline to represent the bundle vs the coloured icon to represent an instance has been the design cue all along.

comment:10 Changed 12 years ago by homunq

  • Summary changed from Icons for viewsource: Document, Activity Bundle to Icons for view source: Document, Activity Bundle

comment:11 Changed 12 years ago by erikos

  • Bug Status changed from Assigned to Resolved
  • Resolution set to fixed
  • Status changed from new to closed

Is in use already.

comment:12 Changed 8 years ago by godiard

  • Milestone 0.84 deleted

Milestone 0.84 deleted

Note: See TracTickets for help on using tickets.