[ https://issues.apache.org/jira/browse/NIFI-1323?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]
Rob Moran updated NIFI-1323: ---------------------------- Attachment: flowfont.zip Attached updated *flowfont.zip* New: * icon-processor-add (0xe815) * icon-port-in-add (0xe814) * icon-port-out-add (0xe813) * icon-group-add (0xe80f) * icon-group-remote-add (0xe812) * icon-funnel-add (0xe8 00) * icon-template-add (0xe80e) * icon-label-add (0xe80d) Updated: * icon-template-save _replaces_ icon-template-create (0xe811) > UI visual design enhancement > ---------------------------- > > Key: NIFI-1323 > URL: https://issues.apache.org/jira/browse/NIFI-1323 > Project: Apache NiFi > Issue Type: Improvement > Components: Core UI > Affects Versions: 1.0.0 > Reporter: Rob Moran > Priority: Trivial > Attachments: flowfont.zip, nifi-add-processor-dialog.png, > nifi-component-samples.png, > nifi-configure-processor-properties-set-value.png, > nifi-configure-processor-properties.png, > nifi-configure-processor-scheduling.png, > nifi-configure-processor-settings.png, nifi-dialog-samp...@800px.png, > nifi-drop.svg, nifi-global-menu-pending-u...@2x.png, nifi-global-menu.png, > nifi-interaction-and-menu-samples.png, nifi-lineage-gra...@800px.png, > nifi-logo.svg, nifi-sample-fl...@800px.png, nifi-sample-flow.png, > nifi-search-resu...@2x.png, nifi-shell-samp...@800px.png > > > (I will attach mockups and supporting files as they become available) > I am starting to work on a design to modernize the look and feel of the NiFi > UI. The initial focus of the design is to freshen the UI (flat design, SVG > icons, etc.). Additionally, the new design will propose usability > improvements such as exposing more flow-related actions into collapsible > panes, improving hierarchy of information, etc. > Going forward, the design plan is to help lay the foundation for other UI/UX > related issues such as those documented in NIFI-951. > --- > *flowfont.zip* > Contains icon font and supporting files > *nifi-add-processor-dialog.png* > Dialog sample. This sample shows the 'Add Processor' dialog. > *nifi-component-samples.png* > To show styling for all components, as well as those components when a user > is unauthorized to access. > *nifi-configure-processor-properties* > *nifi-configure-processor-properties-set-value* > *nifi-configure-processor-scheduling* > *nifi-configure-processor-settings* > Configure Processor dialog. See related Comments below (in Activity section). > *nifi-dialog-sample-@800px* > Dialog sample in 800px wide viewport. This sample shows the the 'Details' tab > of a provenance event. > *nifi-drop.svg* > NiFi logo without 'nifi > *nifi-global-menu* > To show global menu > *nifi-global-menu-pending-user@2x* > Demonstrates a generic notification with an aggregate count that appears on > the global menu icon. When the menu is displayed, the same notification (and > individual count) appears in line with the corresponding item. > *nifi-interaction-and-menu-samples.png* > To demonstrate user interactions - hover states, tooltips, menus, etc. > *nifi-lineage-graph-@800px* > To show lineage graph with explicit action to get back to data provenance > event list. > *nifi-sample-flow-@800px* > Shows a very useable UI down to around 800px in width. The thinking here is > that at anything lower than this, the NiFi user experience will change to > more of a monitoring and/or administrative type workflow. Future mockups will > be created to illustrate this. > *nifi-logo.svg* > NiFi logo complete > *nifi-sample-flow.png* > Mockup of sample flow. Updated to show revised tool and status bars. > Management related actions will move to a menu via mouseover (see > _nifi-global-menu_). Added benefits here include reducing clutter and more > user-friendly menu with text labels to reduce time spent scanning only a > large set of icons. This also helps gain valuable viewport width in a browser > (see _nifi-sample-flow-@800px_) > *nifi-search-resu...@2x.png* > Search results example > *nifi-shell-sample-@800px* > Shell sample in 800px wide viewport. This sample shows the 'Data Provenance' > table. -- This message was sent by Atlassian JIRA (v6.3.4#6332)