Open hlesaint opened 4 years ago
Potential contributors may attend virtual meeting of the ISMRM with their mobile phone, let's be prepared.
For short text it appears better when the features follow text and not below thumbnail (second example, bottom). Nice design is if features are positioned right hand side to the bottom of the thumbnail. And after break when text flows around thumbnail (as shown in the example images above). Features itself should not flow around text – either next to thumbnail or below.
other alternative, most simple and effective: figure, text, features.
Good point with the search bar. Another one regarding mobil mode: once you enlarge a figure via touch it can be difficult to close it again. Touch on the enlarged figure to close it again would substantially improve the usability.
There was a bug in my change to the search bar. I've fixed it now. I think 1 row is good for anything bigger than a phone, but 2 rows are necessary once screens are small enough.
Good point with the figure. I've had problems closing popups in the past. I'll try to make a second click close all popups and see how that works. For figures and sources I don't foresee any problems, but there might be complications with, say, comments, where clicking on the reply button opens a reply window, but clicking just outside of the reply button closes the comment window. I'll have to think about that.
That's true – although comments are likely clicked less often than figures and occupy smaller areas of the display after expansion. It should be therefore easier to click next to it to close a comment, as long as click next to it works immediately (sometimes it doesn't right now). A cross for closing comments could be also an option.
Besides an adapted layout for better readability on the mobile (figure, text, features from top to bottom, see last example above) there are some formatting issues in Firefox and Safari (iphone):
Sorry for the delay on this, I was close but got pulled aside by other work.
I think it looks good enough to browse now, but I haven't tested creation, commenting, etc. on mobile extensively yet.
Reopen this if you find anything broken.
I made the images bigger, and one thing that strikes me is that the captions now feel strange. The extract itself looks like the caption of the figure until you click the figure and see another caption.
To start with, we should get rid of the figure popup entirely on small screens, because it's already as big as the screen allows. Maybe that will fix the confusion.
Popups are still wonky, so I'm reopening this.
That looks neat. Showing the caption by clicking the figure comes quite naturally. Usually the caption appears below the figure, which helps to read and compare text with figure. In rare cases – when the figure is at the bottom half of the screen – the caption covers the figure. Having always the caption below the figure would be a bit more handy. Apart from that it's a very convenient and comprehensive design and usability.
Currently it is easy to change search term and filters, but this could change when many extracts are in the data base. Once you scrolled down for a while it would make sense to have some collapsed symbol on the top or top side that allows to expand either the search bar or the filter tags /the entire menu.
Specific errors:
In the desktop version, for some wider thumbnails the distance to the text is very close (see red frame – might be selective perception occurring in pandemic times).
The text is aligned properly, but it is too close to the figure. That's only apparent when the figure has colour on the right edge. I'll fix this.
As for the figures not displaying and disappearing, I can't reproduce this. I'd like to think it a transient error. Let me know if it comes up again.
I've also discovered that wide figures sometimes escape from the surrounding box they're supposed to be in. I'll track down the cause of that as well.
At a later time point ~stage 4 we could think about adjusting the layout slightly to display extracts better on a mobile device. This is primarily about the ratio of thumbnail, text, and features within one extract.
As the extract has limited width and hence extends in height there is a lot of unused space below the thumbnail. I'd suggest to always put the thumbnail top-left and text starts right next to it (as it is now), but the text flowing around the thumbnail (continues left below thumbnail). Features are below thumbnail and text.