|
Description
Liz Rea
2018-03-02 02:37:56 UTC
Created attachment 72342 [details] [review] Bug 20322: design refresh for circulation page do note, I don't actually mind if these aren't the changes eventually accepted. I just know it needs doing and starting it will hopefully get some gears turning. To test: Click all the links and check they work. Do you like the styling? it's different. :) Created attachment 72466 [details]
Screenshot
I just added a screenshot for easy review ;) Comment on attachment 72466 [details]
Screenshot
I think this looks like a really good start! Really glad you took this on Liz!
Some things I notice:
- Maybe offline circulation would look a little nicer as some kind of box on the right?
- Some icons could be added: Set library and Pending on-site checkouts. Maybe something like a house or building to indicate on-site?
- Do we need the note for overdues with fines? Or could we move it to the page itself?
And I would stick with col-sm-4 to have 3 columns on small and larger displays Created attachment 72484 [details] [review] Bug 20322 (follow-up) Circulation page layout and design update This follow-up makes some suggestions about how to push this further: - Put content in four columns which reduces to two on smaller screens - Adjust font size of large links - Move Offline Circulation links into its own column - Add image icons to the Firefox extension and Windows application download links - Improve indentation in template Created attachment 72490 [details]
Screenshot showing follow-up changes
Great job Liz and Owen! I would add only one think - more left margin to links to desktop offline application and firefox add-on. It would better show that these links belong to offline circulation section IMO. What do you think? I'm not keen on giving the offline circulation links that much importance for the amount they are used. I do like the icons on the download links though, that's neat. Maybe I'll revise your revision. ;) Cheers, Liz (In reply to Liz Rea from comment #9) > I'm not keen on giving the offline circulation links that much importance > for the amount they are used. > > I do like the icons on the download links though, that's neat. Maybe I'll > revise your revision. ;) > > Cheers, > Liz +1 Also there is a lot of text on the buttons which will probably not translate well. Something a little smaller might also work better for verbose languages like German :) Created attachment 73113 [details] [review] Bug 20322: (follow up) design refresh for circulation page Further revisions, compromise. - 4 columns to three - offline circulation demoted to below the intranet homepage preference, and no buttons, due to its relative lack of everyday use. Created attachment 73114 [details]
Screenshot of 3rd proposed changes
Created attachment 73271 [details] [review] Bug 20322: design refresh for circulation page do note, I don't actually mind if these aren't the changes eventually accepted. I just know it needs doing and starting it will hopefully get some gears turning. To test: Click all the links and check they work. Do you like the styling? it's different. :) Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Created attachment 73272 [details] [review] Bug 20322: (follow-up) Circulation page layout and design update This follow-up makes some suggestions about how to push this further: - Put content in four columns which reduces to two on smaller screens - Adjust font size of large links - Move Offline Circulation links into its own column - Add image icons to the Firefox extension and Windows application download links - Improve indentation in template Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Created attachment 73273 [details] [review] Bug 20322: (follow up) design refresh for circulation page Further revisions, compromise. - 4 columns to three - offline circulation demoted to below the intranet homepage preference, and no buttons, due to its relative lack of everyday use. Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> I really like it, giving it a first sign-off. :) This looks good. The links are all there. I only have one simple suggestion: tooltips. The overdues had blurby text beside them. title="blah blah blah" them, so the essence of the former text is still there. Created attachment 73300 [details] [review] Bug 20322: Follow-up with tooltips This puts similar old text into tool tips for the overdues. Hover over the overdues, and the tool tips should appear and be similar to what the text was before. Created attachment 73301 [details] [review] Bug 20322: Follow up on validator.w3.org extra /div The intranet-bottom.inc has the closing div, just deleted the last one. Created attachment 73302 [details] [review] Bug 20322: design refresh for circulation page do note, I don't actually mind if these aren't the changes eventually accepted. I just know it needs doing and starting it will hopefully get some gears turning. To test: Click all the links and check they work. Do you like the styling? it's different. :) Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Created attachment 73303 [details] [review] Bug 20322: (follow-up) Circulation page layout and design update This follow-up makes some suggestions about how to push this further: - Put content in four columns which reduces to two on smaller screens - Adjust font size of large links - Move Offline Circulation links into its own column - Add image icons to the Firefox extension and Windows application download links - Improve indentation in template Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Created attachment 73304 [details] [review] Bug 20322: (follow up) design refresh for circulation page Further revisions, compromise. - 4 columns to three - offline circulation demoted to below the intranet homepage preference, and no buttons, due to its relative lack of everyday use. Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Created attachment 73305 [details] [review] Bug 20322: Follow-up with tooltips This puts similar old text into tool tips for the overdues. Hover over the overdues, and the tool tips should appear and be similar to what the text was before. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Created attachment 73306 [details] [review] Bug 20322: Follow up on validator.w3.org extra /div The intranet-bottom.inc has the closing div, just deleted the last one. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Created attachment 73313 [details] [review] Bug 20322: Follow-up with tooltips This puts similar old text into tool tips for the overdues. Hover over the overdues, and the tool tips should appear and be similar to what the text was before. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Created attachment 73314 [details] [review] Bug 20322: Follow up on validator.w3.org extra /div The intranet-bottom.inc has the closing div, just deleted the last one. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Created attachment 74097 [details] [review] Bug 20322: design refresh for circulation page do note, I don't actually mind if these aren't the changes eventually accepted. I just know it needs doing and starting it will hopefully get some gears turning. To test: Click all the links and check they work. Do you like the styling? it's different. :) Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Created attachment 74098 [details] [review] Bug 20322: (follow-up) Circulation page layout and design update This follow-up makes some suggestions about how to push this further: - Put content in four columns which reduces to two on smaller screens - Adjust font size of large links - Move Offline Circulation links into its own column - Add image icons to the Firefox extension and Windows application download links - Improve indentation in template Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Created attachment 74099 [details] [review] Bug 20322: (follow up) design refresh for circulation page Further revisions, compromise. - 4 columns to three - offline circulation demoted to below the intranet homepage preference, and no buttons, due to its relative lack of everyday use. Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Created attachment 74100 [details] [review] Bug 20322: (follow-up) use tooltips for warning This puts similar old text into tool tips for the overdues. Hover over the overdues, and the tool tips should appear and be similar to what the text was before. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Created attachment 74101 [details] [review] Bug 20322: (follow-up) fix validator.w3.org complaints - extra /div The intranet-bottom.inc has the closing div, just deleted the last one. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> I'd prefer another icon for the "get desktop application" link. The KOC app is written in Qt and could be compiled for different OS. I think we should choose an icon representing a generic desktop app. Maybe something like this? https://thenounproject.com/search/?q=application&i=1490070 https://thenounproject.com/search/?q=windows&i=1088956 https://thenounproject.com/search/?q=windows&i=375632 (In reply to Katrin Fischer from comment #33) > Maybe something like this? > https://thenounproject.com/search/?q=application&i=1490070 > https://thenounproject.com/search/?q=windows&i=1088956 > https://thenounproject.com/search/?q=windows&i=375632 All these download at 700x700, when we need 16x16. And something about a black icon makes it an ugly contrast to the colorful firefox icon. (In reply to Jonathan Druart from comment #32) > I'd prefer another icon for the "get desktop application" link. > The KOC app is written in Qt and could be compiled for different OS. > > I think we should choose an icon representing a generic desktop app. How about we push this, because the rest is a significant improvement, and then discuss this one icon issue on a separate bug? Because I'd hate to see these get stuck in discussion forever, because of one annoying icon. I feel like, as and when we have a desktop application that is actually compiled and readily available for other platforms, it doesn't make sense to change it. (In reply to M. Tompsett from comment #34) > (In reply to Katrin Fischer from comment #33) > > Maybe something like this? > > https://thenounproject.com/search/?q=application&i=1490070 > > https://thenounproject.com/search/?q=windows&i=1088956 > > https://thenounproject.com/search/?q=windows&i=375632 > > All these download at 700x700, when we need 16x16. And something about a > black icon makes it an ugly contrast to the colorful firefox icon. Hi Marc, those are available as SVG vector graphics that can be resized to any size and colored any way you want. You can even download different colores. I also checked all are licensed under CC. (In reply to Liz Rea from comment #36) > I feel like, as and when we have a desktop application that is actually > compiled and readily available for other platforms, it doesn't make sense to > change it. +1 Created attachment 74577 [details] [review] Bug 20322: design refresh for circulation page do note, I don't actually mind if these aren't the changes eventually accepted. I just know it needs doing and starting it will hopefully get some gears turning. To test: Click all the links and check they work. Do you like the styling? it's different. :) Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io> Created attachment 74578 [details] [review] Bug 20322: (follow-up) Circulation page layout and design update This follow-up makes some suggestions about how to push this further: - Put content in four columns which reduces to two on smaller screens - Adjust font size of large links - Move Offline Circulation links into its own column - Add image icons to the Firefox extension and Windows application download links - Improve indentation in template Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io> Created attachment 74579 [details] [review] Bug 20322: (follow up) design refresh for circulation page Further revisions, compromise. - 4 columns to three - offline circulation demoted to below the intranet homepage preference, and no buttons, due to its relative lack of everyday use. Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io> Created attachment 74580 [details] [review] Bug 20322: (follow-up) use tooltips for warning This puts similar old text into tool tips for the overdues. Hover over the overdues, and the tool tips should appear and be similar to what the text was before. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io> Created attachment 74581 [details] [review] Bug 20322: (follow-up) fix validator.w3.org complaints - extra /div The intranet-bottom.inc has the closing div, just deleted the last one. Signed-off-by: Mark Tompsett <mtompset@hotmail.com> Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io> Created attachment 74582 [details] [review] Bug 20322: (QA follow-up) Use Font Awesome icons Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io> The follow-up is my two cents to get this pushed. The link is really pointing to both Windows and macOS downloads so I thought is was worth changing it like this, and using the icons we already have with Font Awesome. If there is disagreement, this can be put back in 'In discussion' status. I realize dropping my follow-up here and saying we are ready to go can feel rude, that's not my intention! (In reply to Tomás Cohen Arazi from comment #45) > I realize dropping my follow-up here and saying we are ready to go > can feel rude, that's not my intention! Also I told him he should do it! +1 Pushed to master for 18.05, thanks to everybody involved! It's all good, thanks everybody! Anyone is willing to add a quick release note? |