The Plant asked Information Architects (iA) to explore how we could improve upon Qor, their flagship CMS used to power the websites of international brands like Asics, Denon and Lacoste. With the help of Oliver Reichenstein of iA I created new editing, media browsing and content management interfaces based on extensive research, wire framing and testing.
What I Did
To find out how Qor could be improved I first needed to find out how people use CMS software and the issues they face. I examined the current CMS ecosystem and compiled a matrix of the most popular software, allowing me to compare and contrast the features and approaches taken by other software vendors. I then presented this research to my colleagues at iA and The Plant, eliciting feedback on the different ways in which CMS software worked and the advantages and disadvantages of their approaches.
Findings from researching the current state of CMS software and the varying features and approaches taken by developers in solving the same problems.
The overriding opinion within this feedback was how the use of edit-in-place content editing seemed to always be poorly implemented, not offering a proper representation of the content in-situ or a comfortable editing environment for writing. Using this idea as a focal point, I developed the idea of displaying content within the CMS as a ‘greybox’ version, giving a representation of the content as it would appear on the site while stripping away colour, distractions and ornaments to allow a greater focus on working with the content while maintaining context.
Sketches within Balsamiq showing the idea of content being displayed within the editor as a greybox representation rather than directly as it appears on the site.
I explored how this interface could be tied in with layout tools and representing the website navigation, creating concepts for laying out pages where content might appear in a secondary state, such as showing recent posts on a homepage. The concept was then extended by adding interfaces for representing a site’s information architecture and for browsing and adding media. From here I refined and tested with my colleagues at iA and The Plant until I had a good representation of the CMS as a fully featured system.
An HTML prototype based on my earlier work in Balsamiq, testing how the representation of content as a ‘greybox’ version would work within the browser.
Finally, I wanted to see how this concept would work when moved from Balsamiq to the browser, so I developed a prototype in HTML of the major interfaces I had designed, showing how the system would work if it was used to manage the current iA website. Moving from the low fidelity Balsamiq sketches to high-fidelity HTML prototypes allowed me to define in much finer detail what the ‘greybox’ representation would look like and how the interaction points for editing the content and its member parts would behave.
How It Went
From a personal point of view I was happy to see that in a market as crowded as CMS software I was able to create a concept that was innovative and an improvement on current solutions. The research I conducted and interfaces I created were passed on to The Plant where they have been incorporated into the product’s feature roadmap.