Uploaded image for project: 'Camunda Optimize'
  1. Camunda Optimize
  2. OPT-4189

Dashboard template User Flow and design

XMLWordPrintable

    • Icon: Design Task Design Task
    • Resolution: Done
    • Icon: L3 - Default L3 - Default
    • 3.2.0-alpha2, 3.2.0
    • None
    • None
    • None
    • Not defined

      Use Case driven dashboards
      --------------------------

      Doing

      • Allow creation of dashboards via template from the Homepage
      • Allow creation of dashboards via template from Collection
      -data source must be added first
      • Improve usability of create modal
      • Allow editing of Reports from the Dashboard

      Not Doing

      • Editing Data source

      • Proposed for second iteration

      • No improvements of copy or move functionality

      • Requires permission concept re-think

      • No improvements in the list display of entities

       

      Prototype video

      1) Create via modal
      2) Edit mode of Dashboard *
      3) Edit report icon
      4) Unsaved Dashboard modal
      5) Saved Dashboard - view report link (current behaviour)

      https://drive.google.com/file/d/19sIHR4CHS32vVxUly-qW-_V7kDXfjqny/view?usp=sharing 

       Some design may vary from video- see zeplin link 

      • Dashboard edit mode

      ******Current behaviour: Entity that is created by template is not saved until user explicitly does this.
      Dashboards created via template: edit mode contains entities themselves are created but not saved.
      Is it possible to have multiple entities in an edit mode?

      Solution: Modal to save before actions relating to report data can be undertaken

      Actions that show save and continue modal:
      • Add filter
      • Edit Report

      Actions that DO NOT show save modal:
      anything that pertains to display
      • Resize
      • Moving reports on the dashboard 
      • Remove report
      • Rename Dashboard 

       

      Report layouts
      ---------

      Number report-Count: 2 x 4
      Number report-Duration: 2 x 14

      Heatmap 5 x 9
      Barchart 5x9

      Example screenshots added with place holder reports

       

      Templates
      ---------

      +sensible layout and order in the view

      1. Process Performance and Trends

      • Total Number of instances
      • Process duration (Avg)
      • Bar chart: Instance count by start date (Name: Instance trends)
      • Bar Chart: Instance duration by start date (Name: Instance Duration trends)
      • Heatmap: Flow node count grouped by flow nodes (Name Report: Flownode frequency)
      • Heatmap: Flow node Duration Grouped by flow nodes ( Name Report : Flownode duration)

       

      2.Human Task Performance and Trends

      • Heatmap: Flow node Duration Grouped by flow nodes ( Name Report : Idle time)
      • Heatmap: Flow node Duration Grouped by flow nodes ( Name Report : Work time)
      • Barchart: User task Count grouped by start date:Month Distributed by Assignee ( Name Report : Tasks started per month)
      • Barchart: User task Count grouped by end date:Month Distributed by Assignee ( Name Report : Tasks completed per month)

      3. Incident Overview

      • Number: Instance count grouped by none (Name:Total instances)
      • Number: Instance count grouped by none filtered with open incidents (Name: Instances with Incidents)
      • Number: Open Incident count grouped by none ( Name Report : Open incidents )
      • Number: Resolved Incident count grouped by none ( Name Report : Resolved incidents )
      • Number: Incident Resolution duration grouped by none ( Name Report : Resolution duration AVG)
      • Heatmap: Open Incident count grouped by flow node (Name report: Steps with Open Incidents)
      • Heatmap: Resolved Incident count grouped by flow node (Name report: Steps with Resolved Incidents)
      • Heatmap: Incident Resolution Durations grouped by flow node (Name report: Resolution durations )

       

       

       

      TASK: Create via template modal improvements (Reports and Dashboards)
      ---------------
      • Create dashboard displays modal with template options
      • Focus on Process Definition selection
      • Amend Name field label 'Report name'  'Dashboard name' (no add)
      • Selected state of template design update
      • If name not explicitly added - entity takes name of the template
      • Template option design update

       

       

      TASK: Report thumbnail
      --------------
      Edit mode:
      • Add edit icon - edit icon drops user directly in edit mode
      • Change close icon

       

      TASK: Report display
      -----------------
      • Set widths that make sense for the visualised data {asia} 
      • Number reports displayed responsively (seperate tiket) 

       

      TASK: Button group improvement
      ---------
      • Separate the entity control buttons from the action buttons
      • Save is the primary button

       

      Links:
      Zeplin - > https://app.zeplin.io/project/5b4f294ab0d5cf0c2c391d1d/dashboard?seid=5ec4e5ebbf5b3047f0f0379f
      Video - > https://drive.google.com/file/d/19sIHR4CHS32vVxUly-qW-_V7kDXfjqny/view?usp=sharing

        This is the controller panel for Smart Panels app

          1. Human task performance and trends .png
            Human task performance and trends .png
            310 kB
          2. Incident overview.png
            Incident overview.png
            198 kB
          3. Process Performance and trends .png
            Process Performance and trends .png
            250 kB
          4. Thumb Template one.svg
            0.4 kB
          5. Thumb Template tree.svg
            0.4 kB
          6. Thumb Template two.svg
            0.3 kB

              Unassigned Unassigned
              asia.malina Asia Malina
              Votes:
              0 Vote for this issue
              Watchers:
              0 Start watching this issue

                Created:
                Updated:
                Resolved: