Fixed workflow detail page UX bugs

opensearch-project / dashboards-flow-framework

A UI designer for constructing AI applications with OpenSearch

Apache License 2.0

9 stars 8 forks source link

Fixed workflow detail page UX bugs #457

Closed saimedhi closed 2 weeks ago

saimedhi commented 2 weeks ago

Description

Reduced padding between panels
Added border radius to the panels
Decreased empty space at the bottom below panels.
Fixed header as previous workflow title is some part cut at the top.
Removed unwanted margins present for panels in workflow detail page

screen-capture (25).webm

Check List

[x] Commits are signed per the DCO using --signoff

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license. For more information on following Developer Certificate of Origin and signing off your commits, please check here.

saimedhi commented 2 weeks ago

@ohltyler, please take a look.
@kamingleung, please take a look at the screen recorder above and track any more bugs observed in the UX for both Old and New look. Thank you.

saimedhi commented 2 weeks ago

Failing test will be fixed with https://github.com/opensearch-project/opensearch-dashboards-functional-test/pull/1612

ohltyler commented 2 weeks ago

@saimedhi this is great! One question, I see the overall margins on the edge of the window is different on the workflow list and the workflow details page - should these be consistent?

screen-capture (13).webm

saimedhi commented 2 weeks ago

@saimedhi this is great! One question, I see the overall margins on the edge of the window is different on the workflow list and the workflow details page - should these be consistent?

screen-capture.13.webm

Yes, Tyler I notice that too. But in workflow detail Page, UX team suggested to have Same Appearance as discover page.(less padding around panels). I will reconnect with UX today and show both New Look and Old look and request them to track if any further changes needed.

kamingleung commented 2 weeks ago

@ohltyler The visual designer is considered a "full-screen" application, similar to Discover. Therefore, UX would recommend follow the same spacing pattern as the new Discover to maximize workable space.

kamingleung commented 2 weeks ago

@saimedhi Looks like the Preview and Inspector panels have width padding inside the panels. Can you make sure they are consistent with the left panel?