Muhammad Al Hafiz

Designed and developed a modern personal portfolio website to showcase my projects, technical skills, and professional experience. The website was built using Astro, Tailwind CSS v4, and shadcn/ui with a component-based architecture and Astro Content Collections for scalable project management. The UI was designed using Google Stitch and customized to create a clean, responsive, and professional user experience while following modern frontend development best practices.

Developed an AI-based object detection system for identifying five porang leaf conditions using the YOLOv8 architecture. The project applied Stratified 5-Fold Cross-Validation and dynamic data augmentation to improve model generalization, achieving 80.53% mAP@50 on the test dataset.

Developed a web-based Key Performance Indicator (KPI) Management System during my internship at PT Dipo Star Finance as IT Development Center Intern. The application was built using Laravel and MySQL as a foundational solution to support digital performance monitoring and reporting workflows. Throughout the project, I collaborated with my mentor and the Head of Department to define business requirements and implement core functional features, establishing the initial architecture for the system to be further developed and scaled by the company’s IT team.

Developed an Android application for detecting five common dental conditions using a YOLOv8-based computer vision model integrated with TensorFlow Lite. In this project, as Mobile Application Developer, I developed the Android frontend and application logic using Kotlin, implemented user interface flows, integrated REST APIs for authentication and examination history, and connected the YOLOv8 detection model to the mobile application. The application also provides healthcare facility information, dental examination history, and a dental-related chatbot.

Designed and developed a comprehensive e-wallet web application UI using modern frontend principles with a mobile-first approach and Tailwind CSS v4. The project features a complete financial user flow including a splash screen, interactive dashboard with balance visibility toggle, onboarding and 6-digit PIN registration, transaction history with search functionality, withdrawal forms, account settings, and multiple transaction status screens (Settled, Pending, Failed, Expired, Canceled). Built with a custom Brand Blue design system (#0D47A1 & #1565C0), centered desktop container limits (max-w-3xl mx-auto), and full accessibility compliance (axe-linter & WCAG standards).

Developed a responsive, mobile-first crowdfunding and charity donation platform interface named KitaBantu by translating design mockups into semantic and modular web pages using Tailwind CSS v4. The application features an end-to-end user journey across 18+ interconnected pages, including campaign exploration by categories, campaign stories and details, interactive donation nominal inputs, multiple payment method selections (Virtual Accounts and E-Wallets/QRIS), payment confirmation, complete user authentication flows (login, register, reset password), and profile management with donation history tracking.

Developed a responsive personal portfolio website as part of a frontend web development course using Tailwind CSS. The project showcases responsive layouts, reusable UI sections, smooth scrolling navigation, interactive animations, and mobile-first design principles. Through this project, I strengthened my understanding of utility-first CSS, responsive web design, and modern frontend development workflows.

Developed GoCheck, a simple TodoList app for organizing tasks and tracking completion progress. Users can add items, mark them as complete, sort the list by input order, title, or completion status, and delete individual items or clear the entire list. The app also displays completion statistics. TodoList data is stored in memory and resets when the page is reloaded.

Developed Split Bill App, a React application for managing shared expenses with friends. Users can add friends, select someone to split a bill with, enter the total bill and their own share, and choose who paid. The app calculates the remaining share and updates the balance to show who owes whom. Friend and balance data is stored in memory and resets when the page is reloaded.

Developed Pop Movie, a movie discovery application powered by the OMDb API. Users can search for movies, view details such as plot, cast, genre, runtime, and IMDb rating, then rate titles and add them to a personal watched list. The interface includes loading and error states, movie summaries, and scrollable lists. The project uses a component-based React structure to separate the application flow, UI components, and API service logic.

Developed a responsive landing page for a premium car showcase website by applying modern frontend development principles using Bootstrap 5. The project features a responsive navigation bar, animated hero section, service highlights, product showcase cards, company profile, and contact section, demonstrating practical implementation of responsive layouts, reusable UI components, and Bootstrap’s grid system.