Featured Case Study · Web Application

PentaDosen: Lecturer Research & Performance Management Platform

A dedicated research, publication, and academic performance tracking platform for university lecturers.

ROLE Frontend Developer & UI Implementation
TIMELINE 2025
PRIMARY STACK React · Vite · Tailwind
CORE MODULES HKI · Research · Calendar
PentaDosen UI Dashboard Preview

01. Project Overview

PentaDosen is a dedicated web application designed to simplify how university lecturers document, organize, and monitor their research activities, academic publications, intellectual property (HKI), and performance metrics.

University lecturers are routinely required to report on research grants, publication submissions, patents, and community service milestones. PentaDosen gathers these disparate streams into a coherent, responsive dashboard.

02. The Problem

Prior to having a unified interface, academic staff faced several friction points:

  • Scattered Documentation: Research proposals, journal publications, and HKI certificates were stored across separate documents and email threads.
  • Unclear Performance Visibility: Lecturers had difficulty tracking accumulated research points and grant milestones in real time.
  • Missed Deadlines: Crucial thesis defense schedules, grant submissions, and review deadlines lacked an integrated academic calendar.

03. The Solution

PentaDosen introduces a clean, modular web dashboard that centralizes academic management into several key modules:

📊 Research Analytics & Grants

Live grant totals, H-index tracking, citations overview, and active project counts.

📑 Publication & Milestone Tracking

Categorized tables for journal articles, conference papers, and book publications.

🛡️ HKI & Intellectual Property

Status tracking for Copyrights (Approved), Patents (Pending), and Industrial Designs.

📅 Academic Calendar & Tasks

Monthly timeline for grant deadlines, thesis defenses, and faculty workshops.

04. My Contribution

As the Frontend Developer & UI Implementer, my responsibilities included:

  • Component Architecture: Built modular React components with Vite for fast HMR and lightweight bundle distribution.
  • UI Implementation: Translated wireframes into responsive Tailwind CSS layouts with clear typographic hierarchy and consistent spacing.
  • REST API Integration: Connected frontend views to backend endpoints for research listings, publication updates, and HKI status changes.
  • Data Presentation & Usability: Crafted clean status badges, modal drawers, and responsive table views tailored to faculty workflows.

05. Technologies & Architecture

React (SPA) Vite Tailwind CSS TypeScript / ES6+ REST API Integration Figma UI Prototyping