Kristodea Connect

A school management system built around how the school actually works.

Schools often have the same problem as they grow. Admissions live in one spreadsheet, staff information in another, fees are tracked somewhere else, payroll sits in a separate file, and financial records end up scattered across spreadsheets, receipts and paper documents.

Kristodea Connect was designed to bring those processes into one system.

The brief was not simply to build a dashboard.

It was to create something a non-technical school administrator could use every day, while giving teachers and accountants their own focused tools.

The starting point was the school’s actual workflow.

01. Understanding the Workflow

we started by mapping what happens during a typical school term.

A student enrols.

They are placed into a class.

Fees are assigned based on the class and term.

Payments are collected and receipted.

Staff are managed and paid.

Money moves through different parts of the school.

Every transaction eventually needs to be accounted for.

That workflow became the foundation of the product.

Instead of designing the interface first and figuring out the data afterwards, the data model was established around the way the school operates.

Students, staff, classes, fee structures, payments and payslips all connect back to a central finance ledger.

This became one of the most important decisions in the project.

Once the ledger was right, the different parts of the system could feed into the same financial source of truth rather than maintaining separate numbers that would later need to be reconciled.

02. Information Architecture

The system was divided into role-based modules rather than putting everything into one large dashboard.

The main areas are:

Dashboard

Students

Staff

Teacher Portal

Finances

Promotion

Each area exists for a specific purpose.

An administrator needs a broad view of the school.

A teacher needs access to the information relevant to teaching and students.

An accountant needs detailed financial tools.

The interface therefore changes depending on the user’s role instead of presenting everyone with the same collection of controls.

Access is managed through a three-tier permission model connected to staff records.

This keeps the interface focused while also controlling which parts of the system each user can access.

03. Breaking Down Finance

Finance was one of the areas where information could become overwhelming very quickly.

Rather than putting every transaction and financial process onto one page, the Finance module is divided into focused areas:

School Fees

Canteen

Transport

Receivables

Payables

Budgets

This allows an accountant to work on a specific financial task without having to navigate through unrelated information.

More importantly, these modules still feed into the central ledger.

The interface is separated for clarity.

The underlying financial record remains connected.

04. Finding the Right Visual Direction

The first two visual directions weren’t right.

We explored a darker glassmorphism approach and then a more pronounced frosted-glass interface.

Both created interesting visuals, but they introduced too much visual character for a product that users might spend hours working inside.

The final direction moved towards a cleaner, medical-inspired aesthetic.

A warm beige canvas provides the background.

White cards create the main working surfaces.

Indigo-violet acts as the primary brand colour.

Yellow is reserved for accents and highlights.

The goal was calm and legible rather than visually impressive for its own sake.

Typography uses Plus Jakarta Sans for headings and Inter for body content.

Together they give the interface a structured but approachable feel.

05. Designing for Daily Use

The important part of a system like this is what happens after the first impression.

Administrators aren’t visiting it to admire the interface.

They are using it to get work done.

That meant small usability problems mattered.

During testing, several interactions felt unnecessarily awkward.

Instead of accepting those problems as part of the underlying framework, we rebuilt the specific interactions that were getting in the way.

Native date inputs were replaced with a custom calendar.

Dates are consistently formatted as 08/Sep/2026, and the calendar can navigate back as far as 1950.

Native dropdowns were rebuilt so that they open in a controlled direction rather than covering surrounding content.

Long financial tables use internal scrolling within their cards, with solid sticky headers that remain readable as the rows move underneath them.

These weren’t large visual changes.

They were small improvements based on watching how the product actually behaved during use.

06. Making School Fees Easier to Understand

The School Fees section received another focused interaction.

An administrator can search for a student by name and immediately see the outstanding balance.

This removes the need to manually scan a large table or cross-reference separate records.

It is a small feature, but it demonstrates an important product principle used throughout the system:

The interface should answer the question the user actually has.

If the question is “How much does this student owe?”, the system should make that answer easy to find.

07. One Financial Source of Truth

The most important architectural lesson from the project was the importance of the ledger.

When every financial module writes to one central source of truth, questions that would normally require manual reconciliation become system-generated answers.

These questions can be answered from the same underlying financial data.

This reduces duplication and makes the different parts of the product work together instead of becoming separate tools that happen to share a dashboard.

08. Designing for Accessibility and Clarity

The project reinforced something that is easy to forget when designing software.

Novelty is not always useful.

A visually impressive interface can still be difficult to use.

For Kristodea Connect, readability and clarity mattered more than visual experimentation.

The final direction gives users clear surfaces, predictable controls, strong hierarchy and enough visual separation to understand where they are and what they can do.

The interface stays out of the way.

That was the point.

The Outcome

Kristodea Connect replaces a collection of disconnected administrative processes with one connected system.

Students, staff, classes, fees, payments, payroll and financial records all exist within the same product.

Different users get different views based on what they actually need.

Financial activity flows into a central ledger.

And the interface is designed around the practical realities of using the system every day.

The result is not simply a cleaner dashboard.

It is a system that turns the school’s existing workflow into something structured, searchable and accountable.

Designed and engineered by Evuve.