[
https://issues.apache.org/jira/browse/NIFI-1323?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
]
Rob Moran resolved NIFI-1323.
-----------------------------
Resolution: Done
> 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-drag-drop-compon...@2x.png, nifi-global-menu-pending-u...@2x.png,
> nifi-global-menu.png, nifi-interaction-and-menu-samples.png,
> nifi-lineage-gra...@800px.png, 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-drag-drop-component@2x*
> To show updated component toolbar button style and user interaction
> improvements
> *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)
