learningequality
Design improvement: Discovery of "preview in Kolibri" action in Catalog
Background
The Catalog is frequently shared with partners and users as a way to give them a sense of what is in the Library, and we link to it prominently on the Kolibri product page as well. For many of them, this is their first experience with our products, and we want them to gain as full and rich an understanding and experience as possible. Given the limited metadata and lack of familiarity with many of these sources, a key part of that experience is navigating and viewing the content itself, and so the linking to the catalog demo servers is very important. We want those links to be easily discoverable, from both the list view and the detail view pages.
Current behavior
There is currently only one way to get to the content demo, and that's via the kebab menu:
From my own early experience interacting with it, and from countless calls where people say "Oh, I hadn't realized that was there", it has become clear that this isn't serving its intended purpose.
We have dedicated a top-level action icon for "copying the token", which is one of the less useful functions of the catalog, given these are all public channels that can be seen directly in the Kolibri import UI.
The main thing people do with the cards is click on them, which takes them to the channel metadata overview page. While some of this metadata may be of interest, most of it is very secondary in importance for a user who is "at the catalog stage". This page contains a section called "Sample content from this channel", which contains... unclickable thumbnails and titles.
There is no direct way to jump to actual content previews from within the channel summary page, so once someone is in here, they're even less likely to discover how to get to the content itself.
Suggested changes
Longer-term, we'll continue to iterate on overall UX. In the short term, the critical fixes I see are:
- Remove the "copy token" button from the card (they can still get it after clicking into the channel overview page)
- Add "Go to source website" and "View channel on Kolibri" as top-level action icons on the cards
- Remove the "Sample content from this channel" section, and add prominent, textual call-to-action buttons to navigate through to view the content in Kolibri, instead.
Thanks for the suggestions, Jamie. Here's my take at the suggested changes:
Better call-to-actions on the channel cards. We've removed the copy functionality on the card itself and swapped its position with a "View on Kolibri" button link. The "open in new tab" icon also is taken out of its current menu dropdown and placed on the card.
Removing the "Sample content from this channel" section and replacing it with a button at the very top that leads directly to the Channel in Kolibri
Sharing a solution to make the "view in kolibri" action more accessible from both the card and channel details view
Reprioritizing this now, as we have had some feedback from outreach to Studio users that has shown that this is still a problem for users.
