Feature #1025

Cosmetics: Add Icons to "Activity"-View

Added by Raz Mataz over 9 years ago. Updated over 9 years ago.

Status:ClosedStart date:2008-04-09
Priority:LowDue date:
Assignee:-% Done:

0%

Category:UI
Target version:0.7
Resolution:Fixed

Description

It's a trivial thing but it would make the gorgeous UI even better if
the headlines in the "Activity"-View were prefixed with small icons to
indicate the type of the individual events.

Right now the list is a bit tiresome to parse because it's
a continuous, uniform blob of text.

Some may argue that one can use the filter-box for a cleaner picture but
sometimes I want to look at changesets and tickets at the same time
(for chronological reference) and some visual clues would make this task
much more comfortable.

note_checked.png (598 Bytes) Maxim Krušina, 2008-04-11 22:16

History

#1 Updated by Raz Mataz over 9 years ago

Found another place where the use of images instead of text
could reduce clutter and improve usability:

The issue list-view, e.g. http://www.redmine.org/projects/redmine/issues.

Column "Priority" could be expressed as an image.

Don't be shy to take inspiration from mantisbt:
http://www.futureware.biz/mantisdemo/images/priority_3.gif
http://www.futureware.biz/mantisdemo/images/priority_2.gif
http://www.futureware.biz/mantisdemo/images/priority_1.gif

#2 Updated by Maxim Krušina over 9 years ago

This is comment just to icons in column icons>

Hi Moe, I'm sorry but I disagree with this.

Sure, I like icons, anyway we are GUI designers also, but my suggestion is to use icons rare and clever. For some places it's very usefull to have icons. r everyday users it's really usefull, but remebmer there are still users which are using redime just a few days in month. For these users is textual description very handy and if they see just icons, they don't know what it means. There are exception in case of very general icons like print, close, etc., but for example "priority" doesn't have any widely-accepted image, which is associated with meaning.

What I suggest is to use combination of icon and textual description when possible: IMHO it the sollution, you can see this Update / Watch / Copy links above ticket. Some people tends to preffer textual representation, other people visually sticks to icons, so this sollution fit needs of both groups.

And last note to icons: in columns, it's usefull to have icons maybe in columns which are so narror to accomodate textual representation, but for example priority column is okay with text, because textual representation of priority is wider than column header, so there is no practical space saving.

Na dthe lůast reason is export to other formats and systems, when you still keep textual representation of columns.

#3 Updated by Maxim Krušina over 9 years ago

And remember that priorities can be defined as textual records, so every implementation of redmine can use different naming of priorities. This is really great feature and it should be kept. ;)

#4 Updated by Maxim Krušina over 9 years ago

+1 to icons in activity view. The same implementation is in Trac, so there are small icons to the left from headline, which speeds up look-up process, if you are looking for some specific activity.

#5 Updated by Eric Davis over 9 years ago

but for example "priority" doesn't have any widely-accepted image, which is associated with meaning

I agree with Maxim Krušina. I used a system that used red, blue, and gray boxes for priorities. The first question for every new user was "What does the box mean?".

I love how the Redmine alternative theme highlights the priorities with different color backgrounds. It gives so much information at a quick glance, e.g. "Why is my issue list all red? Oh ...., everythings Urgent now!"

#6 Updated by Eric Davis over 9 years ago

+1 for icons in the activity view. The HTML is already tagged with CSS classes so it should be easy to add other things like a background color or image.

#7 Updated by Jean-Philippe Lang over 9 years ago

Go to the activity view here on redmine.org (hit F5 if needed).
What do you think ?

#8 Updated by Eric Davis over 9 years ago

Go to the activity view here on redmine.org (hit F5 if needed). What do you think ?

Very nice but the wiki is off. The image is applied to dt.wiki but the activity renders as dt.wikicontent::version

#9 Updated by Raz Mataz over 9 years ago

  • Status changed from New to Resolved

Excellent! Looks very nice and clean.

You guys are right about the Priority-Column, there is no "one-size-fits-all" graphical representation.
I forgot that the fields are customizable.

So just forget about that one and thanks for the quick fix. :-)

#10 Updated by Maxim Krušina over 9 years ago

Nice one! But I vote for: Ticket resolved = Note with green checkbox. Now it's very simillar to stand-alone note icon. Also, "pen" means mostly "edit", not resolved, done or closed.

If needed, I can prepare appropriate icon.
BTW: Where is source of all these icons, plz?

#11 Updated by Maxim Krušina over 9 years ago

Can you put it intu trunk?

#12 Updated by Eric Davis over 9 years ago

Ticket resolved = Note with green checkbox.

Resolved is just a default status (which can be removed). It would be better if:

  issue.status.closed? #=> Note with green checkbox

That way administrators can configure which issue status would use the icon.

Now that I think about it, what if the Activity view added the issue status text as a CSS class? Then Redmine can provide the basic classes and a theme can override all the defaults:

  # HTML for Resolved issue
  <dt class="journal resolved">...

  # HTML for New issue
  <dt class="journal new">...

  # CSS
  dt.journal { ..default journal css..}
  dt.new { ..CSS for a New image }

#13 Updated by Raz Mataz over 9 years ago

+1 on Eric's idea.
Flexible and elegant, what more could we ask for? :)

#14 Updated by Jean-Philippe Lang over 9 years ago

I agree with Eric's proposition.
Just one thing, we can't use the status name as a css class since it may contain any character. The name can be easily changed too.
I would suggest to use a css class name like status-1 (where 1 = status.id) and an additional class "closed" (when issue.status.closed?) for those how just want to target closed issues.
So we would have:

class="journal status-2"

or

class="journal status-4 closed"

#15 Updated by Jean-Philippe Lang over 9 years ago

Maxim: you can find the icon set here http://www.famfamfam.com/lab/icons/silk/

#16 Updated by Maxim Krušina over 9 years ago

Jean-Philippe: Great, I tried to contact creator of icons, unfortunately, his site is a bit broken now ;)

#17 Updated by Maxim Krušina over 9 years ago

New icon for "Ticked resolved"... see attachment

#18 Updated by Jean-Philippe Lang over 9 years ago

New icon for "Ticked resolved"

Very nice :-)
Thanks

#19 Updated by Jean-Philippe Lang over 9 years ago

  • Target version set to 0.7

Icons on activity view committed in r1342.
For now, there a 3 css classes for issues:

class="issue" -- new issue
class="issue-edit" -- status changed
class="issue-closed" -- issue closed

Maxim, your icon is used for the last one.

#20 Updated by Jean-Philippe Lang over 9 years ago

  • Status changed from Resolved to Closed
  • Resolution set to Fixed

Also available in: Atom PDF