Dunia Games - Gacha

Dunia Games Gacha is one of the features of Dunia Games where the user can play the gacha and get a prize, such as DG Poin, DG Rings, physical goods (the merchandise), and also a voucher.

The gacha itself is earned from a program, for example topping up a certain amount of diamond, exchanging DG Poin, or only by logging in to Dunia Games. So on the My Gacha page inside the profile, the user can see all the programs that are running together with how many gacha they already have and until when the program is open, and the program that is already expired is shown as disabled so the user still understands what they missed.

When the user plays it, a modal appears telling how many gacha are still unopened, then after opening it the prize that they get is revealed. From there the user can directly redeem it, or continue opening the rest of their gacha, because the number of the gacha that is left is always following them.

Every prize has its own way to be claimed, and this is the most challenging part of the feature. A digital prize can be redeemed directly, while a physical prize (the merchandise) needs the address of the user and the courier, so it continues to the shipping confirmation together with the summary of the order until the confirmation that it succeeds. Every prize also has its own detail page that contains the image of the prize, the way to redeem it, and the terms and conditions.

After that, everything can be tracked from the Riwayat tab, which is separated into three states, namely the prize that is not redeemed yet (Belum Redeem), the prize that is being processed (Sedang Diproses), and the one that is already done (Selesai), and it is grouped by the date so the user can follow the progress of their own prize.

My job is to create this feature, both slicing (changing the image UI in Figma into html, css, and js code), and also integration (consume API, the state of every prize and every program, form validation of the address, empty state, error state, etc.).

NB: Source code cannot be shared because it is a company asset.