Universal Admin Icon Set

33 views
Skip to first unread message

Danayel

unread,
Feb 1, 2011, 1:03:00 AM2/1/11
to Joomla 3PD Extension Standards
The first standard I would like to kick off is that of a universal
icon, and possibly interface image set for the admin interface.

This probably isn't possible for the front end, thought it would be
nice for consistency, but it should be more than possible for the
Admin to define a single icon to be used for the various screens we
need to create.

The purpose of this set is to create consistent interfaces, the
functions of which are familiar and easily recognizable across
extensions.

Because of this, each icon should (must?) have a single fixed use, and
as we build extensions with screens or functions outside of the icon
list, we should contribute those icons (unless company specific e.g. a
product logo) back to the set so that others can use them in the
future.

The set should be licensed GPL or another open license so that,
similar to the Tango project.

I personally really like everything about the Tango project, and feel
we should model ourselves off that except fro one thing : I don't
really like the actual icons in the the set so far, and wouldn't like
to use them in my projects. I feel they are a tiny bit too cartoon-ish
and the colors look a little dated.

Their standards however are quite clear and easy to follow:

http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines

The current icon set is a result of those guidelines, so perhaps we
need to come up with different actual guidelines, but simply follow
the organization that the tango project has - e.g.

- a color pallet
- basic style elements
- style attributes
- perspective
- lighting angle
- sizes
- naming conventions
- file formats
- pluralization (i.e. showing single vs multiple consistently, such as
user and users. This is my original suggestion)
- meta information
- support files
- common mistakes

Side Note: Using the Tango project as our foundation, and contributing
to it instead is an option however if we can get their approval to do
so.

Here are some icons/sets I feel we could start with:

- Emoticons set
- Editor set
- User / Users / User groups / User Preferences
- Categories / Tags
- Mime Types / File Types
- About / Information / FAQ / Questions / Help
- Templates / Styles / Themes
- Configuration / Preferences / Permissions / Options
- Security / Login / Password
- Enabled / Disabled / Yes / No / Maybe
- Interface Elements : check box / switch / radio button / drag /
reorder / resize
- Language

David-Andrew de Boer

unread,
Feb 16, 2011, 7:57:15 AM2/16/11
to joomla-3pd-exte...@googlegroups.com
I agree, like Tango, don't like the actual icons.

I use these icons in our extensions: http://famfamfam.com/lab/icons/silk/

They only come in one size at the moment, so we would need to create the larger counterparts. And there are extended sets available online to extend the first 700 icons listed above to over 1000 icons, all free. 

Icons/sets to possibly add (used in my extensions):
- preview
- download
- e-mail + resend email


Daniel Chapman

unread,
Feb 16, 2011, 8:51:01 PM2/16/11
to joomla-3pd-exte...@googlegroups.com
I have used silk a few times myself. I agree it is a good set for the most part.

I would rather not use an existing set if it can be helped, because the copyright may cause problems. However setting up our style guide to match a good looking set is definitely a good idea.

I am a big fan of the style used by the Pack Rat Facebook game - see them here http://bluwiki.com/go/PackRat

They used to have a great site, iconbuffet, but sadly they seem to have closed it down in favor of the game.

So what sizes do we need ?
  • 16px
  • 32px
  • 48px
  • 64px
  • 126px
  • 256px
Should we go higher? Can we reduce this list? Other sizes?

Ideally, we want to have as few sizes as we need. I think we usually have 3 sizes in our extensions for icons:
  • 16px for the menu
  • 32px for the toolbar
  • 48px for the dashboard
We have some larger images, but these are usually logos and so not part of the shared set. Honestly I can't see us needing >48px but I am open to being convinced otherwise.


David-Andrew de Boer

unread,
Feb 18, 2011, 5:31:29 AM2/18/11
to joomla-3pd-exte...@googlegroups.com
Is there a direct link to the Packrat icons? 

I agree, that in the best case we would develop a new icon set. Possibly a set that looks a bit like the Joomla! 1.5 and/or Joomla! 1.6 icons, to stay close to what users know. 

Or use the current Joomla! 1.5 icons. Most people know those. And when the 1.6 icons are getting to be more familiar, we switch the framework to those.

Or, even better, let the framework use the Joomla! default icons depending on the version its installed on. 

==

Agree, think 16, 32, 48 is enough. 

Daniel Chapman

unread,
Feb 20, 2011, 9:41:25 PM2/20/11
to joomla-3pd-exte...@googlegroups.com
Re pack rat - just click any of the links on that page to see one of the sets. There are hundreds of icons, so there is no one page with them all.

Unfortunately the style of the icons in 1.5 and 1.6 differ quite dramatically, so anything that matched one of them would not match the other. I personally don't like the 1.6 icons much, as a few of them (e.g. the cancel/not enabled button) seem to have no obvious meaning if you look at them without already knowing their function.

e.g. a red X means something like : NO, CANCEL, ABORT etc. to everyone, but a red circle with a hole in the middle???

There are two main conflicting opinions about how we should go about this, each with their own problems:

Use Original Icons

Some would say that we should stick to the original icons where possible and not reinvent the wheel, as this makes it easier for users to identify our icons, and they will match those in various books and online guides.

They will also suit each CMS version more appropriately.

This however is difficult across versions, as each version has a different style, and we don't really want to maintain multiple styles of icons.

All New Icons

We could create a completely new set of icons, and that way we would get a consistent look and feel across all extensions on all platforms. We also only need one style guide and to maintain one set of icons.

However, they won't fit the default admin template exactly, and may initially confuse some people.

--------------------

I personally think we would be better off with a completely new set, then what we can do is if we get enough uptake with our icons, then we could make a push to get them made into the default icons for the admin.

A new set will be a lot easier to maintain, to update, and to convince people to make use of. Plus we could always set up a stand-alone project for it like Tango, and possibly get other CMSes using it.

Daniel Chapman

unread,
Feb 20, 2011, 9:45:50 PM2/20/11
to joomla-3pd-exte...@googlegroups.com
Also it is worth clarifying that part of the reason I am in favor of a new set is because most extension developers will need their own icons for different things that simply aren't covered by the default Joomla sets.

This would mean that we either have mismatched icons within our toolbars and extensions (yuck)  or we have multiple sets of icons, each designed to match a Joomla version, which would be a HUGE amount of work if you also include the various distributions of Joomla, and then there are the different admin templates and so on...

Matt Thomas

unread,
Feb 21, 2011, 7:46:46 AM2/21/11
to joomla-3pd-exte...@googlegroups.com
A related important item is to make sure that all developers include translatable language strings with the icons they use. That way, regardless of which icon they use, users will be able to see familiar labels.

Best,

Matt Thomas
betweenbrain | Construct Unified Template Framework for Joomla! 1.5, 1.6, Molajo and Nooku Server

Daniel Chapman

unread,
Feb 24, 2011, 11:51:55 PM2/24/11
to joomla-3pd-exte...@googlegroups.com
Excellent point. Given that the intention is for each icon to have a set purpose, and not be used for other purposes (or at least a minimum of other purposes) we should be able to associate a text string with them.

The downside though is that then there is only a few translated strings, and when new icons are added they will need to be updated with all the languages, or we will end up with a mixed mess of which strings are actually available.

At the very least we will label each icon in English and if necessary people can attach a 1-2 sentence description describing what the icon is for.
Reply all
Reply to author
Forward
0 new messages