Difference between revisions of "Icon LnF"

From Catglobe Wiki
Jump to: navigation, search
m (Project tree icons)
m (Common use icons)
Line 166: Line 166:
 
| [[Image:Journal.gif]]  
 
| [[Image:Journal.gif]]  
 
| [[Image:Layoutxml.gif]]
 
| [[Image:Layoutxml.gif]]
 +
|
 +
|
 +
|
 +
|
 +
|
 +
|
 +
|
 
|}
 
|}
  

Revision as of 04:31, 16 February 2009

Icon LnF

  1. Icons should have two states; normal and mouse over. The mouse over effect is a 3d shadow effect!
  2. All tool bar icons need 3 images specified; normal, hover, and disable!
  3. Buttons in tool bars that cannot be used should be grayed out, for example delete cannot be used until an item is chosen so it is grayed out until something is chosen. Tool tips should be visible on grayed out buttons.
  4. Tool tips must be added to all buttons that does not have text on the button.
  5. If the button text consists of more than one word then the first word is with a capital letter the following are with small letters. For example "Changed by".
  6. There can never be buttons after a Pager Control in a tool bar.
  7. Some icons should always have the same image no matter where we see the icon; please refer to "What icons to use". If the icon is not available, please talk to Process group for getting assigned an icon!
  8. Icons must always be set in the same general order on all lists. Please refer to Order_of_Icons to see the order in which icons must appear when you have an icon tool bar or equivalent!
  9. When we have 6 or more icons on a tool bar (or the dialogue is very small) we can choose to show some icons without the text label. Those icons that can be shown this way are marked with * in Order_of_Icons
  10. Groups of tool bar buttons are separated by a vertical separator
  11. Do not show two icons button separators next to each other - if e.g. no buttons with access in between!
  12. Do not show icon button separator at start or end without buttons on each side.

What icons to use

Icons is grouped based on the their function or number of use in each modules. Click on each group to see more details.

Project tree icons

Company.gif Facility.gif User.gif Grouptree.gif Sitetree.gif Project.gif Project complete.gif Foldertree.gif Task.gif Task complete.gif Taskset.gif Workflow.gif Communicator template.gif Attachment.gif DCS.gif DCS export.gif Product.gif Shift.gif Translationjob.gif Codingjob.gif
Issue.gif Project questionnaire.gif Project questionnaire complete.gif Questionnaire.gif Questionnaire template.gif Questionnaire layout.gif Questionnaire layout template.gif Questionnaire paper.gif Sample request.gif Diagram.gif Monitor.gif Report.gif Report template.gif Spreadsheet.gif Dashboard.gif Nextpage.gif

Attachment type icons

Image access.gif Image excel.gif Image word.gif Image ppt.gif Image visio.gif Image pdf.gif Image html.gif Image xml.gif Image text.gif Image bmp.gif Image png.gif Image gif.gif Image jpg.gif Image zip.gif Image wma.gif Notype.gif

Common use icons

Create.gif CreateAndClose.gif Delete.gif Add.gif Remove.gif DeleteToRecycleBin.gif RestoreBin.gif DestroyBin.gif DestroyBinAll.gif Recycle bin.gif Save.gif SaveAndNew.gif SaveAndClose.gif SaveAndView.gif SaveAs.gif SaveAsTemplate.gif Open.gif OpenTemplate.gif Viewoption.gif SetDefault.gif
Favorite.gif View.gif Cut.gif Edit.gif Copy.gif Paste.gif Close.gif Cancel.png OK.gif Search.gif Find all.gif Replace.gif Replace all.gif Refresh.gif SortDescending.gif SortAscending.gif Run.gif Generate.gif Download.gif Upload.gif
Submit.gif Submit close.gif Submit new.gif Undo.gif ResetAll.gif Redo.gif AddImage.gif AddAttachment.gif Hyperlink.gif Image.gif Excel.gif Pdf.gif Powerpoint.gif Lock.gif Execute.gif Constant.gif TimeRegistration.gif Register external hour.gif Chart.gif Myportal.gif
Import.gif Export.gif Import export.gif Help.gif Tip.gif Information.gif Printer.gif Data gear.gif Schedule.png Calculator.gif ViewSlideshow plain.gif Journal.gif Layoutxml.gif

Access icons

Access.gif Resource-access.gif Navigation.gif Inherit.gif Check checked.gif Check none.gif

User icons

User.gif AddUser.png Edit2.gif Protectdate.gif Account.gif Group.gif Add group.gif

Navigation & Expand/Collapse icons

NavigateFirst.gif NavigateLeft.gif NavigateRight.gif NavigateLast.gif Navigate top.gif Navigate bottom.gif Navigate left2.gif Navigate right2.gif
Navigatesave beginning.gif Navigatesave left.gif Navigatesave left2.gif Navigatesave right2.gif Navigatesave right.gif Navigatesave end.gif
UpArrow.gif DownArrow.gif

Editor icons

Subscript.gif Superscript.gif Bullets.gif Numberlist.gif Table.gif Aligncenter.gif Alignleft.gif Alignright.gif Justify.gif Top.gif Bottom.gif Middle.gif Bold.gif Italic.gif Underline.gif Fontcolor.gif Bringfoward.gif Sendbackward.gif Bringtofront.gif Sendtoback.gif
Insertbreakpage.gif Insertchart.gif Insertpagelink.gif Insert-Text-Box-1.gif Newpagebefore.gif Newpageafter.gif Deletecurrentpage.gif AddRow.gif DeleteRow.gif AddColumn.gif DeleteColumn.gif Moverowdown.gif Moverowup.gif Movecolumnleft.gif Movecolumnright.gif

Questionnaire icons

Project questionnaire.gif Project questionnaire complete.gif Questionnaire.gif Questionnaire template.gif Questionnaire layout.gif Questionnaire layout template.gif Questionnaire datagrid.gif QuestionGroup.gif Questionnaire paper.gif ViewSampleSize.gif ViewFilter.gif ViewCross.gif Viewproperties.gif Viewconditions.gif GenerateTestSheet.gif Moveto.gif Interview manager.gif Mask.gif Disable.gif Lock information.png
Target.gif Reset layout.gif Resetdelete.gif Translate.gif Start.gif Pause.gif Checksyntax.gif Analyze.gif Insertflash.gif

Report icons

Report.gif Report template.gif ViewReport.gif Dashboard.gif Spreadsheet.gif Monitor.gif Diagram.gif GotoSite.gif Customize.gif Random.gif Selection view.gif Chartstyle.gif Document chart.gif Viewresult.gif Copychart.gif Sum.gif Expression.gif Checks.gif

Communicator icons

Mail.gif Bulkmail.gif InformMessage.gif SentMail.gif SendAllMails.gif SaveAndSentLater.gif SavetoDraft.gif Reply.gif ReplyAll.gif ReadMail.gif UnreadMail.gif MailAccount.gif Sms.gif Bulksms.gif InvalidAddress plain.gif SendProperty.gif Move.gif StartQuestionnaire.gif SendingMail.gif Informer plain.gif
Highpriority.GIF Priority.gif Normalpriority.gif Lowpriority.GIF Rules.gif Keys.png

CGScript icons

CGScriptPrompt.gif CGScriptRun.gif CGScriptRunAll.gif

Coding job icons

Script.gif Exclude.gif Include.gif Reuse.gif

Data icons

Datacache.gif DeleteCache.gif GenerateCache.gif Rename.gif Autofix.gif Editaxis.gif Weight.gif Rebuild.png

Expression icons

Larger.gif LargerEqual.gif Smaller.gif SmallerEqual.gif Equal.gif NotEqual.gif And.gif Or.gif Inside.gif Value.gif

Task icons

Approve.gif Disapprove.gif Finish.gif Accept.gif Reassign.gif Merge.gif Generatetask.gif

Webshop icons

Transaction.gif Addtransactionex.gif Viewtransaction.gif Updatebudget.gif Pending.gif Deliver.gif Cashier approve.gif Creditcard approve.gif

Monitor icons

Dashboard.gif Document.gif Document attachment.gif Earth2.gif Folder.gif Line-chart.gif PowerPoint.gif Presentation.gif

CATI & Asterisk icons

Play.png Record.gif Phone.gif Speaker.gif Check.gif
DisconnectPhone.gif RingPhone.gif SleepPhone.gif TalkingPhone.gif

System announcement icons

Error.png Warning.png Check.png

Ungroup icons

Icon Used for
Select.gif Select
Select Some.gif Select some
Select All.gif Select all
SelectMerge.gif SelectMerge
Providerxml.gif Provider xml
Resize.gif Resize
Satellite dish.png Satellite dish
Remind.gif Remind

Order of Icons

To give CatGlobe a uniform Look & Feel, buttons must be in about the same location on all pages. While there are many different buttons the system, most buttons are in the same list of categories. 

When we have limited space the icons with * may appear with no text labeling.

Order of icons:

  1. Create *
  2. Add *
  3. Save *
    Separator
  4. Save and next
  5. Save and new
  6. Save and close
    Separator
  7. Open *
    Separator
  8. Edit *
  9. Open Template
    Separator
  10. Backward *
  11. Forward *
  12. Print resource information
  13. Send resource information
    Separator
  14. Search *
  15. Refresh *
    Separator
  16. Copy *
    Separator
  17. Run
  18. Download
  19. Go to Site
  20. View
    Separator
  21. Access
  22. Navigation Access
    Separator
  23. Export to Excel *
  24. Add as Favorites *
  25. Other Specialty Icons
    Separator
  26. Delete *
  27. Remove *
  28. Close *
    Separator
  29. Pager control
  30. No of Records field