Illufox Kusanagi PORTFOLIO // V2.0 BOOT
WEBGL 2.0
+
000%
3D ASSET COMPILATION INITIALIZING SHADER PIPELINE
PIPELINE: THREE.JS + DRACOTARGET: 60 FPSSTATUS: DECOMPRESSING
Personal Website

Muhammad Arief
Satria Wibawa

Junior Software Engineer /
Full-stack Developer

Scroll to explore ↓

TECH-STACK

Frameworks ever used in projects

Frontend
side icon
React.Js
01 / 08

React.Js

Building modern responsive web applications with state management and clean UI engineering.

Experience: 2 yrsProficiency: Intermediate
Desktop
side icon
Qt Framework
02 / 08

Qt Framework

Developing high-performance native desktop applications with memory-safe architectures and cross-platform widget toolkits.

Experience: 2 yrsProficiency: Intermediate
Fullstack
side icon
Next.Js
03 / 08

Next.Js

Building full-stack web applications with server-side rendering, file-based routing, API routes, and SEO-optimized static generation.

Experience: 2 yrsProficiency: Intermediate
Frontend
side icon
Vue.Js
04 / 08

Vue.Js

Building responsive web applications using Vue 3 Composition API, Pinia, Vue Router, and reactive component architectures.

Experience: 1 yrProficiency: Junior
Fullstack
side icon
Nuxt.Js
05 / 08

Nuxt.Js

Building SSR and SSG applications with file-based routing and auto-imported composables.

Experience: 1 yrProficiency: Junior
Backend
side icon
Laravel
06 / 08

Laravel

Building scalable server-side applications with Blade templating, Eloquent ORM, and well-structured MVC backend architectures.

Experience: 1 yrProficiency: Junior
Backend
side icon
Elysia.Js
07 / 08

Elysia.Js

Building lightweight, high-throughput REST APIs with end-to-end type safety and schema validation for rapid backend prototyping.

Experience: 0.5 yrProficiency: Junior
Styling
side icon
Tailwind CSS
08 / 08

Tailwind CSS

Designing scalable utility-first design systems and custom design tokens.

Experience: 3 yrsProficiency: Intermediate
01 / 08

TECH-STACK

Tools and software used daily

DevOps
side icon
Git & GitHub
01 / 09

Git & GitHub

Managing branches, PR workflows, CI/CD actions, and versioning.

Experience: 3 yrsProficiency: Intermediate
Design
side icon
Figma
02 / 09

Figma

Crafting UI/UX mockups, interactive prototypes, and design system tokens.

Experience: 2 yrsProficiency: Intermediate
IDE
side icon
Antigravity
03 / 09

Antigravity

Leveraging agentic IDE workflows, custom skills, and autonomous pair-programming protocols to rapidly architect, build, and validate production-ready applications.

Experience: 2 yrsProficiency: Intermediate
DevOps
side icon
Docker
04 / 09

Docker

Containerizing applications, creating environment-isolated microservices with Docker Compose, and streamlining multi-stage deployment builds.

Experience: 3 yrsProficiency: Intermediate
Database
side icon
PostgreSQL
05 / 09

PostgreSQL

Designing normalized relational schemas, crafting optimized SQL queries, leveraging pgvector embeddings for RAG-powered AI search, and managing index strategies.

Experience: 2 yrsProficiency: Intermediate
Database
side icon
MySQL
06 / 09

MySQL

Architecting relational database schemas, tuning multi-table join performance, and optimizing query execution plans to reduce latency.

Experience: 2 yrsProficiency: Intermediate
ORM
side icon
Drizzle
07 / 09

Drizzle

Building type-safe database queries, managing declarative schema migrations, and handling relational models seamlessly.

Experience: 2 yrsProficiency: Intermediate
AI Coding Agent
side icon
Open Code
08 / 09

Open Code

Utilizing terminal-driven AI coding agents to automate repetitive engineering tasks, streamline multi-file refactoring, and accelerate feature delivery.

Experience: 1 yrProficiency: Intermediate
DevOps
side icon
GitHub Actions
09 / 09

GitHub Actions

Architecting automated CI/CD pipelines, multi-platform matrix builds, release packaging with windeployqt, and automated testing workflows.

Experience: 2 yrsProficiency: Intermediate
01 / 09

TECH-STACK

Core programming languages

Language
side icon
TypeScript
01 / 03

TypeScript

Writing type-safe, modular, and asynchronous client and server code.

Experience: 3 yrsProficiency: Intermediate
Desktop Dev
side icon
C++
02 / 03

C++

Developing native desktop applications using Qt Framework, managing low-level memory safety, pointers, and object-oriented architectures.

Experience: 2 yrsProficiency: Intermediate
Website
side icon
PHP
03 / 03

PHP

Building robust web application backends and administrative systems leveraging Laravel's MVC ecosystem.

Experience: 2 yrsProficiency: Intermediate
01 / 03

PROJECTS

Selected Works & Systems

PROJECT
side icon
TRAIN SIMULATION APP

TRAIN SIMULATION APP

Simulate Train Details to Observe Various Variables and Optimize Using Fuzzy Logic

A hybrid desktop simulation and multi-objective optimization platform that executes longitudinal train dynamics—integrating piecewise tractive effort curves, multi-component Davis and track resistances, and multi-stage electrical power flow integration—coupled with a self-calibrating dynamic Mamdani fuzzy inference engine to automatically resolve non-linear parameter trade-offs between operational travel time, peak electrical power demand, and cumulative energy consumption.

TECH-STACK
C++
Qt
Next.js
TypeScript
Git
GitHub Actions
READ TECHNICAL BOOK
PROJECT
side icon
HORIZON CANVAS

HORIZON CANVAS

Generate your image to forza horizon 6 livery

A GPU-accelerated desktop utility that translates any raster image into a sequence of geometric primitives and injects the shape coordinates directly into Forza Horizon 6 livery layers. Built with C++ and the Qt Framework, the scoring loop runs on OpenCL compute kernels, evaluating millions of primitive candidates per second for optimal visual fidelity.

TECH-STACK
C++
Qt
Git
GitHub Actions
DOWNLOAD APPSource Code
PROJECT
side icon
MY OKANE

MY OKANE

Your personal budget management app

A comprehensive budget management application for seamless personal finance tracking. Built with Nuxt for SSR performance, Drizzle ORM and SQLite for type-safe data persistence, and Sentry for error monitoring.

TECH-STACK
Nuxt
TypeScript
Sentry
Drizzle ORM
SQLite
Figma
Git
Live Demo →
PROJECT
side icon
MY CARS

MY CARS

Interactive 3D Web Application To Show GT-R Models

A high-performance 3D automotive showroom specifically for the GT-R family built with Three.js, WebGL, and Vue 3. Features realistic physically-based rendering (PBR) materials, dynamic camera orbit controls, custom factory paint selector, model picker, and environment lighting selector.

TECH-STACK
React
Three.js
TypeScript
Figma
Git
Vercel
Live Demo →Source Code
PROJECT
side icon
SATE ITIK

SATE ITIK

Sistem Akses Terpadu Infrastruktur Jaringan TIK

An integrated government network infrastructure monitoring system built with Next.js and MySQL. Includes a real-time internet infrastructure dashboard with Mapbox GL, a comprehensive e-ticketing support system, an activity calendar, server health tracking, and secure role-based access via Next Auth.

TECH-STACK
Next.js
TypeScript
Drizzle ORM
MySQL
Mapbox GL
Next Auth
Git
Live Demo →
PROJECT
side icon
MY QURAN

MY QURAN

Your personal Al-Quran app with interactive book-like view

A full-stack Quran reading application with an interactive page-flip book interface. Features surah navigation, ayah bookmarking, and audio recitation. Built with Vue on the frontend, backed by an Elysia.js API, PostgreSQL, and containerized with Docker for consistent deployments.

TECH-STACK
Vue
TypeScript
Drizzle ORM
Elysia.js
PostgreSQL
Docker
Git
Live Demo →
PROJECT
side icon
MY LIBRARY

MY LIBRARY

Interactive book management app for librarian

A web-based library management system that eliminates manual logging for librarians. Borrowers can browse available books and submit borrow requests; librarians can accept, reject, or block books through a role-based admin interface. Built with Laravel, MySQL, and containerized with Docker.

TECH-STACK
Laravel
MySQL
PHP
Docker
Git
Live Demo →Source Code
PROJECT
side icon
IMAGE CONVERTER

IMAGE CONVERTER

Convert any image format to any image format

A portable offline desktop utility for batch image format conversion and quality reduction. Works like iLoveIMG but runs entirely locally — no uploads, no internet, no installation required. Supports percentage-based quality control and ships as a single portable executable.

TECH-STACK
C++
Qt
Git
GitHub Actions
DOWNLOAD APPSource Code
PROJECT
side icon
LARAS

LARAS

Your Self-Care App

A self-care application designed to help you become more mindful, calm, and grounded. Featuring guided meditation, relaxation audio, and personal journaling, Laras serves as a dedicated companion for supporting your mental well-being.

TECH-STACK
React
TypeScript
Git
Live Demo →
PROJECT
side icon
EXCEL FORMATTER

EXCEL FORMATTER

Your excel numbering format is messed up? Use this app to convert it!

A portable desktop utility that corrects malformed number formatting in Excel spreadsheets — recognizing both dot and comma as decimal separators. Supports batch processing across multiple sheets in a single file via a simple drag-and-drop interface. No installation required; ships as a single executable.

TECH-STACK
C++
Qt
Git
GitHub Actions
DOWNLOAD APPSource Code
01 / 010

EXPERIENCE

Work & Project Experience

Jan 2025 - Jun 2025

PT INKA — DESKTOP APP DEVELOPER

Architected a high-performance desktop train simulation application using C++17 and the Qt 6 Framework (QWidgets, QChart, QFile), packaged as a portable Windows-only executable via windeployqt.

Enforced strict memory safety using a centralized AppContext singleton as the single source of truth for all shared state, eliminating cross-module data races between simulation controllers.

Structured the codebase into layered handler modules — ElectricalDataHandler, TrainDataHandler, TrackDataHandler, MovingHandler, EnergyHandler, ResistanceHandler, TractiveEffortHandler — each with isolated responsibilities aligned to the physics domain.

Implemented simulation logic covering tractive effort curves, Davis running resistance, track gradient/curvature, real-time braking calculus, and multi-car mass inertia using custom prefix-notation variable conventions (f_, v_, p_, e_, mass_).

Delivered real-time charting with QChart, CSV export via QFile, and a login-protected parameter entry UI, packaged as a zero-install portable executable for operator deployment.

Configured automated GitHub Actions CI/CD pipelines for continuous build validation across MinGW-64 toolchain.

AWARDS & CERTIFICATES

Interactive Certification Portfolio & Verification Dossier

IC3 GS6 Level 1
BNSP - Software Quality Control Tester
Dicoding - Basic AI
Dicoding - Basic Web
Sanbercode React Js Web Frontend
Final Project Competition
INKA - Basic K3 Training
BNSP - Digital Marketing
AWARDS & CERTIFICATES
BNSP

INITIATE CONTACT

Get in touch for collaborations, projects, and opportunities

LET'S BUILD SOMETHING EXTRAORDINARY

Have an ambitious project, an interactive 3D web experience, a simulation system, or a technical inquiry? Send a transmission below and let's turn ideas into robust software.

TYPICAL RESPONSE TIME: < 24 HOURS

INITIATE CONTACT