diff --git a/mocks/Swift - proposal - explanation.svg b/mocks/Swift - proposal - explanation.svg new file mode 100644 index 0000000..9fcc5dc --- /dev/null +++ b/mocks/Swift - proposal - explanation.svg @@ -0,0 +1,52801 @@ + + + + + + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift PanelProposal for different navigation/layoutBased on the feedback we got on the 4 proposals we uploaded previously (please refer to InVision) here is an updated proposal. We implemented the suggestions and the feedback we got from the community, with a different layout and a functionality closer to what users experience with Google Drive (mainly) and DropBox.Please note that we used the default Bootstrap UI design, and that this is not a visual proposal. The intent here is to focus on the UX/UI, and then eventually apply the visual later on.We added some comments in order to highlight important points in the functionality, please read them in order to have a complete view about the proposals. + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalIncluded the mockups in a current-Horizon style context.Collapsed containersNumber of items inside of containersIcons to distinguish folder, image, text or general file type (that could cover several sub-categories)CTAs referring to the current position + + + 1 + + + + 2 + + + + 3 + + + + 4 + + + + 5 + + + + 1 + + + + 2 + + + + 3 + + + + 4 + + + + 5 + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalSearch is not actually in these mockups, but the global magic search could include Swift and the containers, it depends on the search functionalityClick on the arrow to open the container/folder. Click on the element title to select and open it(i) opens the information about the container(highlighting the current opened container as well)During the London UX mid-cycle we discussed to keep this kinds of actions with a "+" and then the name of the element to be added, for consistency + + + 1 + + + + 2 + + + + 3 + + + + 4 + + + + 1 + + + + 2 + + + + 3 + + + + 4 + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalSorting by clicking the column titlesSwitch between public and privateUsing a table view more in line with default Bootstrap we used elsewhere, as part of the definition of the library components. + + + 1 + + + + 3 + + + + 2 + + + + 1 + + + + 2 + + + + 3 + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalOne click on the row selects the item and shows a different CTAs on top, according to the selection (Google Drive, DropBox)Right click with additional CTAs for the selectionMulti-selection, drag and drop of the items, Google Drive and Dropbox like functionality.Drag and drop onto a folder to move the files for instance.Generally to upload files drag and drop is enabled (once again just like Google Drive and Dropbox). But we also included a button CTA for that on top. + + + 1 + + + + 3 + + + + 2 + + + + 1 + + + + 2 + + + + 3 + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalWith a longer mouseover on the row, the whole long name is shown (same for containers)Current position highlighted (same for containers) + + + 1 + + + + 2 + + + + 1 + + + + 2 + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalAfter you click on the (i) for the container. The CTAs for this container is also in the modal window. + + + 1 + + + + 1 + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalThe columns can be resized in order to show more content or longer strings. Sample with deeper file tree. Anyway the file tree can also be ignored and the files browsed from the right window (Google Drive like functionality). + + + 1 + + + + 1 + + + + + + + + + + + + + + + + + Link to InVision: https://openstack.invisionapp.com/d/main#/projects/6426550 + + Horizon Swift Panel ProposalSample with "cut" content viewAlso these columns can be resized + + + 1 + + + + 2 + + + + 1 + + + + 2 + + + +