Media listings UX improvements via GSoC 2025
Enhancing the user experience of Wagtail’s media listings over the summer
As part of the Google Summer of Code (GSoC) program, I joined the Wagtail project from June to August, contributing to open source with guidance from experienced mentors.
The project: improving media listings
In Wagtail 7.0 and earlier, Media listings were tricky to navigate. Users had to open each item individually to see usage information – meaning extra clicks and page reloads. This not only affected the user experience but also the performance and sustainability of Wagtail. I chose to work on this as part of GSoC as there was a clear need for improvements, with 10 years since the first request for those listing improvements!
This wasn’t part of pre-selected project ideas for Wagtail, but I identified this while navigating Wagtail’s backlog of issues and thought it be a good fit for a project nonetheless.
Improvements in Wagtail 7.1
Wagtail’s 7.1 release contains some of the early improvements from this project:
- Image listings support a new list layout with a toggle to switch back to grid layout as you like (shipped in PR #13172)
- This new list layout comes with a new usage count column with support to sort the images (shipped in PR #13234).
- We also added this usage count column and sorting support to documents listings for consistency.
Here is what the new list layout for image listings looks like, with sorting from low to high usage counts:
Improvements coming to Wagtail 7.2
The upcoming 7.2 release due in November will include filtering by usage count for images and documents (PR #13291):
We expect this will greatly speed up finding images that are never used, or images that show the highest amounts of uses.
Future enhancements
As well as shipping those improvements, we also reviewed and planned likely next steps that fall beyond the scope of this project.
- Loved the new list layout of image listing? A more informative chooser design is in the works as well. If you want to contribute to this, add a comment on GitHub.
- A new and improved layout toggle design with better UX is planned for implementation next.
Behind the scenes
I had never tested code for performance and sustainability at this scale before, and learned a lot. Displaying usage counts while ordering media by usage efficiently was the biggest challenge. We explored different approaches like denormalization, bulk references, to create an optimized query since even small changes can impact performance.
The result: Image listing now displays usage counts with an average loading time difference of less than 20 ms. See more about our performance tests.
Here’s everyone who made this project possible.
- Contributor: Joel William - Computer Science Undergraduate
- Mentors: core team members Coen van der Kamp, Sage Abdullah, Thibaud Colas, Wagtail lead designer Ben Enright.
Wondering how you can do it?
It’s not just established contributors who can build impactful features, newcomers can too. Wagtail has excellent documentation to help you get started – whether fixing issues or adding new features. Check it out here: First Contribution Guide And join our Slack community’s #new-contributors channel – it’s a great place to start your journey.