Theme Experience (THX) in core WordPress

For the past couple releases of WordPress I had the privilege of working on revamping the admin theme screens, probably my biggest core contribution since developing Twenty Eleven. Working on the theme showcase was one of the first side projects I did at Automattic, when we were just Lance, Ian and me on the Theme Team; and I’ve worked on the many iterations since then, so I’m glad I could bring part of that knowledge to help improve the core theme screens.

The project was initially called THX38 and started as a plugin during the 3.8 release cycle. After some user tests we settled on a complete revamp of the experience, using client side technologies to make it faster and more responsive. The design removed most of the text in the screen, allowing people to focus primarily on the theme screenshots. (I’m personally fond of the arrow navigation system that lets you browse themes casually with the keyboard — maybe coffee cup in the other hand. It’s a somewhat relaxing way of looking at themes.)

It uses Backbone.js to power the client side code, something many parts of the WordPress administration panels are starting to leverage. It’s a good bridge between the robustness of the current server side codebase and more dynamic technologies to help achieve better user experiences on the client — things like searching for an installed theme is instant. We managed to get this in very close to the release deadline. Another positive result is we ended up with leaner code than before, something that would help with future improvements.

For 3.9 (just released, go grab it or upgrade!) I worked on using the same architecture and UX to power the install-themes screen, which wasn’t touched in 3.8. This meant interacting with the .org API for querying themes. Again, this made it just in time. The end result is a faster and image focused browsing experience, that also paves the way for future iterations in the versions to come. That’s something I really like — we’ve now had two subsequent releases improving core aspects of the theme experience. This agile process aligns with the momentum that core WordPress development has been gaining since the last few releases, with rapid cycles during the year, and we are looking at even more improvements around multiple screenshots, filtering system, etc. We now have a solid base for it.

Thanks to everyone that helped getting this out there, during every milestone we passed — and my special gratitude to Shaun, Andrew and Gregory.