Niken's Binusian Blog

The Mall is a 3D game simulation where the player is placed inside a mini mall and their mission is to buy a certain object from the mall. There are 10 stores inside this mini mall, which are Topshop, Guess, Bonchon, McDonald’s, Chatime, Mart, Pharmacy and Clothing Store Brand B. There are several stores that sell identical things, so the player needs to find and go toward the correct store to complete the mission. After the player completes the mission, the game will reload and randomize a new mission.

The models in this project were designed and created using Blender application.

To display it in the browser we use several frameworks and APIs such as Three.js and OrbitControls.js. The interactivity provided in this game are the third person controller so that the player can translate and rotate toward the axis and the camera zoom in and out feature.

Here is the video demo of our game:

https://www.youtube.com/watch?v=x13NOEwR3fc

Tomorrow is the deadline of our Computer Graphic final project and fortunately we have managed to finish our project. The features that we have added to complete this project is the player’s model loader, player’s position detector, the camera’s ability to follow the player and the random generator for the array.

The first look of the program

In the picture above, we can see that the goal is to buy a jacket from Topshop.

Mission completed

If the player’s position is inside the intended store, the program will give a message saying that the player has completed the mission and will reload the game to give a new mission.

As of now Cynta and I are just finishing the final report and the video demo.

During the last few weeks, we have been adding more rooms to our project such as clothing store and McDonald’s. We also have been adding the texture for all of the rooms.

Currently, the mall looks like this.

We also have been trying to figure out how to build a third person player in webgl, but until now we have not been able to create the player yet. Hopefully we will be able to figure it out as soon as possible.

During the past few weeks we have made several rooms for the mall, like supermarket, bookstore, etc.  in Blender. And we are also able to display the room in the browser. The next step that we are going to do is to make the character and combine the rooms into one mall.

one of the supermarket in the mall

the making of another room, which is a bubble tea counter

Group members                                                       Responsibility

Cyntara Prilly Adwinda                      1801451046                              Design, Coding

Niken Pramadhantie                           1801451084                              Design, Coding

Title: The Mall

Description:

This project is inspired from daily activities when someone goes to the mall and shop for certain things. The Mall project describe the behavior and activities of people when shopping in the mall. We also want to create an enjoyable and fun game for player by enabling them to explore the scene.

The Mall is a simulation game where player is placed inside a mall. The player will be given list of things they need to purchase. Like the other mall, this mall will have lots of stores with each of them sells different products. The player has to explore the mall to find the shop or counter that sells the things in the list with the exact brand since there will be some stores that sell identical products, but they are actually different brands.  To distinguish that, each store will has a flag to indicate what products they’re selling and their brand (Example: Clothes Brand A, Shoes Brand S). The first stage, the player will only be given one thing. After finding it, they will be given another random two things. After finding the 2 things, they will be given another random three things, and so on.

In this project, we are going to use third player character in which the player can walk around and explore the scene. We also plan to make a 3D environment.

*Additional features or changes might occur

Sketch for the UI

Music Bank is a website that is provided for customers to buy physical music album of various genres. These genres are including common and popular genres such as pop, rock, jazz and country from around the world. Here are some of the screenshots of our website:

Homepage

‘Help’ page

‘About Us’ page

Registration form

Login form

‘Product’ page

Customer’s shopping cart

Checkout page

This website also provides pages for admin, so that the admin can add products, albums, artists and genres directly from the website.

‘Add Products’ page

For more detailed information, you can watch our web user’s guide video on youtube:

MUSIC BANK

Music Bank is a website that is provided for customers to buy physical music album of various genres. These genres are including common and popular genres such as pop, rock, jazz and country from around the world. Not only that, we also provide music album of genres that are getting more and more recognized and more popular in Asia specifically, which are K-Pop, J-Pop, Bollywood and Indonesia’s own, Dangdut.

Interaction that will occur:

This website will offer navigation bar, consisting of Home, Products, Registration, Login, and Help. To purchase any products from our website, the customer needs to register their personal information first to be a member. Then, when they want to buy something, they will have to search for the specific album they want to buy in Products page by clicking it. The Products page will consist of the list of albums we are selling and their description. When a customer already decides about what album they want to buy, they can simply click it and they have to fill the number of album they want to buy on the text field beside Qty, and click Add to Cart so it will go to the customer’s shopping cart. The shopping cart will contain all of the albums the customer has chosen. Then, if the customer has finished shopping on our website and wants to check out, click Finish and the customer will be addressed to a confirmation page.

Group Members:

1801451046    Cyntara Prilly Adwinda

1801451084    Niken Pramadhantie

Welcome to my blog! The main purpose of this blog is to share my activities of being a Computer Science student.Click this link to know more about Computer Science Program in Binus International. Have a nice day!