CheckIT Learning Platform
Overview
Challenge
Problem: when I arrived at the company there was only one designer in the team, and all design was created in Adobe XD - already back than discontinued software. There was no design system in place, the platform lacked consistency in some areas and made the design work slower. Design workflow between developers and designers needed to be restructured. So the first task was to convert XD files to Figma, mostly done by hand since conversion plugins didn't provide optimal results. Next task was to create clear structure of new files and naming standards that follow development cycles.
Once the main bottleneck in a workflow was dealt with, the design team was able to focus on the product challenges. At this point the product was already 2 years old and founders realized late in the game that their original approach needed to be redesigned almost from the ground up, since the existing product didn’t work well on the market. At the same time when I arrived new learning specialists was introduced to help with this transition. Together we created a Low-Fi UX workflow of the ideal platform and pinpointed main topics that needed to be researched to fill the gaps. What helped us a lot was that we did a competitive analysis and we did preliminary interviews with other learning specialists.
Constraints: Since there was already a lot of code done the main constraint was to use as much existing code and design into the new platform. So there was constant negotiation on the 3 topics: can we use what we have? can we tweak what we have? do we need to start from scratch. We did that so that we could keep the scope doable and fit into the time frame
Approach
General approach: Since the main issue in the design process of the previous platform was lack of research and testing with customers we decided to actually do that. There were many initiatives covering different aspects of the platform for all the user roles, but in this case study I will focus on teachers since they use the app most out of the mentioned roles.
Research: We designed a research for 15 teachers in 2 phases. In the first phase we did a workshop where we figured out what the main pain points in their work were, how does that relate to our platform and how we can improve it. In the second phase we did individual interviews where we shadowed them in their daily computer work with the idea to figure out if there was something left out in the workshops and to get a better understanding of their work.
Key insights: The main issue with the existing solutions teachers face were: constant app switching, lack of integration between the apps, big amount of time during the week was spent on the mundane administrative tasks which took them time and energy from the students and teaching. Some of the issues were trivial UX problems, some were on the system level lack of features.
When creating online lectures teachers had a problem that they needed to assign each student one by one since the students were not organized in the fashion they needed and they had no ability to make their own groupings.
All of the teachers were complaining that they needed to use many different apps over the day in order to finish simple tasks. One teacher had 16 different apps, almost every job was a separate app. What added complexity was that they were not integrated, so teachers had to copy-paste the same data in multiple places. For example curriculum app was not connected with reporting app, so in the reports they manually had to input names of their lessons.
Design decisions: we decided that we need to streamline the whole teacher-student workflow and cover all main needs in one integrated platform solution.
Solution
Final designs: are screens made in Design System 1.0 showing: dashboard, course content, activities, course grade evaluation, student roster, and calendar:
Important interactions: here you can see design tackling assigning issue teachers were facing. Teacher can choose 3 assigning options: everyone (select all students available for the content type), sections (select specific sections of students) and individual students (allows filtering, sorting, batch selection of students).
Branding and a transitional design system: when I arrived there was no design system but there was a visual language, colors, and typography in place, but it wasn’t always consistent and in some cases same UX patterns were using different approaches. It was also clear that CheckIT had other products that could benefit the same design system with custom theming. Since redesigning a whole platform went against the idea of reusing existing code, we had a transitioning design system first and later I did a completely new design system. For the transitional design system we took all the existing components, audited them, simplified them and made clear color and typography styles. What was possible to do without any refactoring is branding, so I created a design language and redesigned all the logos of the products under CheckIT Labs umbrella.
CheckIT design system 2.0: once there was right time for the team I made a completely new design system that can be used for all the products. It had to follow WCAG accessibility standards (something that was brought up on several occasions in the research), support easy theming (needed for different brands and dark and light interface, requested by many users), and support large desktop monitors (used by administration and teachers) and small notebook devices (used by students). To achieve this I used design tokens and collaborated with developers in order to be on the same page and make sure that designers program (Figma) and code base used by front end had the same values, look and feel.
Impact
Results For Users:
Teachers experienced a more unified workflow by reducing the need to switch between multiple disconnected tools.
Administrative tasks such as grading, attendance, and course management became more centralized, reducing manual duplication of work.
The new student selection feature made it easier for teachers to organize students into meaningful groups, improving how they distribute and delivered lectures.
Overall, the platform became more predictable and consistent, reducing confusion caused by previously fragmented UI patterns.
Results for the team:
The introduction of user research shifted the design process from assumption-driven to evidence-based product development.
The transition design system improved consistency across existing products while allowing the team to continue development without a full rebuild.
CheckIT Design System 2.0 created a shared foundation between design and engineering through design tokens, improving implementation speed and reducing UI discrepancies.
Collaboration between design and development teams became more structured, especially around prioritization of what to reuse, adapt, or rebuild.
The ecosystem of CheckIT Labs products became visually and structurally aligned, enabling easier expansion into new markets and product lines.
Lessons learned:
Working in a legacy system with existing code constraints forced constant negotiation between ideal UX and technical feasibility, which shaped a more pragmatic design approach.
Introducing research late in the product lifecycle highlighted how much design decisions depend on early validation.
Building two design systems (transition + final) showed the importance of incremental change when working with large, established code bases.
One of the key takeaways was that in enterprise products, solving fragmentation is often more valuable than introducing new features.