Possible changes to the Moodle iconset

Possible changes to the Moodle iconset

by Patrick Malley -
Number of replies: 30
There is an issue in the tracker (http://tracker.moodle.org/browse/MDL-14361) to use the Tango iconset as the default Moodle icons in 2.0. It looks promising, but one question that came up was whether it would be best to change the Moodle icon naming scheme to the Tango naming specifications, OR rename all of the Tango icons we decide to use to the traditional Moodle naming scheme.

So, the question is: Do we rename the Tango icons or do we rename the Moodle icons?

It makes sense, if we are moving to use the Tango icons, to use their naming scheme. However, if we rename the core Moodle icons, all themes that use custom icons will need to do some renaming of their own to be recognized by the core code.

My thoughts are as follows:

Themes are going to break in bigger ways than this when moving to Moodle 2.0, so I don't see this as a major issue. Furthermore, I don't think there are enough themes out there using custom icon sets to justify not making the change IF the change is for the greater good. Furtherfurthermore, my bet is that most people who are using custom icon sets are doing so because they find the current set unattractive. This change should bring them back into the fold.
MDL-18872

Your thoughts would be greatly appreciated.
Average of ratings: -
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Dan Humpherson -
I agree to the move to Tango and a move to use there naming scheme.

Those using a custom icon set wont be put out a great deal, lets face it theres going to be plenty of changes with Moodle 2.0.

When the naming scheme has been defined for Moodle renaming your custom icon set will be a breeze, simply little script to batch rename.

I'd rather be using a standard icon set, as you've said most themes that include a custom icon set do so becuase there default set isnt all that great. Also many themes with a custom icon set do so to fit in with there theme design better.

One thing I'd just like to "put out there" if you like:

Are the Tango icons a bit dated themselves?

How neutral are the Tango icons?
Average of ratings: -
In reply to Dan Humpherson

Re: Possible changes to the Moodle iconset

by Patrick Malley -
Thanks for the input, Dan.

Regarding your question, I haven't really spent much time looking at the Tango icon set to say whether they are dated or not. I do know that they are a heck of a lot better than what we currently have.

I'd personally prefer we went with the Silk set from http://famfamfam.com as I think they're a bit more subdued, but understand the argument that Tango is a project with several authors while Silk is developed by one guy.
Average of ratings: -
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Helen Foster -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers Picture of Translators
Having browsed http://standards.freedesktop.org/icon-naming-spec/icon-naming-spec-latest.html, I'm in favour of renaming all standard icons in Moodle to use this naming scheme.

Just wondering whether it would be worthwhile adding a iconset selection UI to Moodle, to enable admins to select an iconset independently of the theme?
Average of ratings: -
In reply to Helen Foster

Re: Possible changes to the Moodle iconset

by Patrick Malley -
I like this idea. What you're proposing is possibly offering two or three different icon sets in the core, and then allowing the admin to select which one they'd like to use.

The only negative I can think of is that we don't currently have a very large selection of icon sets to include. I suppose we could always offer the historical set, the Nuvola set, the Tango set, and perhaps a Silk set.

But, with over 200 icons in Moodle currently, we'd need someone to manage these sets.
Average of ratings: -
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers
Some other questions to consider are:

1. Can we find a place to put the images that makes them easy to refer to from CSS style rules like background.

2. How should PHP code output icons. At the moment we have code everywhere that does echo '<img ... src="$CFG->pixpath .... Should we force people to always call a function, or something, instead?

3. Do we want, as a matter of course, to start using background-images for some icons instead of doing them all as <img. (I mean following the best practices for semantic HTML / accessibiltiy.)
Average of ratings: Useful (1)
In reply to Tim Hunt

Re: Possible changes to the Moodle iconset

by Patrick Malley -
1.) Their current default storage place inside the Standard theme folder makes sense.

2.) An icon function would make more sense than repeating this code all over the place.

3.) I don't think this is a good idea. We would have over 200 CSS images all being called from the theme folder. It makes more sense to me to have the module (or whatever else) call up the icon when it is used.
Average of ratings: -
In reply to Tim Hunt

Re: Possible changes to the Moodle iconset

by Mauno Korpelainen -
Good questions, Tim!

Themes could have the option to select for example sprites and background images / effects instead of img tags - if we had just some php code/variable/function as a "place holder" we could replace icon img tags with almost any kinds of tags we like in themes - not necessarely in core code...

We had some discussion about one sprite system in http://moodle.org/mod/forum/discuss.php?d=118018 but there are several good ways to (not) use icons (imgs)
Average of ratings: -
In reply to Mauno Korpelainen

Re: Possible changes to the Moodle iconset

by Patrick Malley -
That's something I didn't think about, actually. Thanks for bringing it up, Mauno. It would be nice to suppress the icons in the theme, if you wish.
Average of ratings: -
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Andrea Bicciolo -
Mixed about renaming. If we are going to break things anyway then no problem to rename icons according to known standard. On the counterpart Tango icons need to be reworked to be fully compliant (as described in MDL-14361), then it could be better rework them according to Moodle naming smile

My +1 for switching icons on/off on themes.
Average of ratings: -
In reply to Mauno Korpelainen

Re: Possible changes to the Moodle iconset

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers
Exactly, if we have a function like

$OUTPUT->icon(...);

then in the Moodle 2.0 world, themes can change what that does.


By the way, People keep saying that Moodle 2.0 will break everything to do with themes, but actually that is not the case. I am working quite hard to keep things backwards compatible (while adding the new functionality) and so far Moodle 1.9 themes still work. They may not work well, but they do not break too badly.
Average of ratings: -
In reply to Tim Hunt

Re: Possible changes to the Moodle iconset

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers
Thanks to my theme changes we are now getting a lot of errors in HEAD (Moodle 2.0 dev) where $CFG->pixpath is used before it is properly initialised. It is a real pain, and I can't think of an easy solution.

The best solution does seem to be using a function like $OUTPUT->icon(...);. However, there are 407 references to $CFG->pixpath in head, so making any sort of change will be painful. Also, we need to get from "something like $OUTPUT->icon(...);" to a specific plan before we can start changing it.

Please let's keep this thread going, to try to come up with the right specific plan.
Average of ratings: -
In reply to Tim Hunt

Re: Possible changes to the Moodle iconset

by Frank Ralf -
I would strongly recommend option 3) This will have a number of advantages:

1) leaner markup
2) easier themeability
3) better usability/accessibility

See User:Frank_Ralf/Semantic_HTML2 for an example (and http://moodle.org/mod/forum/discuss.php?d=126188 for a possibly related problem).

Loading all those icons from the theme folder should be no problem. Even all of the 32x32 icons in the Tango set are a mere 526 KB and they will be cached by the browser anyhow.

Using the Icon Naming Specification is also a good idea. If you use them as class names for all the items that should get an icon it's easy to apply the icons as background images via CSS.

Cheers,
Frank
Average of ratings: Useful (1)
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Martín Langhoff -
Is there a reasonable overlap between the Tango set and Moodle's icons?

One thing is to have to rename our existing icons (probably a good idea), but taking an iconset that is missing a good % of the icons we use means... drawing new icons in the style of the iconset. Sounds like a lot of work.
Average of ratings: -
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
Ping? Do we have any consensus here?
Average of ratings: -
In reply to Martin Dougiamas

Re: Possible changes to the Moodle iconset

by Frank Ralf -
Last time I looked at the Tango icon set I found it lacking some important icons for a LMS like Moodle (if I remember correctly).
Average of ratings: -
In reply to Frank Ralf

Re: Possible changes to the Moodle iconset

by Sam Hemelryk -
I have to agree with Frank here, I found tango to be lacking in regards to the specific needs Moodle has in regards to them.
That being said perhaps someone with a bit of graphical talent could bridge that gap!
Average of ratings: -
In reply to Martin Dougiamas

Re: Possible changes to the Moodle iconset

by Andrea Bicciolo -
Martin,
in my opinion icons and naming rules could be changed according to needs. An icons switch (on/off) from GUI woudl be great, and useful an iconset selector.
Average of ratings: -
In reply to Andrea Bicciolo

Re: Possible changes to the Moodle iconset

by Martin Butz -
Hi,

my two cents on 2 questions:

1) I do not approve of the idea to use the naming convention of the tango icon set. The set is primarily based on the idea to provide a coherent set for the Linux desktop. That's why you will find such categories like

  • actions
  • animation
  • apps
  • categories
  • devices
  • places
  • a.s.o.
I don't see the use for such a categorization within a web application. The renaming of the Moodle icons would make sense, if there were to expect lots of changes among the existing tango icons (and thus reason to update the set from time to time). I rather see a standalone Tango Moodle project, initially based on the SVG sources of the existing set and completed with the ones not available within the tango stock icons. There is not necessarily a need to be backward compatible with the original library. If - on the other hand - the Tango desktop project can use some of the Moodle icons, they will be able to rename and include these within the original Tango set.

2) The MoOdalis Tango Icon set includes - as far as I know - all icons needed for Moodle. I can provide the SVG sources for the 16x16 pixel icons for further development. Having said this let me add some notes on icon design as far as my experiences go:
  • There is some dicussion going on whether icon design should be based on vectors or pixels (see e. g. http://www.firewheeldesign.com/...).
  • I think, vectors are the best coice for several reasons; one reason: they make is easily possible to share and combine components and build a library as a base for community developement
  • It is not possible to simply reduce the size of a lets say 48x48 sized icon (being it SVG or a bitmap) and thus generate e. g. 22x22 or even 16x16 sized icons.
  • I approve of the following method:
    • SVG on a 48x48 grid as first draft (this is the size all original Tango icons are delivered within the folder "scalable")
    • SVG on a 16x16 grid for bitmap export of the 16x16 pixel icons (ensures sharp pixel based icons and makes f. e. the handling of shadows and transparencies much easier than working with pixels)
    • If other sizes will be needed: I usually derive an SVG version of the 48x48 scalable icon on a 22x22 grid and use this one for the 32x32 and the 22x22 pixel size
Roughly I created around 55 new icons for Moodle. The rest I already had created for the Odalis Icon set. Many of these overlap with the Moodle icons set. The reason why I almost created all icons new, was, to have a 16x16 based SVG base, which I could use for further developement.

Greeting
Martin Butz

Average of ratings: Useful (1)
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Stuart Lamour -
Picture of Plugin developers

Lots of talk about it and agree, moodle icon set should be svg or font based for scaling and pixel density of devices.

Also agree with Tim that spitting out actual image tags on screen is all a bit 1999. Some nice semantic classes (e.g. class='asset file png') would :

  • allow themes to specify icons
  • give much cleaner markup
  • sort out the accessibility issues in the current code (especially for section resources/activities, which are quite painful in screen readers)

Also some talk about open source icon sets - i.e. you don't have to open a .doc or .docx document with a certain microsoft product - as moodle is open source we can support this with unbranded icons just as open source OS use.

Posted this in http://moodle.org/mod/forum/discuss.php?d=204278 already, but lovely font based icon set here - http://gregoryloucas.github.com/Font-Awesome-More/ i'd be more than happy if moodle came with.

cheers

stuart

 

 

 

Average of ratings: -
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Stuart Lamour -
Picture of Plugin developers

more nice icons from the zurb foundation framework

http://www.zurb.com/playground/foundation-icons

Average of ratings: -
In reply to Stuart Lamour

Re: Possible changes to the Moodle iconset

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Moodle HQ are on with changing the icons.

Thanks for the link Stuart. smile

Average of ratings: -
In reply to Mary Evans

Re: Possible changes to the Moodle iconset

by Stuart Lamour -
Picture of Plugin developers

Mary - have you got a link to the tracker for this?

Average of ratings: -
In reply to Patrick Malley

Re: Possible changes to the Moodle iconset

by Stuart Lamour -
Picture of Plugin developers

Blog post on this very thing - 

http://blogs.sussex.ac.uk/elearningteam/2012/08/22/moodle-icons/

as always, comments very welcome.

Average of ratings: -
In reply to Stuart Lamour

Re: Possible changes to the Moodle iconset

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

I found a few typos! smile

Average of ratings: -
In reply to Mary Evans

Re: Possible changes to the Moodle iconset

by Stuart Lamour -
Picture of Plugin developers

i'm good at them - copy the post into google docs, and send it back with marks out of ten smile

does the way we are moving at Sussex make sense though? is it what we want for the future of moodle? i guess thats what i'm really interested in.

Average of ratings: -
In reply to Stuart Lamour

Re: Possible changes to the Moodle iconset

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

I'd go for simplicity everytime. To have a set of icons that you can restyle if need be would be great, rather than the long winded method we have at present. However, the way Moodle works I don't think this is going to happen just yet, but would be nice if it could be implemented in 2.4.

Average of ratings: -
In reply to Stuart Lamour

Re: Possible changes to the Moodle iconset

by David Scotson -

Interesting blog post, certainly chimes with a lot of my thoughts.

My own take is that there's so many obscure icons in Moodle that the very first step is to ask "do we need this?" and be fairly brutal about answering it. For example an icon for each question type (see how many of these your colleagues can guess from just the icon: /admin/qtypes.php) many of which I think we could live happily without.

After you identify an non-essential icon your options then are:

  • delete it entirely
  • replace it with an icon shaped space (if there's other icons and it would make the list look wobbly)
  • replace it with a short bit of text and style it to look more dramatic (e.g. for signaling an XSS threat I've replaced a red triangle icon with red "XSS" text styled with Bootstrap's "label" class)
  • replace it with a more generic icon (e.g. I'm using the "person" icon from Bootstrap to represent various people, role or group related things throughout moodle and relying on context to make it obvious)

If you don't do this first step then there's just too many icons to be able to do anything sensible with them. I think it would be a good thing if people got together and agreed what icons should stay rather than everyone doing their own thing. At the moment I've got special case logic all over the place to figure out what an icon's being used for and what to replace it with. Often in code you've only got the icon name and the same icon is used in different contexts, which you might want to do different things with.

For the icons I'm keeping I'm using Bootstrap's <i class="icon-*>text, using their sprite image and mixing in their .hide-text class that makes the text tiny as I've read the technique of shifting it far off to one side can have performance impacts on early iPads and low end phones.

I'm going to try adding adding font awesome now that i've rewritten my theme with LESS but I'm not sure how that will mesh with the accessible text.

Average of ratings: -