CopasinID • Shipped 2024

A web-based plagiarism checker for academic documents

CopasinID Plagiarism Checker Hero Mockup

Role

Fullstack Developer

Timeline

Jan – Mar 2024

Team

1 Project Manager

1 System Analyst

1 Data Engineer

1 Web Developer

Tech Stack

React & Next.js

Tailwind CSS

Supabase

Overview

Copasin.id is a web-based plagiarism checker, originally developed as a university course project.

Theses, reports, and research papers—these are texts that users need to verify quickly. The main focus was to build a straightforward, easy-to-use web function that delivers similarity results instantly.

Copasin.id Interface Overview

Problem

Current plagiarism tools are overly complex and notoriously difficult to use, leaving students unsure of where to find a reliable platform.

Based on our observations of students writing theses and academic journals, we found recurring patterns of frustration. Interfaces are often cluttered with irrelevant features, making the core action of checking text hidden behind multiple unnecessary clicks.

Visualizing complex academic workflows

This complicated process was the biggest friction point. It caused frustration and drop-offs right before submission.

How can we make checking an academic document as efficient and straightforward as possible?

Solution

Zero-footprint backend processing.

The backend processes uploaded documents in memory without saving them to a permanent repository. This technical decision optimizes server load, allowing the system to handle massive amounts of text efficiently and deliver results instantly.

Frictionless and intuitive user experience.

We simplified the interface to focus purely on usability. By stripping away unnecessary elements, users can intuitively navigate the tool and focus strictly on the core function of getting their text checked.

A streamlined, straightforward process.

The entire workflow is incredibly direct. Users simply paste their text, click a button, and receive their similarity percentage right away without dealing with complex configurations.

Approach

Structuring the system logic with UML.

Before writing any code, I mapped out the core behavior using Use Case and Sequence diagrams. By clearly defining the login sequence and the text submission process, I could eliminate unnecessary interactions and keep the user flow incredibly direct.

Translating function into Figma prototypes.

I used Figma strictly to lay out the utility of the application based on the UML logic. The priority was on user experience—placing the text input front and center to ensure the interface was as straightforward and easy to use as possible.

Design

A functional visual system for clarity.

The visual elements—typography, color palette, and iconography—were chosen strictly to support usability. Clean, highly legible fonts make dense academic texts easy to read, while a minimalist, high-contrast palette clearly highlights similarity matches and guides user actions. Paired with simple, recognizable icons, the design reduces cognitive load and keeps the focus entirely on the core utility.

I built a centralized design system for consistent spacing, border radiuses, and color scales. This strict adherence to a grid and unified tokens ensured the transition from design mockups to the final coded application was completely seamless.

Outcome

Delivering a direct text verification utility.

The final deployment resulted in a fully responsive web application focused entirely on the core checking workflow. The system allows users to input their academic texts and receive similarity percentages directly. By eliminating unnecessary steps, the application provides a straightforward route from text input to the final report.

Reflection

What I learned

Good code controls user focus.

Translating a complex academic workflow into a minimalist interface taught me that every design decision either helps or hinders the user's primary goal.

Transparency builds trust.

Showing users the price upfront — before they commit — was the single biggest improvement in our user testing sessions. Simplicity and honesty go hand in hand.