BlueStork UI Elements Help

[Ron Severdia]

Once the new JForm library has been implemented in trunk, there will
be some UI cleanup to be done in the coming days. I'm carved out some
time to take care of those issues, but I'd appreciate some help with
the icon system. I've created some consistency in the interface and
the look & feel, but like someone to take on creating an icon system
based on the beginnings that are there now. Some requirements are:

1) Match existing look & feel of the BlueStork template.
2) Be created in a vector-based application like Adobe Illustrator.
3) Define specific pictograms according to context.
4) Design for 16x16, 32x32, and 48x48.
5) Take universal symbolism into consideration.

If you're interested, post here and we'll get going. :)

[Lou]

Im interested - please let me know what elements are needed ~ Lou

--
You received this message because you are subscribed to the Google Groups "Joomla! CMS Development" group.
To post to this group, send an email to joomla-...@googlegroups.com.
To unsubscribe from this group, send email to joomla-dev-cm...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/joomla-dev-cms?hl=en-GB.

[joomlapraise]

Hey Ron,
Our team from JoomlaPraise/AdminPraise would love to help out on all
these things (and more if possible). We've discussed the core admin
template a ton in public recently and are excited to get the
opportunity to contribute instead of just talking about it on blog
posts and twitter ;)
-Kyle

[joomlapraise]

Hey Lou,
Here's what we see:

The main icons missing I see are under the core components:
- Banners
- Contacts
- Messaging
- News Feeds
- Web links

Suggestions for changes:
- Redirects could use a new icon since the current one if for maximize
- Login Lock icon: seems like it should be matte since the rest are
matte.
- Modules icon: is now a database icon and should probably by
something else like a puzzle piece or blocks
- Cancel icon: should prob be updated to be red matte as well
- Delete Icon: should prob be update with the matte blue Trash icon
instead of the shiny silver one
- Config icon: larger version should match the blue/orange version
under the Site menu item
- Cpanel icon: is currently a refresh icon, should be something like a
joystick or home icon

I'm sure I'm missing some but that's what I see at first glance.
-Kyle

On Mar 23, 4:09 pm, Lou <loudo...@gmail.com> wrote:
> Im interested - please let me know what elements are needed ~ Lou
>

> On Tue, Mar 23, 2010 at 9:06 PM, Ron Severdia <ron.sever...@joomla.org>wrote:
>
> > Once the new JForm library has been implemented in trunk, there will
> > be some UI cleanup to be done in the coming days. I'm carved out some
> > time to take care of those issues, but I'd appreciate some help with
> > the icon system. I've created some consistency in the interface and
> > the look & feel, but like someone to take on creating an icon system
> > based on the beginnings that are there now. Some requirements are:
>
> > 1) Match existing look & feel of the BlueStork template.
> > 2) Be created in a vector-based application like Adobe Illustrator.
> > 3) Define specific pictograms according to context.
> > 4) Design for 16x16, 32x32, and 48x48.
> > 5) Take universal symbolism into consideration.
>
> > If you're interested, post here and we'll get going. :)
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "Joomla! CMS Development" group.
> > To post to this group, send an email to joomla-...@googlegroups.com.
> > To unsubscribe from this group, send email to

> > joomla-dev-cm...@googlegroups.com<joomla-dev-cms%2Bunsu...@googlegroups.com>

[Lou Griffith]

Great - I will start on this asap!

Lou Griffith
TagTeam Global

[Andrea Tarr at Tarr Consulting]

I happen to notice another one you might want to look at:

The "Install" under Discover in the Extension Manager. It's using the same
icon as the Options. The "Update" is using the same icon.

Andy

Andrea Tarr
Tarr Consulting

at...@tarrconsulting.com
413-427-0759
www.tarrconsulting.com

joomla-dev-cm...@googlegroups.com<joomla-dev-cms%2Bunsubscribe@goo

glegroups.com>
> > .
> > For more options, visit this group at
> >http://groups.google.com/group/joomla-dev-cms?hl=en-GB.

--

You received this message because you are subscribed to the Google Groups
"Joomla! CMS Development" group.
To post to this group, send an email to joomla-...@googlegroups.com.
To unsubscribe from this group, send email to

joomla-dev-cm...@googlegroups.com.

[Lou]

Should I add them as I go - or should I create a folder on my box.net account so everyone can access? Also are you joomlapraise folks going to work on it as well or shall we divide and conquer? ~ Lou

[Ron Severdia]

I'd recommend creating an asset matrix first. I'd like to keep the
existing icons as a baseline so far and focus on the tons of others
needed (though I'm open to ideas for refinements). I'd advise looking
in the BlueStork template folder to see the existing icons because
there are icons there which aren't yet in the interface because the
code needed to display them hasn't been written yet.

The process should go something like this: You post an image that has
a number of icon ideas (let's say around 10 at a time) in the three
sizes needed. Post that image in this group and paste a link in this
thread. Let's establish a specific design/feedback process period. So
take 4 days to do a batch and post them here. Wait four days for
feedback, then post another batch (or let me know what combination of
days for each design and feedback periods works...try to keep them
short and in bite-sized chunks as opposed to marathon efforts). That
way, all the icons can be done in a manageable period of time.

I can't stress the quality enough here. No free icon sets. Joomla is a
unique CMS with a unique style and unique needs. The general look &
feel is pretty much established, but the icons create a specific
visual language and need to be cohesive. This is very important.

Thanks! :)

[Lou]

Okay - sounds like a plan - thanks!!!

--

[Lou]

This is just a first one - please give me your thoughts and I will start producing the rest. Just want to make sure I am going down the right path before I get too far.

[Christophe Demko]

It could be very cool for thirdparty extension developer if bluestork
icons will be available in svg format and licensed under LGPL

On 24 mar, 17:08, Lou <loudo...@gmail.com> wrote:
> This is just a first one - please give me your thoughts and I will start
> producing the rest. Just want to make sure I am going down the right path
> before I get too far.
>

> On Wed, Mar 24, 2010 at 5:46 AM, Lou <loudo...@gmail.com> wrote:
> > Okay - sounds like a plan - thanks!!!
>

> >> joomla-dev-cm...@googlegroups.com<joomla-dev-cms%2Bunsu...@googlegroups.com>

> >> .
> >> For more options, visit this group at
> >>http://groups.google.com/group/joomla-dev-cms?hl=en-GB.
>
>
>

>  icon_news_feed_16.png
> 77KAfficherTélécharger
>
>  icon_news_feed_32.png
> 79KAfficherTélécharger
>
>  icon_news_feed_48.png
> 80KAfficherTélécharger
>
>  icon_news_feed_64.png
> 84KAfficherTélécharger

[Ron Severdia]

@Lou

That approach isn't consistent with the existing UI. There shouldn't
be any text (or a VERY compelling reason to have it). The lines are
too bold, the drop shadow is too strong, and a number of other things
including the aspect ratio and the design doesn't work at smaller
sizes. Please use the existing color palette as well. The icons have
more of a Web 2.0 look (though I hate that term and it means whatever
the latest crackpot idea is...but I digress).

@Christophe

If the icons are done in Illustrator, it's an easy export to SVG.

[Lou]

ok - i will try again.

--
You received this message because you are subscribed to the Google Groups "Joomla! CMS Development" group.
To post to this group, send an email to joomla-...@googlegroups.com.

To unsubscribe from this group, send email to joomla-dev-cm...@googlegroups.com.

[joomlapraise]

I think it could have text like the Article and New Article icons.
Here's my comments direct to Lou:

"My only critique is that it could match the New Article and Article
Manager a bit more - matching the gradient and lightening up the
"text" and borders a bit."

[joomlapraise]

Agree on this, though I think they'd have to be GPL like Joomla,
right?
-Kyle

[Kyle Ledbetter]

Here's a take on the Login Lock that would more closely match the matte blue/orange of bluestork. The current is 152x137, but I did 130x130 so it could be a square image, Thoughts?

-Kyle

[Kyle Ledbetter]

And here's an idea for a Module icon instead of the current database icon for modules.
-Kyle

[Kyle Ledbetter]

And something like this for Banners? :) Does that invoke the idea of a banner to you?
-Kyle

[Louis Landry]

I definitely dig the module one... I'm not sure if i'd connect the banner dots on that one if i didn't already know that's what it was.  Digg the thinking though.

- Louis

On Thu, Mar 25, 2010 at 6:23 PM, Kyle Ledbetter <pixel...@gmail.com> wrote:

And something like this for Banners? :) Does that invoke the idea of a banner to you?

-Kyle

--

You received this message because you are subscribed to the Google Groups "Joomla! CMS Development" group.
To post to this group, send an email to joomla-...@googlegroups.com.

To unsubscribe from this group, send email to joomla-dev-cm...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/joomla-dev-cms?hl=en-GB.

--
Development Coordinator
Joomla! ... because open source matters.
http://www.joomla.org

[Lou]

Kyle these look great. I hope they fit the bill that Ron is looking for. ~ Lou

On Thu, Mar 25, 2010 at 11:23 PM, Kyle Ledbetter <pixel...@gmail.com> wrote:

And something like this for Banners? :) Does that invoke the idea of a banner to you?

-Kyle

--

[joomlapraise]

thx Lou, I hope they fit the bill for what the Joomla community is
looking for ;)

On Mar 25, 6:29 pm, Lou <loudo...@gmail.com> wrote:
> Kyle these look great. I hope they fit the bill that Ron is looking for. ~
> Lou
>

> On Thu, Mar 25, 2010 at 11:23 PM, Kyle Ledbetter <pixelpra...@gmail.com>wrote:
>
> > And something like this for Banners? :) Does that invoke the idea of a
> > banner to you?
>
> > -Kyle
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "Joomla! CMS Development" group.
> > To post to this group, send an email to joomla-...@googlegroups.com.
> > To unsubscribe from this group, send email to

> > joomla-dev-cm...@googlegroups.com<joomla-dev-cms%2Bunsu...@googlegroups.com>

[joomlapraise]

@Louis yeah, an icon for a banner is tough... open to ideas on that.
Certain icons are always tough, like the Menu icon, the Preview icon
(always a magnifying glass or a monitor). It'd be neat to get clever
icons that are also easy to understand.
-Kyle

On Mar 25, 6:24 pm, Louis Landry <louis.lan...@joomla.org> wrote:
> I definitely dig the module one... I'm not sure if i'd connect the banner
> dots on that one if i didn't already know that's what it was.  Digg the
> thinking though.
>
> - Louis
>

> On Thu, Mar 25, 2010 at 6:23 PM, Kyle Ledbetter <pixelpra...@gmail.com>wrote:
>
> > And something like this for Banners? :) Does that invoke the idea of a
> > banner to you?
>
> > -Kyle
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "Joomla! CMS Development" group.
> > To post to this group, send an email to joomla-...@googlegroups.com.
> > To unsubscribe from this group, send email to

> > joomla-dev-cm...@googlegroups.com<joomla-dev-cms%2Bunsu...@googlegroups.com>

[Lou]

haha - yeah that too ;)

To unsubscribe from this group, send email to joomla-dev-cm...@googlegroups.com.

[Kyle Ledbetter]

Maybe something like this for Contacts?
-Kyle

[Lou]

What about a "$" for the banner icon - since most of the banner for outside ad dollars? ~ Lou

On Thu, Mar 25, 2010 at 11:48 PM, Kyle Ledbetter <pixel...@gmail.com> wrote:

Maybe something like this for Contacts?

-Kyle

--

[JM Simonet]

Not sure.

We European could ask for the Euro glyph, Japanese for the Yen, etc.

Let's be generic please.

JM

-- 

Please keep the Subject wording in your answers

This e-mail and any attachments may be confidential. You must not disclose or use the information contained in this e-mail if you are not the
intended recipient. If you have received this e-mail in error, please notify us immediately and delete the e-mail and all copies.

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

Jean-Marie Simonet  /  infograf768

Joomla! Translation Coordination Team 

[Gerlof]

Maybe the banner icon should look more like a "billboard"?
http://images.google.nl/images?um=1&hl=nl&tbo=1&imgtbs=z&imgsz=m&tbs=isch:1&sa=1&q=billboard&btnG=Zoeken&aq=f&aqi=&aql=&oq=&gs_rfai=&start=0

I like the other icons!

Gerlof

>  icon-64-banners.png
> 2KWeergevenDownloaden

[Lou]

What about this for banners?

[Lou]

This one for RSS

[Matt Thomas]

Hi Lou,

Thanks for jumping in here. You are doing a great job and you are producing some quality images. Personally, I have a hard time connecting this image to a banner. It reminds me of a star burst. Having said that, I am not sure what would work there. The only that I keep coming back to, which might be understandable by everyone, would be something like http://dragonartz.files.wordpress.com/2008/04/vector-banner-set1-by-dragonart_small.jpg . The billboard idea is also cool, but is it a universally understood image?

Thanks again!

Matt

[Lou]

This one for links ~ Lou

[Lou]

Hey Matt,

I just don't think a billboard is universally known - The idea of the starburst is for sales. Anyway, here is my idea for the billboard concept - I just don't think it works personally.

~ Lou

[Matt Thomas]

Hi Lou,

I agree that a billboard may not be universally understood. Maybe we are taking this too literally. What exactly is a banner? It's an ad, a sign, rotating image... etc. But, I think that icon-64-ads.png might be worth looking at since I understood it as a "blank space to put something to advertise." I personally like this direction.

Just a thought.

Best,

Matt

[Ron Severdia]

Kyle & Lou, yes, these new ones are more in line with the new look &
feel.

I don't think a billboard or the seal works for banners (also, the
billboard, ironically, doesn't read at smaller sizes). I have a few
ideas, but I'd like to see what you guys come up with. :)

[Lou]

@Ron - Thanks! Gonna keep trying at it. 

[Sam Moffatt]

I feel this style of bill board may be better known than we think -
but does it really equate to banner? I feel that banners is one of
those hard things to appropriately and easily convey, even just for
english.

Sam Moffatt
http://pasamio.id.au

[Matt Thomas]

On Fri, Mar 26, 2010 at 10:41 AM, Sam Moffatt <pas...@gmail.com> wrote:

I feel this style of bill board may be better known than we think...

I can attest that in Chile and Peru the billboard image is recognizable. Do we need to take the banners so literally? What is a banner other than a rotating image or ad?

Matt

[Kyle Ledbetter]

Added a keyhole to the Login Lock, thought it needed something
-Kyle

[joomlapraise]

@Ron, if you have banner ideas, pls share. Creativity is fun but
peeing in the wind ain't :)

[Kyle Ledbetter]

Here's my take on the Newsfeeds icon
-Kyle

[Lou]

Here is my take on update ~ Lou

On Fri, Mar 26, 2010 at 5:00 PM, Kyle Ledbetter <pixel...@gmail.com> wrote:

Here's my take on the Newsfeeds icon

-Kyle

--

[Lou]

and Install

[Kyle Ledbetter]

Here's an attempt for binoculars for the Preview icon
-Kyle

[Matt Thomas]

My initial reaction is that this would be great upload.

Matt

[Lou]

This changes it up a bit - let me know. ~ Lou

[Lou]

or this ...

[Matt Thomas]

Yes, I think the down arrow helps convey installing something better. What about playing off of icon-64-module.png concept and adding a puzzle piece to a puzzle with an arrow? The puzzle could be a cool theme to follow.

Matt

[Mark Dexter]

On the banner, how about a sideways scroll? Mark

[Oceanwatcher]

I am trying to follow the conversation here to get a feeling for what
is going on in the development community although I am neither a
programmer or a very gifted designer. But I try to help with whatever
I can.

About the design of new icons:

First of all, take a look at what WordPress did at the last "makeover"
-

Initial post: http://2tu.us/1vbb
Follow up: http://2tu.us/1vbc
The result: http://2tu.us/1vbk

Why not post this as a blogpost with a little more description and
invite some of the really gifted designers out there to come up with
ideas? Andrew Eddie posted something on deviantART here: @Datahverdag
Here: http://forum.deviantart.com/community/projects/1440101/

But I think it need a little more background:

- Show a brief history of design of the admin area from Mambo over to
Joomla.
- Show the template it should fit to.
- Make a list of icons that is needed - why not a complete set?
- Clearly state if there will be any money paid for it.
- Clearly state if it should be GPL licensed.

A little more about Joomla in general and what kind of recognition the
chosen designer would receive as well as a little more about what the
next steps in the process would be.

As part of the whole process, I would suggest one extra admin template
with a radically different approach. The front end of Joomla has
always come with a couple of basic templates to choose from for
testing. But I would guess most people install another template pretty
quickly.

At the backend, however, there has been a pretty limited choice. How
many really use the control panel? You see it when you log in, but
personally, I rarely go back to the CP after the first click. Then I
use the menus and go straight where I need to.

The WP dashboard on the other hand does something very important: It
provides information about the state of the system. A one-look
approach. No need to click anywhere. Yes, it can get crowded, but that
is something you can adjust.

I would love to see module spaces in the back-end template where I can
put some of the modules that I use in the front-end. Like the latest
comments from the K2 system etc. No accordion modulespaces.

Having something like this as the advanced option in the backend would
be really great, and I think it would very soon prove to be the most
used template. When I log on as administrator, I want to see the
statistics about the system. How is it running, how many articles, how
many visitors, how many comments etc.

So two posts would be great. One for the icons and one for a new GPL
template that could be included in 1.6 as the advanced admin template.

I will do my best to push and recruit designers to connect with this,
but I think a mailing list is not the best way to get new designers
in. Put it in a blog, let people respond in the comments there and
give them an e-mail address to send suggestions to.

[Ron Severdia]

@Oceanwatcher,

We're on the verge of getting a Joomla 1.6 beta out the door and we
don't have the time/resources to open this up as a formal project,
etc. I'm been placed in charge of the admin UI for 1.6 and have done a
bunch of the work already. But I thought that while I work on other
things, it would be a cool thing to open it up for others that might
be interested in taking a stab at it. The UI paradigm for 1.6 isn't
supposed to be a big departure from 1.5 so it's never been within the
scope to redesign it--more of a refresh, create a more cohesive visual
language, more consistency, and accommodate for the new features.

@Matt, Kyle & Lou

Maybe you can try and be less literal and more metaphorical in your
representation of banners or other areas? Again, I'd like to see what
path you take rather than dictate what I it should be. :)

[Lou]

@Ron

Cool beans. Reviewing some possiblities and fleshing them out. I will keep you posted on what I come up with. 

~ Lou

[Oceanwatcher]

On Mar 26, 8:25 pm, Ron Severdia <ron.sever...@joomla.org> wrote:
> @Oceanwatcher,
>
> We're on the verge of getting a Joomla 1.6 beta out the door and we

> don't have the time/resources to open this up as a formal project.

Ok. Just a note: From the first to the last post from WordPress, there
are 25 days if I am not calculating totally wrong.

If you really want to open it up for other designers, it would be good
to see a blogpost about it so the designers do not have to subscribe
to a mailing list or Google group to respond. I think you will find
that a lot of designers don't even know what a mailing list is. But
they sure know how to make icons :-)

[elin]

Would it be possible to make the trash icon look more trash can like
or more similar to the standard trash icon? I.e. maybe have a lid with
a handle?

Also, what to you think of switching the current save and save & close
icons? I think a disk without a check is more like the standard save
in other applications. And save & close could maybe be the save icon
with the superimposed close icon rather than a check.

I would also be nice to have Save & New be different from New.

Elin

[Ron Severdia]

@Lou
Sounds good. It's been four days and I'd like to get into a rhythm
here so let me know what works for you (and Kyle and anyone else that
wants to jump in).

@Oceanwatcher
I've opened the process up more, but I prefer to do it on this list
rather than a "come one, come all" approach. We're not negotiating/
debating the process--which I've already clearly laid out in my first
and subsequent posts--we're creating icons. I was originally going to
do them all myself since *I am the designer*, but felt I could open it
up for participation if anyone was interested. This would also allow
me to spend some time on a few other needs. If you're a designer, jump
in. If not, don't. Simple as that.

@Elin
I'm open to exploring those options. Right now some icons are
duplicates because the code isn't written linking to distinct icons.

[Lou]

@Ron - Apologies, I have been traveling.  We have both presented our ideas on the banner icon, could you let us know your ideas? ~ Lou

[Ron Severdia]

No worries.

My take on the three option presented so far for banners is that the
"star" is more known as either a "sale" or a price tag or the seal on
a certificate. The billboard is OK, but it doesn't translate at
smaller sizes (and it's used by an extension developer for their
banner extension). The banner between the two poles looks like an
ancient scroll. If the banner portion were a little shorter in height,
it would be a bit more obvious what it's supposed to be. Maybe you'd
consider going down the path of a different type of banner. Maybe a
flag (a triangle shaped one with a ripple on a pole so it doesn't look
like a language selector) or more of a metaphor for advertising in
general. Or a square with a cursor and click "lines" around the tip,
or, or, or...

I could sketch out what goes on each icon, but that'd take all the fun
and creativity out of it, right? :)

[Lou]

Thanks Ron!

I will try to have my ideas for this and the rest of the missing icons tomm afternoon. 

~ Lou

--

[Ron Severdia]

Any progress on this?

[joomlapraise]

Would it be possible to get feedback on all the other icons before we
invest any more time?

On Apr 5, 3:06 pm, Ron Severdia <ron.sever...@joomla.org> wrote:
> Any progress on this?

[Ron Severdia]

Of course! Here's my .02 so far…

Login lock (Kyle)- Keyhole version looks better. I was debating
whether or not a too stylized lock on the login page was over the top
or not. Still on the fence. Share your take on this.

Module puzzle (Kyle)- Looks good. How do modules "interlock"? :)

Banners (Kyle)- See my previous comments about this.

Contacts (Kyle)- Looks good, but won't read well at the smaller size.
Suggestions?

Banners (Lou)- See my previous comments about this.

RSS (Lou)- Is this meant for the Newsfeeds component? I think it's not
distinct enough.

Web links (Lou)- Looks good. I don't think there are any better ways
to show this.

Newsfeeds (Kyle)- I think this pushes the "classic" RSS icon in a
fresher direction.

Update (Lou) - Something similar is already in use for the rebuild/
refresh.

Install (Lou)- The gears have been used for settings and I wouldn't
mix those metaphors so the first Install is better than the second for
that reason. The third one uses the "Add" symbol (and alters the
Extensions icon by moving the bolt) and that's a different function
that install.

Preview (Kyle)- Like it or not, the binoculars are associated with
search and that means they will be confusing for a Preview.

Overall, the general look & feel is pretty close. It's really more an
issue of getting the "visual language" down. That means that we need
to take this a step further than just "making sure all the icons are
blue and orange." Do all the components have a similar design element?
All the modules? What's the consistent icon for save vs. apply when
layered with other icons? Try to think about the overall *system*.

And taking into consideration the various sizes, which is why I
recommended not posting just one size here but doing the three sizes
we need in a single image in order to best gauge. It's also wise to
have all the icons on a single JPG/PNG to see how they relate to one
another and read in context.

I hope all that makes sense and possibly further clarifies the
direction. Thanks!

[Ron Severdia]

Nothing more?

[joomlapraise]

I can't speak for Lou, but we'll be back on it soon. I plan on
updating the banner icon w/changes from you comment and just moving on
to other missing icons.
Ron, who is the deciding party on all this? Is it just you or does
everyone have to agree on icons they like?

On Apr 13, 11:14 pm, Ron Severdia <ron.sever...@joomla.org> wrote:
> Nothing more?

[Ron Severdia]

Sounds good. My domain on the Production Team is the design/UI/
usability area and I've been charged with heading this for 1.6.
Everyone is certain welcome to provide whatever input they like.

[Ron Severdia]

Going once... :)

[joomlapraise]

We'll be back on it after the CMS Expo, friggin slammed