Portfolios
Projects
Hi-Fi Desktop UI – Internship Project
This project was created during my UI/UX internship, my main contribution was translating provided low-fidelity wireframes into a consistent high-fidelity desktop UI.
SabiKerja Redesign and Website Development
Performed competitor analysis, strategic planning, and a full website redesign for SabiKerja to improve structure and user experience. Executed end-to-end website development, ensuring responsive layouts, optimized content flow, and a modern interface that aligns with the brand’s goals and enhances overall platform performance.
Implementation of Tool Borrowing Monitoring System
Developed a web-based laboratory equipment borrowing system for Politeknik ATMI Surakarta using HTML, PHP, JavaScript, and MySQL. Integrated QR codes, RFID scanning, and a digital coin balance system to replace manual processes. Added real-time tracking, webcam documentation, and automated email notifications via Mailgun to enhance accuracy, accountability, and overall lab management efficiency.
Data & AI
Generative AI Development based QnA service with Django
Completed a Fast Campus course project developing a Generative AI-based QnA service using Python, Django, JavaScript, HTML, CSS, Gemini API, and Postman. The web application integrated generative AI for dynamic QnA interactions, demonstrating backend and frontend development, API integration, and practical implementation of AI-powered features in real-world web applications.
Image Recognition with OpenCV & TensorFlow
I completed a Binus exam project on Image Recognition using OpenCV and TensorFlow in Google Colab. Using the Intel Image Classification Dataset, I built a full pipeline covering data preparation, visualization, CNN model development, evaluation, and predictions. The CNN with convolution, pooling, fully connected, and dropout layers demonstrated effective deep learning for image classification.
Contour Detection in Computer Vision
I completed a Binus exam project on contour detection using OpenCV in Google Colab with the Intel Image Classification dataset. The workflow included grayscale conversion, Gaussian blur, Canny Edge Detection, and contour extraction. Results compared original images, edge detection outputs, and contours, with added functionality for real-time analysis of manually uploaded images.
Case Study of Product Stock Optimization Using Hill Climbing with Constraints
I completed a Binus practicum project on product stock optimization using Hill Climbing with constraints in Google Colab. Using the mlrose_hiive library, I simulated profits for 15 products and applied a custom fitness function with stock limits. The algorithm identified the best product combination, maximizing profit while addressing retail inventory challenges.
A Case Study of SpaCy-based Named Entity Recognition (NER)
I completed a Binus practicum project on Named Entity Recognition (NER) using spaCy in Google Colab. The system extracted organizations, people, and locations from short English news articles with the en_core_web_sm model, presenting categorized results and analysis. This project demonstrated NLP applications for content understanding, including news recommendation systems and information retrieval chatbots.
Short Course Binus Program Data Science Advanced Level
I completed a Binus Short Course in Data Science (Advanced Level), where I developed an interactive Power BI dashboard analyzing UMKM data in Sleman Regency. The project visualized over 110K businesses across 17 sectors, highlighting micro-level dominance and providing valuable insights into SME distribution, economic characteristics, and regional growth potential.
Data Science Dibimbing Digital Fair
I completed a data science course by Dibimbing, where I built a predictive pipeline using Kaggle’s Titanic dataset to estimate survival chances. The project involved exploratory analysis, handling missing data, transforming categorical variables, and feature engineering (FamilySize, Title, AgeGroup) to improve model performance, showcasing practical skills in data preprocessing and machine learning.
UI & UX Design
HeyPico Website Redesign & Feature Enhancement – Design Test
A UI/UX design test completed as part of a recruitment process. This project involved redesigning the HeyPico website and proposing new features to improve user experience, usability, and overall product value.
Memento Website Redesign – UI/UX Design Test
Redesign of the Memento website completed as part of a recruitment process. This project focuses on identifying usability issues and improving user experience through clearer navigation, better visual hierarchy, and more intuitive interface design.
Minilemon UI/UX Design Test Submission
UI/UX design test submission created as part of a recruitment process. This project showcases my approach to problem-solving, user flow design, and visual interface creation.
Design Mobile Budgeteen
I designed a mobile application prototype titled Budgeteen using Figma, focusing on personal finance management. The project aimed to help users organize income, expenses, and savings through clear visualizations and structured categories. The design emphasized a modern, user-friendly interface with intuitive navigation, ensuring accessibility and efficiency for managing daily financial activities on mobile devices.
Design Mobile LelangKu
I designed a mobile application prototype titled Lelangku using Figma as part of a Binus course assignment. The project focused on creating a user-friendly auction platform with key features such as product listing, bidding interaction, and transaction flow. The design emphasized intuitive navigation, clean layouts, and responsive mobile UI elements tailored for seamless auction experiences.
Design Mobile E - Commerce
I developed the mobile version of an e-commerce platform using WordPress with WooCommerce, optimized for seamless shopping on smartphones. The project included responsive layouts, simplified navigation, mobile-friendly checkout, and integration of secure payment and shipping options. This version enhanced usability, ensuring a smooth user experience while maintaining all essential e-commerce features.
Design Website E - Commerce
I developed an e-commerce website to simplify online sales and enhance user experience using WordPress with WooCommerce. The project included design, store setup, and integration of payment and shipping options. Key features covered product catalog, shopping cart, admin dashboard, stock management, and responsive design, with added plugins for security, SEO, and product variations.
Design Mobile Bus Stop
Completed a Binus course project designing a mobile application interface, Bus Stop, using Figma. The project focused on creating a clear and user-friendly design for public transportation access, covering layout structure, navigation flow, and usability. This case study demonstrated my skills in mobile UI/UX design, prototyping, and applying design thinking principles.
LP Batik
Completed a Fast Campus course project designing a Batik landing page using Figma. The project emphasized visual storytelling, layout design, and responsive components to showcase traditional batik in a modern digital format. This case study highlighted my skills in UI/UX design, typography, and building aesthetic, user-centered interfaces for cultural branding.
Design Website RentId
Completed a Fast Campus course project developing the web version of RentID, transforming the Figma design into a responsive front-end website. The project involved implementing layouts, navigation, and interactive elements to reflect the original UI/UX design. This work demonstrated my ability to bridge design and development, applying modern front-end practices effectively.
Design Mobile RentId
Completed a Fast Campus course project designing a mobile interface, RentID, using Figma. The project focused on creating an intuitive UI for a rental application, covering layout planning, navigation flow, and responsive components. This case study highlighted my skills in mobile UI/UX design, prototyping, and applying modern design principles for usability.
LP Case Study Grooming Routine
Completed a Fast Campus course project designing a landing page case study, Grooming Routine, using Figma. The project covered layout planning, wireframing, and responsive design principles, resulting in a professional and user-friendly interface. This case study showcased my skills in UI/UX design, visual hierarchy, and creating modern web layouts for real-world applications.
WordPress
Travel Website
A travel website using WordPress to showcase various destinations and travel packages. The site features detailed information, photo galleries, and a user-friendly design that is fully responsive for easy access on all devices.
Dealer Website
A dealer website using WordPress to display vehicles available for sale, complete with detailed listings and images. The site features easy navigation, contact forms for inquiries, and a mobile-friendly design to enhance user experience across all devices.
Property Website
A property website using WordPress to showcase real estate listings with detailed descriptions, images, and contact options. The site includes searchable property listings, inquiry forms, and a responsive design for seamless use on both desktop and mobile devices.
Wedding Invitation Website
A wedding invitation website using WordPress to share event details digitally with guests. I designed the invitation pages, added event information, and ensured easy access on mobile devices. The site uses Elementor for design and plugins for RSVP and photo galleries, featuring event details (date, time, location), couple’s photo gallery, RSVP forms, Google Maps integration, digital gift links, and a mobile-friendly layout
Marketplace Website
Marketplace website using WordPress to enable buyers and sellers to trade products on a single platform. I managed the marketplace structure, added seller store features, and ensured smooth transaction processes. The site uses WooCommerce, multivendor plugins like Dokan or WCFM Marketplace, and Elementor for design, featuring individual seller stores, product and order management, shopping cart and checkout, online payments, user registration, and a mobile-friendly layout.
E - Learning Website
A marketplace website using WordPress to connect buyers and sellers on a single platform. My role included setting up the marketplace structure, adding seller store features, and ensuring smooth transaction processes. The site uses WooCommerce, multivendor plugins like Dokan or WCFM Marketplace, and Elementor for design. Key features include individual seller stores, product management, shopping cart and checkout, online payments, user registration for buyers and sellers, and a mobile-friendly interface.
Membership Reseller Website
Membership reseller website using WordPress and membership plugins to provide tiered access to product catalogs, promo materials, and ordering. I handled membership setup, payment integration, and designed a user-friendly interface with reseller dashboards and automated emails. The main challenge was managing access by reseller level, which I solved with content controls and a simple UI.
News Website
A responsive news portal using WordPress with a focus on fast loading, SEO, and easy navigation. I handled design, category management, multi-author setup, and content optimization. Key features include dynamic homepage, social sharing, trending articles, search, and visitor comments, all organized for a smooth user experience across devices.
Donation Website
Donation website using WordPress and donation plugins to enable easy, secure, and transparent fundraising. I managed design, donation system setup, payment integration, and progress tracking. Key features include online donation forms, progress bars, donation history, automated notifications, and responsive design. To build trust, I optimized the system for simplicity and transparency.
Course Online Website
An online course website to provide digital learning materials with features like videos, quizzes, and course management. I handled the full development, including page design, course system setup, and integration of learning features using WordPress with an LMS plugin (such as Tutor LMS or LearnPress), Elementor, and additional plugins for registration, certificates, and security. Key features include course listings with detailed content, user registration and login, access to text, video, and PDF materials, online quizzes, automatic certificates, and user/admin dashboards, all with a responsive design. The main challenge was building an easy-to-access yet well-structured learning system, which I addressed by optimizing the LMS plugin and customizing the interface for user-friendliness.
E - Commerce Website
An e-commerce website to simplify online sales and enhance the shopping experience. I handled design, store setup, and payment and shipping integration using WordPress with WooCommerce and additional plugins for security and SEO. The site features a product catalog with categories, shopping cart, payment options, admin dashboard, and a responsive mobile-friendly design. To manage stock and product variations efficiently, I configured WooCommerce and used extra plugins.
Factory Website
A company profile website aimed at professionally presenting their services, vision and mission, and contact information. My role included designing the layout, front-end development, and WordPress implementation, covering everything from planning the site structure to online publication. The website was built using WordPress with the free version of Elementor, hosted on an active domain and hosting service. Key features include an About Us page, company gallery/portfolio, contact form, and a responsive design that works well on both mobile and desktop devices.
Web Apps
Web Server with Node.js
Built a simple Node.js backend project for a Fast Campus course to demonstrate handling HTTP requests and responses. The project includes Postman testing and serves as a foundation for understanding API development, highlighting my ability to implement basic backend functionality and test endpoints effectively.
E-Commerce Platform Development
I developed a comprehensive E-Commerce Platform for a Fast Campus course to strengthen full-stack skills. The Next.js frontend features a responsive product catalog, cart, and checkout, connected to a Laravel backend. Alternative backends in Java and Golang demonstrate scalable, maintainable implementations, showcasing adaptability across multiple frameworks for the same business case.
Frontend - JS (Vue)
Backend - PHP (Laravel)
Backend - Java (Spring Boot)
Backend - Golang (Echo)
Film Catalog Website
I developed a Film Catalog Website as a personal project for a Fast Campus course to practice frontend skills. Initially built with JavaScript for core features like searching, displaying, and organizing movies in a responsive UI. Later refactored to TypeScript for type safety, scalability, and maintainable code, demonstrating modern development practices.
Website Catalog Film with JavaScript
Website Catalog Film with TypeScript
Apple Landing Page (Cloning)
Created a clean and responsive landing page inspired by Apple’s design style as part of a FastCampus course assignment. The project utilized HTML for structure, CSS for styling, and JavaScript for interactivity. It emphasized modern, user-focused design principles, showcasing my ability to build engaging, professional, and visually appealing front-end web interfaces.
Apple Ipad Indonesia (Cloning)
Developed a responsive landing page for Apple iPad as part of a FastCampus course assignment. The project was built using HTML, TailwindCSS, and JavaScript, highlighting a clean design with smooth interactions. Emphasizing a mobile-first approach, the page demonstrates essential front-end development skills and showcases adaptability for real-world product marketing websites.