Orthopaedic Code-X saves you time, reduces errors, and provides quick access to all the data and functions you need to code and use ICD-10 with confidence. Navigate and integrate the following with incredible speed, accuracy, and ease.

• 2019 Current Procedural Terminology (CPT®) codes and cross-references for musculoskeletal, integumentary, neurologic, and radiology procedures
• 2019 ICD-10-CM codes and cross-references including V-codes
• 2019 AAOS Global Service Data guidelines featuring specific and detailed inclusions and exclusions and the global billing period for each CPT® code
• 2019 Medicare Relative Value Units (RVUs) and conversion factors
• 2019 HCPCS codes with two search paths to the data

Code-X has been a product that has always intimidated me. I’d like to give thanks to the wonderful team of knowledgeable individuals that were able to help me understand the nuances of coding orthopaedic procedures. The goal of this project was to respond to the voice of the customer and improve the applications user experience. The team for this project consisted of individuals from the IS and Online Learning departments. 

Research suggested that members wanted to see the product come to the 21^st century. So, instead of releasing the new 2020 Code-X as a downloadable program that runs on the user’s local drive it was moved to the cloud.

The main advantage is that users are granted access to the platform online, from any device. Users would also benefit from the UI upgrades that come with the Canopy Design System. A clean look was long overdo.

The old version of Code-X required users to open new windows within the product to search codes. Every time the user clicked on the CPT option in the navigation it would open a new window. The developers that designed it meant to give the user a way to open multiple codes and compare them.

This was a good idea in theory, but not in practice. Eventually, if not managed closely, the user would end up with dozens of tabs open. I began to think of a better way to display the content that would fit users’ mental model. During my research I learned that many ecommerce sites use pages where products are compared side-by-side. This web pattern attracted me, and I decided to use it to solve the many tabs issue.

Rather than repeatedly clicking on the nav option to compare codes users can easily find the code and click on the ‘add to compare codes’ button. The code would be added to the compare list in the order that they were added. Once on this page, users would be able to remove, or change the code. I quickly prototyped the flow and conducted remote moderated usability tests via LookBack. The results were positive. Our members were able to learn and use the new UI in short order.

Much of the content was restructured in the code detail view. The challenge was to reorganize the content in an easy to consume layout. In this case I leaned on the design systems typography size options to help. Knowledge on this product was scattered and held by multiple individuals making this a tough project. When I needed to fully understand an area, I had to speak to several individuals to piece everything together. This meant that I had to schedule a meeting or hope that they weren’t busy when I visited their cube. Looking back I realized that the team should have set up a space in Slack to accelerate communication.