Versions Compared

Old Version 30

changes.mady.by.user Wannes Dhooge

Saved on

compared with

New Version 31

changes.mady.by.user Wannes Dhooge

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

donetitledone

title

  • Content
    • detailed Design Grid description
Yellow

title

  • Contentswitch
  • Content
  • Toolbar
donedone

  • Content
    • Group
    • Links
    • Button
  • Open Direction
  • Animation*
  • Parent ui-element/extension am button
In Progress

In ProgressIn ProgressIn Progress

In Progress

In Progress
In ProgressIn ProgressIn Progress
  • SVG Images
    • bad
    • neutral
    • bad
titleThomas King

In ProgresstitleThomas King

Templates ID'sAtoms, Molecules and OrganismsStatusMVP RequirementsFeaturesDocumentationToDoComments

ID1 Colors

Status
subtletrue
colourGreen
title




https://confluence.germanedge.com/x/XYC-AQ
https://wasp2-dev.myapp.de:444/live-style-guide/theming

  • Documentation
  • Final angular check

ID1 Typeface
Status
colourYellow
In Progress


https://confluence.germanedge.com/x/YoC-AQ
  • Documentation 
  • Final angular check

ID1 Icon

Status
colourYellow
titleIn Progress




https://confluence.germanedge.com/x/_MYdAg
https://wasp2-dev.myapp.de:444/live-style-guide/icons
  1. Definition of Icon-Set for MVP
  2. Design of missing Icons
  3. Icon to Font
  4. Final angular check
  5. Documentation

ID2 Dashboard & basic components

Dashboard

Status
colourYellow
titleIn Progress

  • Header
  • Contentarea

https://confluence.germanedge.com/x/7KMdAg
code is missing
  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Header

Status
subtletrue
colourGreen
title
  • Burger
  • Date & Datepicker
  • Product-Logo
  • Tool/App/Module Naming
  • Toolbar(Search-, Setting- & Notification Icon)

https://confluence.germanedge.com/x/JqQdAg
  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check
Wannes: still struggling with date&datepicker in the header, we can filter but filter result is not shown there and as a user you can't see a filter has been used here. (did the test in dSFM)
→ we need the documentation of this end user tests. And yes, the filter result should be shown. But I think it is already.

Overlay

Status
colourYellow
In Progress
https://confluence.germanedge.com/x/76MdAg
  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Floating Sidebar

Status
colour
titleIn Progress
  • Action Icon
  • Title
  • Link

https://confluence.germanedge.com/x/IKIdAg
  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Panel

Status
colourYellow
In Progress
https://confluence.germanedge.com/x/LaQdAg
  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check
Wannes: Navigation is a must for Menu editor development, must be aligned towards that functional demand. But functional demands of Notifications are still too unclear to be handled, wouldn't be better to get this out of the MVP?

Inline Notification

Status
colourYellow
titleIn Progress

  • Title
  • Subject
  • Link
  • Toolbar
  • Picture
  • Colorcode


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check
Wannes: an error and message handling when system is down, user can't log in ...
ID3 Boardlets & content components

Default Boardlet

Status
subtletrue
colourGreen
title

  • boardlet
    • Content Bereich
      • detailed Design Grid description
    • Toolbar
      • Icons
    • Title
    • Datepicker on demand
  • tabs
    • Toolbar bottom with control extension


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check
Wannes: incorporate search and filter?

Dialog

Status
subtletrue
colourGreen
title
  • Dialog
    • Form
      • Title
      • Content Bereich
      • Top Toolbar( only without Sidebar)
      • Bottom Toolbar( only without Sidebar)
        detailed Design Grid description 
    • Sidebar on demand
      • Title
      • Content Bereich
      • detailed Design Grid description
      • Top Toolbar 
      • Bottom Toolbar
    • Info Field


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Cards

Status
colourYellow
titleIn Progress

  • Content Card
    • Title
    • Subtitle
    • Toolbar
    • Drilldown
    • Content
  • Info Card*
    • Title
    • Subtitle
    • Content


  1. Design of missing Components
  2. Update Zeplin
  3. Detailed Design Grid description
  4. Documentation
  5. Final angular check
Wannes: we could first focus on menu and dashboard editor for now (content card)?

Overflow Menu

status

colourYellow
titleIn Progress


  1. Design of missing Components
  2. Update Zeplin
  3. Detailed Design Grid description
  4. Documentation
  5. Final angular check


Tooltip

Status
colourYellow
title
  • Rookiemode Tooltip*
    • Content
  • Tooltip
    • Content
    • Whitelist/Blacklist


  1. Basic Design
  2. Present final design in UI/UX Guilde
  3. Zeplin Documentation
  4. Documentation
  5. Final angular check
Wannes: i think tooltip is MVP while rookiemode is not

Tags
Status
colourYellow
title
  • Icon Button
  • Text Link
  • Icon
  • Colorcode




  1. Basic Design
  2. Present final design in UI/UX Guilde
  3. Zeplin Documentation
  4. Documentation
  5. Final angular check


Modal
Status
colourYellow
title
  • Title
  • Subtitle
  • Link
  • Button


  1. Design of missing Components
  2. Update Zeplin
  3. Detailed Design Grid description
  4. Documentation
  5. Final angular check

ID4 Tables components
  1. Table header
  2. Table content
  3. Pagination
  4. controlbar & controlelements

Status
colourYellow
titleIn Progress

  • global search über alle spalten der Tabelle
  • spalten basierte suche/filter
    • Filterkriterien festlegen (gt, lt)
    • Filterkriterium sichtbar und deaktivierbar
  • Process bar
  • Toolbar top
  • Toolbar bottom
  • Paginierung
  • Buttons
  • pagination
  • global search over all columns
  • sorting per column
  • filtering per column
  • define filter property
  • select a row/ multiple rows
  • select all rows
  • show state of row/ rows

  1. Basic Design
  2. Present final design in UI/UX Guilde
  3. Zeplin Documentation
  4. Documentation
  5. Final angular check

Wannes:

  • column picker/chooser (an icon often on top of the table)
  • tree-table
  • error indicator
  • actions/information per record
  • scrollbar right and under
  • paging and pagination
  • simple search (single input)
  • advanced search (multiple inputs)
  • filter on table content

Informational: could be re-used:

  • progress bar in use X-series (don't restyle them, are in use already)
  • process bar in use X-series (don't restyle them, are in use already)
ID5 Buttons & control components
  1. Buttons
status
colourYellow
titleIn Progress
  • Text
  • Icons
  • Switch
  • Text/Icon
  • Text/Text
  • Icon/Text/Icon
  • Button Style
  • Button Size
  • Button Type


  1. Design of missing Components
  2. Update Zeplin
  3. Detailed Design Grid description
  4. Documentation
  5. Final angular check

ID6 Link components

Link

Status
colourYellow
title
  • Icon Button
  • Text Link
  • Icon

ID6 Links Assets
  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Tree

Status
colourYellow
title
  • Expand icon
  • Sub- or Checkbox Icon
  • Text Link
  • More Icon Button


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check

ID7 Input & Dropdown components
  1. Default input
  2. Specal input
  3. Default dropdown
  4. Special dropdown
  5. Dropdown Links
  6. Datepicker/Timepicker
Status
colourYellow
title


  1. Design of missing Components
  2. Update Zeplin
  3. Detailed Design Grid description
  4. Documentation
  5. Final angular check


Radio

Status
colourYellow
titleIn Progress

  • Icon Button
  • Text Link


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Checkboxstatus
colourYellow
titleIn Progress
  • Icon Button
  • Text Link


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Input
Status
colourYellow
title
  • Label field
  • Input field
    • Placeholder 
  • Info Container
    • Icon
    • Info Field
  • Input Style
    • Validation
    • State
    • Size


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Dropdown
Status
colourYellow
title
  • Label field
  • Input field
  • Icon Button
  • Content(Overflow Menu*)
    • Group
    • Button
  • Input Style
    • Validation
    • State
    • Size


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Multiselect
Status
colourYellow
title
  • Label field
  • Input field
  • Icon Button
  • Tag
  • Content(Overflow Menu*)
    • Group
    • Button
  • Input Style
    • Validation
    • State
    • Size


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check


Datepicker

Status
colourYellow
titleIn Progress

  • Input Field
  • Icon 
  • Toolbar Bottom
  • Contentswitch
  • Content
    • Title
    • Form
    • Sidebar
  • Input Style
    • Validation
    • State (Dropdown/Link)
  • select a date
  • select a time
  • select a date/time range
  • select a commonly used date range
  • manual date input
  • manual time input

  1. Basic Design
  2. Present final design in UI/UX Guilde
  3. Zeplin Documentation
  4. Documentation
  5. Final angular check

Graphics

Karmastatus
subtletrue
colourGreen
titledone


  • Documentation
  • Final angular check

ChartsPie Chart
Status
colourYellow

In Progress

  • Documentation
  • Final angular check


Bar Chart
Status
colourYellow
title

Thomas King



  • Documentation
  • Final angular check


Doughnut Chart
Status
colourYellow

In Progress

  • Documentation
  • Final angular check


Line Chart

Status
colourYellow
titleIn Progress

Thomas King



  • Documentation
  • Final angular check

...

Templates ID'sAtoms, Molecules and OrganismsStatusMVP RequirementsFeaturesDocumentationToDoComments

Spacing







Action Placement







Navigation







Notification







Validation







...

Not f. MVP

Not f. MVP

titleNot f. MVPNot MVP - DevExtreme
Templates ID'sAtoms, Molecules and OrganismsStatusMVP RequirementsFeaturesDocumentationToDoComments
ID2 Dashboard & basic components

Sandbox

Status
colourRed
titleNot MVP - must be discussed

Status
colourRed
titleNot f. MVP



Toast Notification

Status
colourRed
title
  • Icon
  • Title
  • Subtext
  • Link
  • Toolbar
  • Colorcode


  1. Detailed Design Grid description
  2. Documentation
  3. Final angular check
Wannes: Since notifications are still functional unclear, do we exclude from MVP?
PicturesNews
Status
colourRed
Not f. MVP Not MVP - must be discussed

Status
colourRed
titleNot f. MVP


Filter

Status
colourRed
titleNot f. MVP



1) make it possible to store a filter for a user group/all other users

2) make it possible to let other users change this filter

3) filter criteria: provide an auto complete input box

4) filter criteria: provides support for a flag

5) filter criteria: use a filter to filter out data on a dropdown (to decrease the amount of possibilities in the dropdown)

6) make it possible to use ><= in combination with a criteria

7) make it possible to use OR instead of AND

8) make it possible to provide extra filter criteria by extracting the criteria




ChartsGantt Chart
Status
colourRed
title

Status
colourRed
titleNot f. MVP


Barrier-free







...

Status
Templates ID'sAtoms, Molecules and OrganismsMVP RequirementsFeaturesDocumentationToDoComments







...