Atlassian uses cookies to improve your browsing experience, perform analytics and research, and conduct advertising. Accept all cookies to indicate that you agree to our use of cookies on your device. Atlassian cookies and tracking notice, (opens new window)
UX: Create Mockups for Search and Select Fields and Buttons on Checkout
Description
Purpose: The fields we currently have on the Checkout app for searching and selecting patrons and items are dev-designed and need rethinking from a UX perspective. Some things to consider:
The primary way the checkout page will be used will be via barcode scanner. Scan patron library card, then scan books.
Required use of the keyboard or mouse should be minimal to none
The reason we have two data entry fields with buttons to the right is because we don't yet have scanner integration and needed a way to enter a barcode manually
We then implemented the "user search and select modal" which allows you to search for a user in case you don't have the barcode to scan or enter. This is a useful feature that will remain in the system even once we have scanner integration. The developers made this feature available via a magnifying glass icon on the left of the enter patron field but no designer has put any thought into that.
We will need an item search and select modal, as well, for finding items when the barcode isn't handy or can't be scanned. We haven't implemented that yet, but these mock-ups should show how such a thing would be accessed.
In scope for this story:
Revise current fields, buttons, layout as you think might make sense
Review with the SIG to get feedback
With final mock-ups, it would be great if you could include information about what happens to the cursor focus with each action (e.g. cursor focus moved to Item select box after user is selected)
Environment
None
Potential Workaround
None
Checklist
hide
TestRail: Results
Activity
Show:
Kimie Kester October 27, 2017 at 3:40 PM
JFYI - @Cate Boerema, I just updated my comment above to point to the new latest mock which includes updates from the RA SIG mtg on 10/26
Kimie Kester October 25, 2017 at 5:29 PM
Hi @Cate Boerema. @Filip Jakobsen and I went over the screen today and we talked about the new approach of simply saying "Patron look-up" and "Item look-up" and he was fine with it, so I am glad you closed this story. thanks.
Kimie Kester October 24, 2017 at 3:32 PM
It seemed like someone was not convinced and had latched onto the magnifying glass method. I'm not sure who it was. I could do some more research as to general best practices for this sort of thing if you want. What do you think? You want to close it?
Cate Boerema October 24, 2017 at 3:17 PM
I think the SIG was fine with your changes for these fields, don't you Kimie? I would say we can close this one. I'll close it.
Kimie Kester October 19, 2017 at 3:18 PM
Edited
Based on a meeting today with @Cate Boerema, I've updated the mock-up to include a few ideas in Google Drive at: FOLIO > FOLIO UX Designs > Check-out > Patron Info > checkout-items-scanned-4.png
Purpose: The fields we currently have on the Checkout app for searching and selecting patrons and items are dev-designed and need rethinking from a UX perspective. Some things to consider:
The primary way the checkout page will be used will be via barcode scanner. Scan patron library card, then scan books.
Required use of the keyboard or mouse should be minimal to none
The reason we have two data entry fields with buttons to the right is because we don't yet have scanner integration and needed a way to enter a barcode manually
We then implemented the "user search and select modal" which allows you to search for a user in case you don't have the barcode to scan or enter. This is a useful feature that will remain in the system even once we have scanner integration. The developers made this feature available via a magnifying glass icon on the left of the enter patron field but no designer has put any thought into that.
We will need an item search and select modal, as well, for finding items when the barcode isn't handy or can't be scanned. We haven't implemented that yet, but these mock-ups should show how such a thing would be accessed.
In scope for this story:
Revise current fields, buttons, layout as you think might make sense
Review with the SIG to get feedback
With final mock-ups, it would be great if you could include information about what happens to the cursor focus with each action (e.g. cursor focus moved to Item select box after user is selected)