Project
Graphic Design
Project
Video Editing
Informational Video
Basic Editing
Project
UI/UX
Brand Cloathing E-Commarce
Arcanum is a fashion e-commerce website that I built independently, from planning, interface design, system development, to deployment. Through this project, I combined my design and web development skills to create a functional, responsive, and user-focused platform. This experience strengthened my understanding that good design is not only visually appealing but also needs to be effectively implemented into a digital product.
Manufacturing Production Monitoring
This project is a monitoring system design specifically created to assist Production Supervisors in a factory. The system is built so that supervisors can view production status and order details directly on a single main screen without having to switch pages. The design uses color indicators such as green for safe, yellow for warning, and red for late, allowing bottlenecks on the factory floor to be recognized at a glance. Additionally, the system directly presents progress charts and production target gap reports, so users no longer need to calculate manually. In essence, this design was created to replace manual recording so that supervisors can monitor workflows, identify issues, and make decisions as quickly as possible.
Nusajaya Travel
Nusajaya Travel is a full-stack web application designed to streamline the travel and transportation booking experience. Built with Laravel 13 and Tailwind CSS, the platform enables users to easily book tour packages and rent vehicles with real-time online payments via Midtrans. It also features a comprehensive admin dashboard for managing bookings, tracking fleet maintenance, and handling promotional campaigns.
Brand Cloth
Prototype V2 is an alternative design concept I created based on research from several fashion and e-commerce websites. In this stage, I explored different layouts, user flows, and visual styles to find the most suitable design solution for both user and business needs. Although it was not developed or deployed, this prototype became an important part of the design decision-making process for the Arcanum project.
AI-Powered Workflow
The Making of EPO
The process of creating EPO is an example of implementing AI in my workflow. From visual concepts and animation to interactive programming, everything is a harmonious collaboration between human imagination and AI execution capabilities.
1. Character Creation
2. Animation Generation
Transforming static images into lively and natural moving characters using an AI Video Generator.
function initEPO() {
const bot = new AIChatbot({
name: 'EPO',
role: 'Assistant'
});
bot.render();
}
3. Web Integration
Programming AI logic interactions and functionally integrating them into the website's UI/UX ecosystem.
Editing Information video assist by ai
1. Background AI
Creating background images using generative AI as the visual environment for the video.
2. Character AI
Creating character assets or main elements that will interact within the video.
3. Graphic Design
Adding graphic design touches for layout, typography, and additional visual elements to make the composition more professional.
4. AI Music Generator
Producing background music to avoid copyright issues on platforms.
5. Final Composition
Combining images, character animation, design, and music into a single cohesive video.
Design Assist by AI
Several examples of works, design explorations, and visual references where the ideation and creation process were assisted by artificial intelligence.