Details
-
Type:
Improvement
-
Status: Closed (View Workflow)
-
Priority:
Major
-
Resolution: Done
-
Affects Version/s: None
-
Fix Version/s: None
-
Labels:None
-
Story Points:1
-
Epic Link:
-
Sprint:Spring 2 2022 Jan 18 - Jan 28, Spring 3 2022 Jan 31 - Feb 11, Spring 4 2022 Feb 14 - Feb 25
Description
The top of the track hubs table page (see: https://www.bioviz.org/public-trackhubs.html) includes a lot of text that is not strictly necessary and uses up a lot of space.
Modify the page top as shown in the attached image. (Do not make changes to the table itself as this would be done in a separate ticket.)
Details:
- Headline uses imperative voice to emphasize that this interface is a tool that lets users view track hub data in IGB
- The headline and search box are both centered
- A note in smaller text left-justified in the column immediately to the right of the search box reads: "Want more info? Play video" with "Play video" hyperlinked to a youtube video. The youtube video is not yet created. For now, just link to the IGB YouTube channel.
- Note that the interface lacks clutter. A lot of interfaces contain extra words that increase the user's cognitive load with minimal benefit to them. Less is always more.
Attachments
Activity
| Field | Original Value | New Value |
|---|---|---|
| Epic Link | IGBF-2831 [ 19524 ] |
| Assignee | Ann Loraine [ aloraine ] |
| Attachment | IGBF-3063.pptx [ 17072 ] |
| Assignee | Ann Loraine [ aloraine ] |
| Story Points | 0.25 | 1 |
| Rank | Ranked higher |
| Description |
The top of the track hubs table page (see: https://www.bioviz.org/public-trackhubs.html) includes a lot of text that is not strictly necessary and uses up a lot of space.
Modify the page as shown in the attached PowerPoint file. |
The top of the track hubs table page (see: https://www.bioviz.org/public-trackhubs.html) includes a lot of text that is not strictly necessary and uses up a lot of space.
Modify the page as shown in the attached image. Details: # Headline uses imperative voice to emphasize that this interface is a tool that lets users view track hub data in IGB # The headline and search box are both centered # A note in smaller text left-justified in the column immediately to the right of the search box reads: "Want more info? Play video" with "Play video" hyperlinked to a youtube video. The youtube video is not yet created. For now, just link to the IGB YouTube channel. # Note that the interface lacks clutter. A lot of interfaces contain extra words that increase the user's cognitive load with minimal benefit to them. Less is always more. |
| Attachment |
|
| Attachment | IGBF-3063.png [ 17085 ] |
| Description |
The top of the track hubs table page (see: https://www.bioviz.org/public-trackhubs.html) includes a lot of text that is not strictly necessary and uses up a lot of space.
Modify the page as shown in the attached image. Details: # Headline uses imperative voice to emphasize that this interface is a tool that lets users view track hub data in IGB # The headline and search box are both centered # A note in smaller text left-justified in the column immediately to the right of the search box reads: "Want more info? Play video" with "Play video" hyperlinked to a youtube video. The youtube video is not yet created. For now, just link to the IGB YouTube channel. # Note that the interface lacks clutter. A lot of interfaces contain extra words that increase the user's cognitive load with minimal benefit to them. Less is always more. |
The top of the track hubs table page (see: https://www.bioviz.org/public-trackhubs.html) includes a lot of text that is not strictly necessary and uses up a lot of space.
Modify the page top as shown in the attached image. (Do not make changes to the table itself as this would be done in a separate ticket.) Details: # Headline uses imperative voice to emphasize that this interface is a tool that lets users view track hub data in IGB # The headline and search box are both centered # A note in smaller text left-justified in the column immediately to the right of the search box reads: "Want more info? Play video" with "Play video" hyperlinked to a youtube video. The youtube video is not yet created. For now, just link to the IGB YouTube channel. # Note that the interface lacks clutter. A lot of interfaces contain extra words that increase the user's cognitive load with minimal benefit to them. Less is always more. |
| Assignee | Omkar Marne [ omarne ] |
| Status | To-Do [ 10305 ] | In Progress [ 3 ] |
| Sprint | Spring 2 2022 Jan 18 - Jan 28 [ 137 ] | Spring 2 2022 Jan 18 - Jan 28, Spring 3 2022 Jan 31 - Feb 11 [ 137, 138 ] |
| Rank | Ranked higher |
| Attachment | screenshot-1.png [ 17092 ] |
| Attachment | screenshot-1.png [ 17092 ] |
| Attachment | screenshot-1.png [ 17150 ] |
| Attachment | screenshot-1.png [ 17150 ] |
| Attachment | public-trackhub.png [ 17151 ] |
| Attachment | public-trackhub.png [ 17151 ] |
| Attachment | screenshot-1.png [ 17152 ] |
| Attachment | screenshot-1.png [ 17152 ] |
| Attachment | screenshot-1.png [ 17153 ] |
| Attachment | screenshot-1.png [ 17153 ] |
| Attachment | screenshot-1.png [ 17154 ] |
| Attachment | screenshot-1.png [ 17154 ] |
| Attachment | screenshot-1.png [ 17155 ] |
Assuming you are serving the bioviz project locally, for the genome versions to load, you will need to also run the hub-facade server locally.
Thank you Philip Badzuh
| Attachment | screenshot-1.png [ 17155 ] |
| Attachment | screenshot-1.png [ 17157 ] |
| Attachment | screenshot-1.png [ 17157 ] |
| Attachment | screenshot-1.png [ 17158 ] |
Maybe try "sup" tag?
| Assignee | Omkar Marne [ omarne ] | Philip Badzuh [ pbadzuh ] |
| Attachment | screenshot-2.png [ 17160 ] |
| Attachment | screenshot-1.png [ 17158 ] |
| Assignee | Philip Badzuh [ pbadzuh ] |
| Assignee | Ann Loraine [ aloraine ] |
| Status | In Progress [ 3 ] | Needs 1st Level Review [ 10005 ] |
| Comment |
[ Hello Dr.[~aloraine] Please find my final pull request: https://bitbucket.org/lorainelab/bioviz/pull-requests/83/igbf-3063
Also please review the snapshots and the ticket. ] |
| Attachment | screenshot-2.png [ 17160 ] |
| Attachment | screenshot-1.png [ 17166 ] |
I have modified the top of the table including the search bar and Question mark symbol.
Please see my latest changes here
Hello Dr. [~aloraine] Please check the snapshot and review the ticket.
| Comment |
[ [~pbadzuh] Please find my PR: https://bitbucket.org/lorainelab/bioviz/pull-requests/83/igbf-3063-modify-top-of-the-table
Please check my latest commit. I have made the question mark symbol smaller. Please try to make the search bar bigger. ] |
Can you modify the vertical placement of "Want more info? Play video" text to be centered? In the image file "screenshot-1.png", this line of text is too high in the line. Please see first image.
| Status | Needs 1st Level Review [ 10005 ] | First Level Review in Progress [ 10301 ] |
| Status | First Level Review in Progress [ 10301 ] | To-Do [ 10305 ] |
| Assignee | Ann Loraine [ aloraine ] | Omkar Marne [ omarne ] |
| Status | To-Do [ 10305 ] | In Progress [ 3 ] |
| Attachment | screenshot-1.png [ 17166 ] |
| Attachment | IGB 3063.png [ 17168 ] |
| Attachment | IGB 3063.png [ 17168 ] |
| Attachment | 3063.png [ 17169 ] |
Dr. [~aloraine] Please check the snapshot if it looks good.
| Status | In Progress [ 3 ] | Needs 1st Level Review [ 10005 ] |
| Assignee | Omkar Marne [ omarne ] | Ann Loraine [ aloraine ] |
Thanks! It looks great to me – nicely symmetrical.
| Status | Needs 1st Level Review [ 10005 ] | First Level Review in Progress [ 10301 ] |
| Status | First Level Review in Progress [ 10301 ] | Ready for Pull Request [ 10304 ] |
| Assignee | Ann Loraine [ aloraine ] | Omkar Marne [ omarne ] |
Thank you, Dr. [~aloraine]! Please find my pull request here
| Status | Ready for Pull Request [ 10304 ] | Pull Request Submitted [ 10101 ] |
| Assignee | Omkar Marne [ omarne ] | Ann Loraine [ aloraine ] |
| Status | Pull Request Submitted [ 10101 ] | Reviewing Pull Request [ 10303 ] |
| Assignee | Ann Loraine [ aloraine ] | Omkar Marne [ omarne ] |
I checked the PR. It looks like you accidentally have added a number of files from your IDE-created local development environment. Please re-do the branch / commits so that these files are not introduced into the repository.
attn: Omkar Marne
| Status | Reviewing Pull Request [ 10303 ] | To-Do [ 10305 ] |
Hello Dr. [~aloraine] Please find my new PR here
| Status | To-Do [ 10305 ] | In Progress [ 3 ] |
| Status | In Progress [ 3 ] | Needs 1st Level Review [ 10005 ] |
| Status | Needs 1st Level Review [ 10005 ] | First Level Review in Progress [ 10301 ] |
| Status | First Level Review in Progress [ 10301 ] | Ready for Pull Request [ 10304 ] |
| Status | Ready for Pull Request [ 10304 ] | Pull Request Submitted [ 10101 ] |
| Assignee | Omkar Marne [ omarne ] | Ann Loraine [ aloraine ] |
| Status | Pull Request Submitted [ 10101 ] | Reviewing Pull Request [ 10303 ] |
| Status | Reviewing Pull Request [ 10303 ] | Merged Needs Testing [ 10002 ] |
| Assignee | Ann Loraine [ aloraine ] |
It is looking good except for one detail.
Please: Reduce vertical space as indicated in attached image.
attn: Omkar Marne
| Attachment | reduce-verticality.png [ 17170 ] |
| Attachment | space reduced.png [ 17171 ] |
Hello Dr. [~aloraine], I have reduced the vertical space. The vertical space above the search bar looks more because 'the headline' is a different class and has its own vertical space.
Please check if it looks good. I'll submit a new PR.
Thank you for working on this Omkar Marne!
Unfortunately, the distance between the top of the table and the first row of the header is very small and looks cramped compared to the vertical space around the other parts of the table. The vertical space needs to look more balanced.
The reason this matters is that if there is something unbalanced about the appearance, users get distracted. Symmetry helps avoid this. It also looks more polished and professional, which gives users a feeling of comfort, important when displaying information.
Philip Badzuh: Can you take a look?
Maybe look at the "Igb genomes" page? Can you use some ideas from there?
| Status | Merged Needs Testing [ 10002 ] | Post-merge Testing In Progress [ 10003 ] |
| Status | Post-merge Testing In Progress [ 10003 ] | To-Do [ 10305 ] |
| Assignee | Omkar Marne [ omarne ] |
| Assignee | Omkar Marne [ omarne ] |
| Assignee | Omkar Marne [ omarne ] |
| Attachment | space reduced.png [ 17171 ] |
| Attachment | Vertical space reduced..png [ 17172 ] |
Hello, Dr. [~aloraine] Please check now. I have reduced more space.
| Status | To-Do [ 10305 ] | In Progress [ 3 ] |
| Attachment | Vertical space reduced..png [ 17172 ] |
| Attachment | Vertical space reduced..png [ 17173 ] |
| Sprint | Spring 2 2022 Jan 18 - Jan 28, Spring 3 2022 Jan 31 - Feb 11 [ 137, 138 ] | Spring 2 2022 Jan 18 - Jan 28, Spring 3 2022 Jan 31 - Feb 11, Spring 4 2022 Feb 14 - Feb 25 [ 137, 138, 139 ] |
| Rank | Ranked higher |
| Status | In Progress [ 3 ] | Needs 1st Level Review [ 10005 ] |
| Assignee | Omkar Marne [ omarne ] | Ann Loraine [ aloraine ] |
It still looks unbalanced. Please compare to the mockup.
| Assignee | Ann Loraine [ aloraine ] |
| Assignee | Omkar Marne [ omarne ] |
| Status | Needs 1st Level Review [ 10005 ] | First Level Review in Progress [ 10301 ] |
| Status | First Level Review in Progress [ 10301 ] | To-Do [ 10305 ] |
| Status | To-Do [ 10305 ] | In Progress [ 3 ] |
| Attachment | Vertical space reduced..png [ 17173 ] |
Hello Dr. [~aloraine] Please compare the changes with the mockup and let me know if it's good. Also, please let me know where should I add the 'Want more info' line. I have removed that line and text in the search bar.
| Attachment | screenshot-1.png [ 17174 ] |
| Attachment | screenshot-1.png [ 17174 ] |
| Attachment | New top .png [ 17175 ] |
| Status | In Progress [ 3 ] | Needs 1st Level Review [ 10005 ] |
| Assignee | Omkar Marne [ omarne ] | Ann Loraine [ aloraine ] |
Thank you so much for your patience. It looks great. Please submit a PR.
| Status | Needs 1st Level Review [ 10005 ] | First Level Review in Progress [ 10301 ] |
| Status | First Level Review in Progress [ 10301 ] | Ready for Pull Request [ 10304 ] |
| Assignee | Ann Loraine [ aloraine ] | Omkar Marne [ omarne ] |
Dr. [~aloraine] Please find my pull request here.
| Status | Ready for Pull Request [ 10304 ] | Pull Request Submitted [ 10101 ] |
| Status | Pull Request Submitted [ 10101 ] | Reviewing Pull Request [ 10303 ] |
| Assignee | Omkar Marne [ omarne ] |
PR is merged. New code is deployed. Please test.
| Status | Reviewing Pull Request [ 10303 ] | Merged Needs Testing [ 10002 ] |
Testing instructions:
- Open https://bioviz.org/index.html
- Open Trackhub link.
- The UI above the table should be the same as the image attached above. Please see the snapshot named 'New Top'.
Question:
I'm a little confused about the testing instructions. The new page is deployed on bioviz.org, so I don't understand why the tester needs to run the back end locally in order to see the changes. The bioviz page is contacting translate.bioviz.org as the back end, so I don't understand why the tester needs to have the back end code running on their local, as well.
| Assignee | Omkar Marne [ omarne ] |
| Status | Merged Needs Testing [ 10002 ] | Post-merge Testing In Progress [ 10003 ] |
| Status | Post-merge Testing In Progress [ 10003 ] | To-Do [ 10305 ] |
You're right Dr. [~aloraine]. I have updated the testing instructions. You can directly go to bioviz.org and test it.
| Status | To-Do [ 10305 ] | In Progress [ 3 ] |
| Status | In Progress [ 3 ] | Needs 1st Level Review [ 10005 ] |
| Status | Needs 1st Level Review [ 10005 ] | First Level Review in Progress [ 10301 ] |
| Status | First Level Review in Progress [ 10301 ] | Needs 1st Level Review [ 10005 ] |
| Status | Needs 1st Level Review [ 10005 ] | First Level Review in Progress [ 10301 ] |
| Status | First Level Review in Progress [ 10301 ] | Ready for Pull Request [ 10304 ] |
| Status | Ready for Pull Request [ 10304 ] | Pull Request Submitted [ 10101 ] |
| Status | Pull Request Submitted [ 10101 ] | Reviewing Pull Request [ 10303 ] |
| Status | Reviewing Pull Request [ 10303 ] | Merged Needs Testing [ 10002 ] |
| Assignee | Omkar Marne [ omarne ] |
The new table looks great! Moving to Done.
| Status | Merged Needs Testing [ 10002 ] | Post-merge Testing In Progress [ 10003 ] |
| Resolution | Done [ 10000 ] | |
| Status | Post-merge Testing In Progress [ 10003 ] | Closed [ 6 ] |
| Assignee | Omkar Marne [ omarne ] |
I have made changes to the required HTML file and I am getting the expected output but the genome versions are not loading.
Philip Badzuh Please let me know if that's expected.