CMS Usability assessment

Overview

Whilst working for a large magazine company, with 60+ magazines, with matching websites: I  started work on the coding of their centralized, content management system or CMS.  The CMS was used heavily by hundreds people each day. Their posts, galleries and competitions, feeding each of their magazine site with content. I quickly assessed many usability, and communication issues with the CMS system, and so took the initiative and started a usability assessment of the web applications modules and pages.

In summary, over several few months I worked on and delivered;

  • A detailed report breaking down the usability and visual communication issues in the CMS.
  • A series of high fidelity mock up images of the interface showing the system if the improvements are achieved.
  • A set of visual rules from the mock-ups,  for the CMS system. To use in their agile method for future code development.
  • A series of subtle development changes to meat the mock ups and rules, across the CMS system.

These greatly improved the usability of the system as a whole, whilst dramatically reducing cost to the user, and speeding time to market for content across all magazine brands.

Method and practice

  • Developed a usability strategy document, detailing: tasks, criteria, kpi’s and goals of usability testing to be carried out.
  • Conducted the user testing with a selection of system users, across departments.
  • Assessed the sites visual communication, and I justified relational groups biased on the visual communication and function of elements.
  • I mocked out page designs updates for 10 pages from the CMS. Applying improvements to the relational groups and usability issues identified.
  • From these designs, I broke down the changes into development stories to work as incremental updates to the system, applicable in a agile software development process.
  • I gave a presentation to key stakeholders and technical leaders, showing the existing issues,  solutions, and business gains now and in the future, to justify the work.
  • I code developed the stories back into the CMS system, articulating the designs, and made technical notes, so that other developers could use the improved system to make structural changes i.e. componentise now similar pages.
  • I wrote a selenium smoke test suite to run automated tests across the whole CMS system.
  • I collated my documentation, and created a application layout guide or ‘ALG’, detailing the visual groups, and relationships  for future development of modules in the CMS, which was subsequently used by several teams implementing new CMS modules.

Results

The assessment and documentation, enabled a subtle change to the CMS systems appearance which was reported to improve the speed at which users could navigate, and their ability to quickly find meta data field to fillout on there post.

Examples;
Slide show

Coming soon…

Mock-ups

After creating visual notes, and exploring different styles of treatment, the following mock-ups where developed

Dashboard

Old                                                                                                                                                   New

Articles List

Old                                                                                                                                                     New

Zoom-ins

 

 

 

 

Tags: , ,





Leave a Reply