show & tell - pinned item curation
TRANSCRIPT
I want (to select) it alland I want (to select) it now
We really need to sort the pinned items on our collection page Brian!
Pinned item curation discovery
YUP!
Pinned items (The pattern formerly known as featured items)
Here's a large list of content items I manage.
How do I pin the one(s) I want?
Pinned item 1 Profile - Published
Pinned item 2 Select an item to pin
Pinned item 3 Select an item to pin
Pinned item 4 Select an item to pin
Pinned item 5 Select an item to pin
Pinned item 6 Select an item to pin
So it works. Right?
Degrades nicely without Javascript
Pretty darn accessible ‘out of the box’
Just not that nice to use in context…
Pinned items
Pinned items
Pinned items
Pinned items
Pinned items
Pinned items
So yeah, it works. But it could be better.
The serious options
PROS - Current implementation - Simple & robust - Can see all available content - Accessible ‘out of the box’
CONS - Many items mean mucho scrolling - Hard to find 1 thing in 100s
The select elementChoose a content item pin
Choose a content item pin
Option 1 (Campaign) - Published
Option 2 (Project) - Published
Option 3 (Guide) - Published
Option 4 (Guide) - Published
PROS - Auto-filters as the user types - Returns results dynamically - Less scrolling needed - Clear indication of search success
CONS - Can’t see all items at once - User needs to ‘know’ the content
The free text box
Title
This is my best title
Shorter titles are better
I love writing titles
Don’t use titlecase
🔎
🔎
PROS - User gets all results and then filters - Updates dynamically - User can select *or* filter
CONS - Tweaks a well-known pattern - Requires custom JS to work
Search ’n’ filterChoose a content item pin
🔎
Choose a content item pin
Option 1 (Campaign) - Published
Option 2 (Project) - Published
Option 3 (Guide) - Published
🔎
Choose a content item pin
Option 3 (Guide) - Published
Guide
The other options
The list builder
It degrades to a multi-select box!This not going to end well.
The humble check box
PROS - Allows multiple selections - Can see all available content - Accessible out-of-the-box
CONS - Many items mean mucho scrolling - Hard to find 1 thing in 100s
X
Option 1 (Campaign) - Published
Option 2 (Project) - Published
Option 3 (Guide) - Published
Option 4 (Guide) - Published
Option 5 (Publication) - Published
Option 6 (Location) - Published
What next?
First iteration of collections uses the current implementation
Stories coming up to look at improving the UX
Test the various options to see how users respond