Noodlets Studio

Updated on 3rd August 2020, somehow my brain still works?

Overview

This will be another short devlog, since there’s not much to update on. As mentioned last week, I have been working on networking the customer mechanics between mobile devices and progress has been slow, but I’m slowly getting there!

Prototype

Customer Interaction

Players can both:

Pick up customers from the waiting area

Seat them at an empty table with enough seats

Take their orders and these orders are the same on all players’ devices

I have a few more tasks left to do, but the main problem was with networking the customer orders, so I’m glad that it’s over (I hope).

Review

I spent most of my time converting the customer mechanics done by @theeggnoodlet to be used with networked players, then I moved onto networking the actual interactions. Using commands, server callbacks and RPCs, I somehow managed to network some things… 

I also required much help from my teacher as always, but I’m happy with the progress for now, and will continue to work on networking the customer mechanics! 

Meanwhile, @theboynoodlet has made huge progress on the 3D environment assets, and @thecatnoodlet has made some pretty particle effects for our game! @theeggnoodlet has also been hard at work with getting the core VR mechanics out, so do check them all out! They are all making amazing progress <3

Tuesday, 4 August 2020

Brain much, much drier than that chicken breast I had for lunch the other day…

Back with another devlog this week! I’ve finally gotten some particle effects for the game done, so I’ll be showing what I’ve completed so far. Particle effects provide some visual feedback and just ties all the animations and actions together nicely, along with the sound effects. There are quite a few effects that are similar to one another, so I’ll just be grouping those together. 

Here’s a look at all of them playing at once! 

Besides the smoky and sparkly effects that I’ll cover below, there is also (from left to right in the top row) a heart PFX to indicate customer satisfaction, a ring of fire for the stove, liquid splashing, and PFX for liquid overflowing out of a pot onto a surface!

Getting…steamy

These are the smoke / steam-related effects! Because recycling is good for the environment, all of these use the beautiful smoke sprites made by @theeggnoodlet​, with varying sizes, speeds, colours and shapes depending on the usage of the particle system. For example, negative feedback like burning food has darker smoke particles compared to lighter particles when the food is still undercooked. 

Sparkles

These effects will play to indicate:

that a dish was cooked well

that a customer has disappeared (currently, customers just shrink and disappear into the void, so we wanted to add some sparkles to show the pop as it disappears!) 

Constraints

In a previous school project done on mobile, usage of unoptimised particle effects and post-processing was like sweet torture on the device. Since the platforms that we are developing for are mobile and VR, which require quite a bit of optimisation to keep the FPS at a decent level, I had to keep the number of particles for each particle system as low as possible without compromising the quality of the effect. This meant a lot of tinkering with particle sizes to ensure that the effects don’t look too sparse at lower particle counts (10-20, max). 

Review

That’s mostly it for the particle effects! We can’t get too fancy lest the devices we’re developing for start screaming whenever we test the game out. In any case, I do hope the particle effects we have can spice the gameplay up a little. 

Intro

Hi, it’s Kai Yuan, your resident 3D generalist of Noodlets Studio. I’m currently writing this while having a minor cold so I’m sniffling every 5 seconds while bopping to the range of Lady Gaga to Lorde to Conan Gray, stay healthy everyone! In order to make up for my apparent lack of dev logs, I’m going to show you how I create a little stove for Yi’s Eatery. All points made here are going to be super condensed for the sake of not running this article too long.

As with all of our tutorials, we are just amateurs having fun making games and sharing our experience as amateurs with you! :D

The Process

Step 1: Preparation

Always start with a plan in mind! I say that although I always start creating 3D assets with only 2 active brain cells half the time. Either way, you should still have a plan. This means first of all, gathering references of whatever object you want to create (even if you have a concept art to work off from) and beginning to understand your object’s form. With the stove I created, I used this particular reference image.

You can already see the similarities but these similarities help to sell the object as real. The closer the form of the object is to an actual reference in real life, the more believable it is even if rendered in a non-realistic way.

Once you have enough references and you start to slowly grasp the object you want to create, you should start pinpointing the basic shapes and forms of the object. In the example of the stove, it’s easy to notice that it has a cylindrical shape. Some objects have different components (EG: A car engine) and each component may have a different shape. It’s all about analysing your object and deepening your understanding of the object you want to create.

This preparation process doesn’t take too long for most objects, since a google search and basic shape knowledge is all you need. But taking the effort to prepare will save you a lot of blank staring at your 3D software.

Step 2: Modelling

Here’s where the nitty gritty starts to happen. I will preface this by saying that I frankly can’t show you the full process because you’d be reading this till the next day. We have a Youtube video on our Noodlets Studio channel where I modelled the stove on a livestream if you’re interested. In this article, I will just mainly share the important concepts for 3D modelling using the example of the stove.

The creation of all 3D objects follows the simple process of starting with big shapes and then slowly “zooming in” and editing the 3D object with increasing detail.

The above picture illustrates this concept of going from big forms to small details. This is where the knowledge from your preparation comes in. It really helps during the start when you have to block in your big forms. In the example of the stove, I start from a single cylinder and slowly build out the shape as shown in the picture above.

A few functions I like to use (in Maya) when adding in details are the “Bevel” function and the “Insert Edge Loop/Multi-cut” function.

These functions simply revolve around adding more edges/points to manipulate, which is the basis of how you add more details in your 3D object. More points = more details.

When you are adding details to your objects, you have to be mindful you are not adding too much details. Not every corner needs to be beveled and you certainly do not need to unnecessarily cut edges if you are not going to move/extrude them. More points = more details BUT also = more computational power used to render 3D objects. The art style of your game also determines how you model your 3D objects, some require low polygon counts to achieve a cartoon look, some require higher polygon counts to achieve a realistic look. Although, most of us generally prefer the former because it’s easier to do.

Step 3: Texturing

The next step after modelling your object is to UV unwrap it. UV unwrapping is the process of creating a UV map where a 2D image can be projected onto the 3D object’s surface.

In the example above, all the faces of the cube were laid out on a 2D plane, which then a texture can be projected onto the UV map and have it reflected on the 3D cube. This is merely the simplest example of a UV map, most UV maps are more complex and require a strong understanding of shapes. For example, this is the UV map for our stove that we created.

Most 3D software allow you to do UV unwrapping of your 3D models, although, you might want to look up a few dedicated tutorials first before jumping into it. This part of 3D modelling is easily one of the most frustrating and difficult parts to understand as there is 0 creativity involved, just pure brain power. :(

Once your 3D model is fully unwrapped, now you want to actually texture it. The simplest way of doing this is to export your UV map into Photoshop or any painting software of your choice and simply paint on it. However, there are a few caveats to take note of. You cannot physically see how your painting affects your 3D model without exporting the texture out into your 3D software. Thus, editing your texture map will be a long arduous process of importing and re-exporting.

In order to circumvent this, we can use dedicated 3D texturing software like Substance Painter which lets you see how your texture is reflected on the model itself. It has the further advantage of allowing you to further enhance your texture with some neat tricks. With a normal map, it will create the illusion of details on a flat surface.

These maps can actually be hand painted in Photoshop, but everything is packaged together in a 3D texturing software like Substance Painter so it’s easier to implement all these details.

Step 4: Finalising

Once you got your textures ready, now it’s time to bring it all together! If you are creating a game, you would bring this into your game engine like I did. Or you could also keep it in your 3D software and render it, but that’s a whole other bag of worms.

For the video you saw on our socials, I just slammed a quick backdrop and gave it some lighting to bring out the details of the stove and the final result is as you have seen before.

That’s about it for my tutorial. I hope I have given you an insight into how 3D game objects are created, even if you are just a random passerby. For actual 3D artists out there, hopefully your eyes didn’t burn too much, I’m still trying to get better and I hope to create better 3D models in the future.

Thanks for reading this! My cold has slightly healed while writing this article, remember to stay safe out there! :D 

Updated on 27 July 2020, brain still dry, yay!

Overview

I am back again! This devlog will be a relatively shorter one, since I spent most of my time fixing bugs. Boring stuff aside, remember the secret mechanic I mentioned in my previous devlog? Well, now you get to see it! Introducing…… The Drink Mechanics Prototype!

Prototype

That’s right, this is a new mechanic we decided to add to Yi’s Eatery! 

Well, to be fair, we did make a drinks fridge for a reason… The initial plan was for the customers to order drinks occasionally, but we decided to scrap that. So now the drinks fridge was lonely and sad, without a purpose in life, thrown to a corner with the counter… Well, we’re having none of that here! In an attempt to make use of both the drinks fridge and the counter, we decided to introduce a new mechanic! 

Drink interaction

Interact with the drinks fridge to spawn a bottle

After a 5-second cooldown, they can spawn another bottle

Unable to spawn more than 2 bottles

In other news, I also added a method to check if more than one player is at the sink, so only one player can wash plates at a time.

Review

As mentioned earlier, this week’s progress has been more of fixing bugs and polishing some mechanics, aside from implementing the new drink mechanic. 

As always, much thanks to @thecatnoodlet for drawing those snazzy drinks UI at record speed! She also posted a tutorial on concept art, if you’d like to take a look!

I will be working on networking the customer mechanics this time, so that should be exciting! @theeggnoodlet has worked really hard to get them out, and she’s doing an amazing job, so do check out her devlogs too! 

Tuesday, 21 July 2020

This devlog entry will be a short update and a continuation from last week’s post; I talked a lot about the designs and the individual UI elements, so this week I’ll cover what we’ve managed to implement so far. 

Mobile UI

The screen backgrounds are unfortunately not ready yet, so we’ve put in placeholder backgrounds for now. The UI’s starting to come together though! As shown from the video by @thepinknoodlet above, we have a splash screen that fades away on tap to the menu screen, which then goes to the lobby screen when the VR player hosts a room, and then to the game screen. (I flexed my dried chicken breast brain to code the splash screen’s functionality…yeah)

Here’s a look at the screens in the prototype compared to their wireframe counterparts!

Splash Screen:

Menu Screen:

Lobby Screen:

Game Screen:

So far it’s all coming together pretty okay, though the layouts might undergo some minor adjustments (placements of buttons and all that) after we’ve done more playtesting and user testing. 

Review

Yup, that’s all for now. It’ll probably take some time before the VR UI is implemented, especially since the workload is starting to pile up from other module assignments again. That said, I’m quite pleased with how the mobile UI is coming along, much thanks to our hardworking developers! 

Updated on 21 July 2020, yay progress!

Overview

Hi! I’m back, yay! So this past week has just been me trying to fix bugs and try to get things working. Now, I’m proud to present a completed mobile mechanics prototype! (without the customers) The base mechanics for the players are now done, so I just need to add in the customers! As always, I’m going to give a brief rundown of what I fixed/added! 

Prototype

You may remember from last week’s post that while I was able to network some mechanics, I was unable to get some working… In this prototype, those issues have been fixed! 

Both players can now:

Ingredient Interaction

Spawn ingredients from respective shelves

Drop ingredients on the floor and pick them back up

Drop ingredients onto the ingredient tray

Ingredients rot if left on the floor for too long

Ingredients and rotten ingredients can be thrown away

Dirty Dishes

Pick up dirty dishes from the table

Bring dirty dishes to the sink

Stack up to 4 dirty dishes in the sink

Place up to 15 clean plates on the plate tray

Networked Objects

See what each player is holding on their head

Ingredients dropped on the floor, rotten ingredients

Ingredients placed on the ingredient tray

Dirty dishes in the sink 

Clean plates on the plate tray

Pick up one any ingredients on the floor

I’m really glad this prototype now works, since it’s been a headache ever since the errors occured… It’s pretty much complete now, except for the customer mechanics (to be added soon) and another… secret mechanic!

That being said, the credit doesn’t go to me entirely, since I did request for some much needed help from a teacher. 

Review

I was struggling very much with the commands and remote procedure calls (RPCs), since I really still couldn’t understand what networking is about. I spent about 3 or 4 days trying to fix these issues, but could never quite pinpoint what went wrong where. Which is why I reached out to my teacher and asked him for his help, since he is experienced in networking. 

He got back to me quickly and when we went through the different mistakes I made, I realised two things:

1. My networking knowledge is shallow, and my foundation is not strong, so I get so many concepts wrong

2. My script structure really needs to be improved and be more consistent…

The mistakes were not something I could have ever figured out myself, I’m sure, since most of them stem from my lack of understanding of networking concepts. Things like how to use RPCs and when to use Commands, or when I should use a static variable and when to use a SyncVar, were all very much still foreign concepts to me. Even though I thought I might have gotten the hang of networking, in the end, I was still quite clueless.

That is why I will be spending my time restructuring my code, as well as using RPCs and Commands in a smarter manner, and where they are needed.

Updated on 14 July 2020, my brain is dry and my laptop screams eternally :)

Overview

It’s been some time since my last update, so sorry, I’ve been busy trying to figure things out and also went through a bit of a burnout a few weeks back. This prototype is nowhere near complete, and is more of my attempt on networking the mobile mechanics. As per usual, I’ll be sharing updates and changes made in more detail, so let’s get to it!

Prototype Draft

In this prototype, I updated and restructured the mobile mechanics scripts to be networked and work with both players instead of just one. First, I’ll go through what a single player can do, and then talk about what both players can do. The new methods have been bolded for clarity, with the previous versions listed beneath each one!

The player can now:

Interact with ingredients

Spawn ingredients from the respective shelves

Drop ingredients on the floor and pick them back up

Drop ingredients onto the ingredient tray in a pre-determined position

Ingredients now rot if left on the floor for too long

Ingredients could not rot

Ingredients can now be thrown away, while rotten ingredients must be thrown away

New implementation of trash bin!

Wash dirty dishes

Pick up dirty dishes from a table

Bring the dirty dishes to the sink

Stack up to 4 dirty dishes in the sink

It used to be just 2 dirty dishes

Wash one dirty dish at a time, while near the sink

Place up to 15 clean plates on the plate tray

Plates now have their own tray, they used to be placed with the ingredients

When networked, the players can also see:

Networked Objects

What each player is holding on their head

Ingredients that have been dropped onto the floor

Ingredients that have been placed onto the ingredient tray

Ideally, there should be more that both players can do. As such, I will be working on implementing networking for:

Dirty dishes in the sink

Clean plates on the plate tray

Picking up ingredients and dirty dishes

Currently, only the host is able to perform these actions

The base mechanics for all these methods have been implemented, however, I am struggling a little with the networking commands and am still trying to figure that out.

Regardless, I am proud of my progress, as networking mechanics is something I have been putting off for quite a bit, and have been absolutely dreading since the project first started. It was also the reason for my burnout for 2 weeks or so, so I’m glad I’m almost back on track!

Review

This was a pretty challenging prototype to get out, even in such an incomplete state. The problem mostly came when I had to network the actions players could take, since there was a lot to take into consideration. One of the first hurdles I faced was figuring out how to let the player pick up networked objects. Luckily, this guide from the official Mirror site made it easy to start so I could get the hang of it within a short period! Then came the tedious part of having to reorganize rewrite and relocate my scripts to fit the networking criteria. There was a lot of Synchronizing being done, and even more commands and server callbacks being made, so it took quite some time to ‘port’ all my existing mechanics to be compatible with networking. 

I won’t bore you with the details but it was just very challenging and confusing at times, as I am still not experienced with using any sort of networking API, even one as convenient as Mirror. I eventually got about half of it working, and decided I could fix the bugs later on, since I didn’t want to spend 5 hours trying to fix bugs and neglecting the other responsibilities I had. 

After getting the draft out, I went ahead and built on the ingredient rotting mechanic that my fellow programmer @theeggnoodlet made, so that it now actually worked across the network! Did I mention she is also working on the customer mechanics, and is doing an incredible job at it? Do check her blog out for the latest updates on that part of the mobile mechanics!

I’m sure you’ve also noticed the snazzy User Interface, it looks much better compared to the previous prototype, doesn’t it? They were made by the amazing @thecatnoodlet! She will also be sharing some tips for concept art sometime this week, so I highly recommend you check out her blog too!

Last but not least, our 3D modeller is hard at work with getting the final assets out, and he’s been doing absolutely well so far! Do head on over to @theboynoodlet‘s blog for updates and a sneak peek into what he has been doing!

Intro

Hey everyone, it’s Nicole, Noodlets Studio’s Visual Director! I also happen to don the hat of the team’s concept artist. That’s what this article-slash-tutorial is all about!

So, what exactly is concept art? Concept art falls under the umbrella of illustration; its main purpose is to be a visual representation of an idea (or concept…!) for usage in games, films, etcetera. There are many different types of concept art - characters, environments, props. We’ll be focusing on the latter in this tutorial! 

I will not be covering any digital art software basics here; I’ll assume that anyone reading this knows their way around their drawing software. 

I’d just like to preface by saying that I am, by no means, a master at this craft, and that I too am learning more about creating concept art day by day. Nevertheless, I’d like to share my process and some tips and tricks I use that I’ve picked up over my years exploring the realm of digital art. Let’s begin!

The Process

Step 1: Thumbnailing

Thumbnailing is an important step in the concept art process. It facilitates the speed of the initial idea flow, allowing artists to try out different angles and compositions before deciding on the one they wish to detail further.

The Conventional Way

I start out in grayscale. Which means completely black-and-white, like the two thumbnails on the left! 

I personally like keeping my thumbnails loose by blocking shapes in with a medium-sized textured brush and the lasso tool. At this stage, I play around with the composition, placement of items, and try out different colour palettes to see which would fit the best. Some tips:

Keep values in mind! When in the grayscale stage, the balance of lights and darks should be there, with ample contrast so that the elements do not look muddy when colour is added later on. 

Check if your composition is balanced. The placement and size of objects can carry significant ‘weight’. 

Separating stuff into the foreground, middleground and background helps to create depth. Use values to show the distance!

(Notice how the closer the plane is to the camera, the darker it gets?)

The Time-Saver Way (art purists, close your eyes)

*Note: These time-saving methods are just that: methods to work faster. They do NOT replace learning the fundamentals of art, though they can be helpful for studies! They should mostly be reserved for studio projects.

Usually people would sketch or block their thumbnails out, but well…when you’re really pressed for time…using your own 3D assets and shifting the camera around to try out different compositions might speed up the process. (Here, I’m using @theboynoodlet’s environment block-in assets) 

There’s been an age-old debate about ‘cheating’ in art but really, when you’re on a tight deadline, digital tools have opened a vast array of options to speed up your work. Lots of concept art pieces are created by photobashing and using 3D models. As long as you don’t trace over other people’s work and claim it as 100% your own effort, there’s nothing stopping you from using tools to get your work done fast on a deadline. Remember: work smart, not hard. 

Step 2: Blocking

Once you’ve selected the thumbnail you like best, it’s time to enhance it! Start blocking in the details with a smaller brush. I still do this step in grayscale, so I can keep an eye on the composition and values as I’m painting.

Step 3: Detailing and Colouring

After blocking comes the colouring! The method I use to add colour is by using adjustment layers on top of the grayscale layers. The adjustment layers I usually use are:

Colour Balance

Curves

Levels

I play around with the shadow, midtone and highlight hues until they fit the colour scheme that I’m looking for. 

I then render more using normal raster layers and a round watery brush. Don’t be afraid of multiply and luminosity layers! They can help with adding shadowy and light areas.

Textures 

In the event that you’re working on concept art that is more photorealistic, using textures from stock images and free brushes can help to add a whole other layer of realism to your piece! Play around with layer modes and lighting to help integrate the textures more seamlessly. My usual go-to layer modes for these are multiply, overlay and soft light.

Step 4: Final Touches 

At this stage, I add lighting, particles and textures to spice up the environment art more. With the power of digital magic, adding final touches is much easier than in the traditional medium. Many free brush packs are available online for download. (I recommend Brusheezy for Photoshop brushes and Clip Studio Assets for Clip Studio Paint!) 

I also use more adjustment layers to balance the colours and ensure that the picture has a decent contrast overall.

Conclusion

That’s it for this tutorial! While there are many techniques that other talented artists use for doing concept art, these are the steps that I take. I hope it’s been informative and at least a little bit helpful <3 

Hello, it’s been a really long time since I have updated the blog. Things have been quite rough lately. However, the team is slowly getting its groove back. For the environment, my post will be a mini-update as I won’t be covering much of any development process or thinking behind this update.

Mini-updates will be a way for me to quickly bookmark my progress in my dev log. The next dev log will be a full update which will happen next week.

Anyways, my progress are as follows:

I have finished the models for the counter area, featuring an assortment of tables and racks. An important part to creating the environment of Yi’s Eatery is making sure there are enough elements in the environment to highlight the time period the game is set in. At the back, you can see the beginnings of the kitchen area coming to life.

Here’s a top down view of the current progress:

Indeed, the environment is quite scarce but I am working on speeding up the process, with the aim of finishing the modelling of the environment by Thursday with some texturing.

Tuesday, 14 July 2020

It’s been a long time coming. While I had been working on UI/UX sporadically throughout the span of the project so far, I felt I hadn’t made enough progress to warrant an entire devlog about it. BUT! The time has finally come! She’s finally got some content in the bag! This post is going to sum up the progress on the UI/UX design from the beginning to now. Let’s go!

Wireframes

As a result of crippling creative burnout, I was having some trouble with creating the initial layout of the screens. So, @theeggnoodlet kindly helped with creating the first set of wireframes. You can check out her thought process from her UI devlog post! 

After I’d gotten back on my feet, I modified the wireframes a little and put a very simple prototype together in Adobe XD to show the links and flow between each page. The modifications were more simplifications than anything else - I felt that the boxy menu design was too squeezy, so I changed the buttons to the layout used by the Join Room screen.

Here’s a video showcasing the initial flow of the UI! 

Mobile Game Screen

This screen underwent a bit of improvement after we’d fleshed out more of the game mechanics and the values we’d have to display on the screen for players to see. To keep from making the interface too cluttered, I kept all static elements along the borders of the screen. The joystick and interact buttons are placed at the two bottom corners, where players’ thumbs can reach most easily when holding their phone horizontally. 

UI Assets 

Icons and Pop-Ups

After creating an asset list for all the in-game UI assets required, I got to work creating every icon and pop-up. These mostly consisted of 2D illustrations drawn by hand. Unchanging elements (like instruction pop-ups and certain indicator icons) have the illustrations and their respective backgrounds combined into a single layer. However, assets like the illustrations that appear in the interact button depending on what the player interacts with has been separated for the developers to enable or disable the icon easily. 

The pop-ups have been designed to look like written notes, since technology was not yet rampant among hawkers of that era. 

Buttons

I have created two sets of buttons, each with different themes:

The first is used in the menu / lobby screens, and is themed after Chinese shophouse signs from the 80s. They usually have a long framed board with all-caps red words painted on them. 

The second is used for the pop-ups. Following the same theme, the buttons look like a piece of paper stapled to the pop-up background. 

Monday, 29 June 2020

It’s been a while! No excuses except for a genuine need to hibernate for a while to recoup after one heck of a month of assignment deadlines. Whew. Anyway, upon my return to continuing work on the project, I went foraging for sound effects for the game. (We had initially planned to leave sound effects for later on in the production timeline, but with a prototype deadline coming up, we moved it to our current sprint.)

Sound effects are undoubtedly extremely important to any game, and there is a certain pressure involved with finding that ‘perfect’ sound bite for every action. The team unfortunately does not own the proper equipment to make high quality foley, so I tapped on audio repositories to find the sounds I needed. The two main sites I perused were Prosound and Zapsplat, both containing a comprehensive library of sound effects that met my needs. (Fair warning: be really careful with the licensing on these kinds of assets. Make sure to check that they can be used for games or commercial projects!) 

It’s pretty interesting how creative one can get with finding appropriate sounds. Sometimes you can get away with using a sound created by something entirely different from the action you’re finding a sound for. Sometimes you can never find the sound you want. It just plays over and over in your mind, taunting you because you can’t find it.

(Screenshot of the SFX I gathered)

There were certain sounds that I just couldn’t find on either site: the sound effect for washing dishes, for example. I had to fire up Audacity and combine two sound bites together - running tap water and scrubbing sounds, adjusting the levels and pitch so they mesh together properly. 

Date: 27 June 2020

Customer spawning

With our deadline looming ever closer, I’ve started scrutinizing which of our features are truly essential. Initially, we were going to have two types of customers — customers ordering takeaway and dine-in customers. 

Take away customers would come into the restaurant randomly and place orders for single dishes of chicken rice directly at the cashier. Dine-in customers would come in groups of 2 to 4, need to be seated at an appropriate table, have their orders taken and served to them, then their tables cleaned.

Dine-in customers would introduce waves of orders for the chef. Takeaway customers were supposed to add extra difficulty by introducing a constant stream of new orders the chef had to tackle alongside the waves.

If we balance the difficulty of cooking and the spawn rates of customers, however, I believe that we can make do without takeaway customers.

Developing a Spawn System

I’ve never really had to develop a proper spawn system before — all the game objects I had to spawn had an equal probability of spawning, so I just used Random.Range to randomly spawn a game object from an array of objects. I didn’t have to tweak the probabilities of different types of spawns before. 

I had to spawn different sizes of groups of customers to dine-in, so this lack of experience hampered me slightly. This video helped me get started, however. I truly am grateful for the bountiful resources and tutorials available on the internet. 

With most of the tables being two-seaters and up, I decided to spawn more couples. That way, players would frequently have to grapple with the choice of seating a couple at a 4-seater if they’re out of two-seaters, or leave the 4-seater open for potential groups of 3 and 4.

Balancing the Overall Gameplay Difficulty

The aim of our game is for the group of players to sustain the restaurant for as many days as they can in one playthrough. Each day, the players will have to deal with more customers with less patience. 

Kind of like an endless level with waves of challenges (think Plants Vs Zombies Endless Survival Mode), except between each wave, the gameplay will be paused and your performance evaluated. 

If we were to hard code specific values each day should have (e.g. the max number of customers to spawn each day, the frequency of customer spawning and the rate of decrease of customers’ patience levels), we’d have a finite number of levels for players to hussle through. 

As such, we need to find a general pattern we’d like the difficulty to rise in, then run the base values set for level 1 through a formula based on the pattern we want to use.

I played around with Desmos, an online graphing calculator to determine what formula would suit the difficulty curve we were picturing.

This first one helped capture the general curve, but the change in difficulty was a little drastic.

While playing Overcooked, we observed that the first few levels were relatively easy to perform well in. The difficulty scaled slowly, such that only at the 6th level did we start struggling to get high enough scores to get a 3/3 star ranking. As such, we decided that the gradient of our difficulty should be such that around the 6th day, the difficulty of the game would be twice as hard as that of the first day.

This second curve had the kind of gradient we were looking for. As you can see, however, the changes in the graph are quite small — the difficulty of the game would increase from 0.2 units on day 1 to 0.4 units on day 6. In the grand scheme of things, that’s not a lot of difference.

This brings me to the curve we arrived at. Of course, what we’ve proposed is merely theoretical in nature. Our difficulty curves are not set in stone and should change after playtesting is done.

Patience system

The simplest feature I’ve implemented so far. I created a method that would reduce the fill amount of an image of a circle as the patience of the customer runs out. The customer will start out with a patience level based on whatever float was passed into the method as an argument.

When I’ve implemented an evaluation system, a method that penalises the player’s customer service evaluation score should be called when the timer runs out, while a method that improves their score will be called if the customer is served before they have lost 10% of their patience.

What’s next?

Customer behaviour!

Making the customers walk into and queue in the restaurant.

Creating a depth-based alpha shader so that customers will fade in and out as they walk through the entrance of the restaurant.

Allowing the player to bring customers to tables.

Have the customers sit down and generate orders.

Finished on: 21 May 2020 Last semester, I worked on a Mixed Reality cooking simulator for the Microsoft Hololens.

To show that the pancake in the pan was being cooked, I had the material of the pancake change from the raw to cooked texture over time. I achieved this by using a shader that blended two albedo maps together. The more time the pancake spent in the pan, the more the material of the pancake showed the cooked texture and less of the raw texture.

What was done:

This feature was honestly pretty easy to implement. I created one method to blend the raw texture with the cooked texture, and another texture to blend the cooked texture with a burnt texture. The pan itself identifies whether the food has met the conditions required to burn (not putting oil in the pan first / cooking the pancake for too long), then calls the respective methods.

Possible improvements:

As mentioned in my devlog about the chopping mechanic, I felt that the heating mechanic was a little too lackluster to provide the frantic energy we were aiming to provide.

I am considering changing this mechanic such that players need to shake the pan in which the object sits vigorously for the ingredients to cook.

I will soon be collecting the VR headset from my teammate so that I can work on the VR mechanics more easily. I hope setting it up won’t be too rough :x

Final result:

Finished: 20 May 2020 (Wow! That’s a lot of 20s)

Next up on my list was something I’ve been both excited and hesitant to try - chopping food up!

What was done:

Using this API, I made it such that, when a knife comes in contact with a pancake, the pancake’s mesh would split at the point of contact.

Challenges and their solutions:

As I was mostly testing the mechanic out within Unity, I did not realise until much later that my chopping mechanic had a couple of VR-related issues.

The method with which I am splitting the object into two works like this:

When the collider of an object with the knife script comes into contact with a choppable object, the original choppable object is deleted, and replaced with two meshes the size of the two halves on the opposite sides of the knife. These two meshes do not have a collider component on them.

As this caused the slices to fall through the counter and floor of the scene, I added a collider to each half spawned. This, however, introduced a new issue.

In order to make an object grab-able in VR devices, the object must have the ‘XR Grab Interactable’ component, while the player’s hands must have a ‘XR Direct Interactor’ component. On top of that, both the player’s hands and the object must have a collider. 

I wanted the player to be able to pick up the pieces of the object they had cut. As such, I attempted to add the ‘XR Grab Interactable’ component to each of the pieces spawned. 

However, the XR plug-in comes with something that constantly checks all objects with the aforementioned component. If a new object with the interactable script suddenly appeared out of the blue, the grab interactable checker would scream in protest. 

My teammate is revamping the chopping mechanic to better suit the limitations of the XR plug-in.

Possible improvements:

We want the player to be able to suspend their disbelief sufficiently and truly believe that they are cooking in a kitchen. However, we want the cooking experience to still be fun. We want the cooking experience to bring the same frantic energy that games like Overcooked give their players. As such, we are considering dropping the realism of the chopping mechanic a notch and making the chopping process more abstract.

Final result:

Finished: 19 May 2020

Finally, I’ve finished a VR mechanic! 

As the lead VR developer, I was to code the core VR mechanics. I, unfortunately, did not have access to the headset, so developing the mechanics was pretty tough. I could only test whether the mechanics worked in the Unity Editor, and would have to cart the mostly-working build over to my teammate with the headset — @theboynoodlet — to test. 

In our game, the VR player was to be the chef of the restaurant. They would cook and assemble dishes to fulfill the orders flooding in. The first mechanic I decided to work on was pouring. Essentially, when a tap was turned on or a bottle tilted far enough, I wanted something that was able to contain liquids to slowly fill up with a liquid, and for particle effects to pour out of the source of the liquid (the tap or bottle of liquid). 

For the very first iteration of my prototype, I was planning on using pancakes as a placeholder food item. Pancakes were used for two reasons:

I had some pancake textures from my previous project that would be quick and easy to import in.

Pancakes are wide and flat — any changes in their texture would be obvious, making double-checking that my code (for changing the texture of the pancake over time) would be easier. This will make more sense when I explain the development of the heating mechanic.

What was done:

Following this tutorial by VR with Andrew, I created a bottle that would pour oil when tilted far enough. 

When the particles pouring out of the bottle hit something that can contain liquid, such as a pot or pan, liquid will start filling up the container.

Possible improvements:

In the final game, the player will not have to pour liquids from a bottle. The player will merely have to put their container under a tap for a couple of seconds for the pot to fill.

If possible, I would like to make the liquid in the container slosh around. I will likely either follow this tutorial by VR with Andrew or use this shader / shader graph by Minions Art 

The final result:

Finished: 7 May 2020

Designing good UI is tough. You have to balance the visual appeal and functionality in the layout of all the UI elements. As our UI/UX designer was having a tough time with the wireframes, I designed some sample layouts for her to work off of.

Some of the screens I laid out were:

Title screen

Menu

Lobby

Error screens

As our game is a multiplayer game, we need players to connect to the same network and join a specific game room. The lobby serves as the area for the players to wait for their friends to join the room after they have joined successfully.

Our game is set in a Hainanese chicken rice stall in 1980s Singapore. As such, I thought it would be fitting if our menu layout was reminiscent of Chinese restaurants’ menus — boxy and straightforward. Pictured below is one of my references.

Fatty Ox HK KItchen | Image credit: Gregory Leow | Taken from here

This is how the title screen (left) and menu (right) turned out:

The title screen was to be an illustration by @thecatnoodlet​, so that was left blank. As joining a game room was going to be the key action we wanted players to take, I made it the biggest button in the menu screen, and aligned it to the right so that it would be in the comfortable reach of the players’ hands, as determined by this source.

After hitting ‘Join room’, the device searches for games being hosted on the network the device is connected to. If a room has been found, it has to present the option of joining the identified room to the player. If no room was found or the device is not connected to wi-fi, the appropriate error message should be displayed. These are the layouts I designed for these situations:

To ensure that all the buttons are easy for the player to hit, I aligned them to the bottom right corner once more. 

Once the players successfully join a room. they will be taken to a lobby to await the arrival of other players. I came up with two layouts for this lobby, one inspired by the layout of the lobby from Pummel Party (right), and another inspired by the character select screen of the Toca Kitchen mobile game (left).

The references: 

The sample layouts:

After passing my wireframes to @thecatnoodlet​, she started to refine them and produce samples of the UI elements.

TL;DR

What was done:

Research

Old Chinese menu layouts

UI of similar screens in other games

Layout of mobile UI screens

Challenges:

Determining what would be representative of the 80s

Balancing interesting and unique visual design with recognisable UI patterns.

Other notes:

What was done Finished: 4 May 2020

Creating a new project in Unity greets you with this screen:

Side note: My team and I had agreed beforehand to all use version 2019.3.4f. It was the latest version of Unity when we first started working on this project.

For most of our course, our teachers had us stick to using the standard 3D render pipeline. We had been developing simple applications and games for computers and mobile platforms, so we never had too many issues. 

However, this time, we’re developing for the Oculus Quest. VR headsets — especially stand-alone headsets — can’t handle as much real-time rendering as computers can. As such, we were considering using the Universal Project Template (UPT), a pipeline that aimed to optimise graphics. 

On top of that, Unity had just introduced new extended reality (XR) development methods. They had released the XR Plug-in that would allow you to develop for multiple XR platforms at once. Our team could either use this new XR plug-in or use Oculus’ Oculus Integration plug-in from the Unity Asset Store.

To ensure that our team’s Unity workspace was properly prepared for development for the Oculus Quest, I decided to test out the different plug-ins and render pipelines available to see what would best suit our needs.

What was done:

Compared the advantages and drawbacks of using the standard 3D pipeline versus the Universal Project Template (UPT. Previously known as the LWRP).

Set-up 3 projects to be tested out on the Oculus Quest:

XR plug-in in 3D standard pipeline

XR plug-in in UPT

Oculus Integration Plug-in in UPT

Following this tutorial by Valem, I created and built a simple bowling scene in each project with the XR plug-in. In the project with the Oculus Integration, I followed this tutorial (also by Valem) and created a barebones scene with nothing but a cube and a plane.

I’ve only used the LWRP twice before. I have very little experience with it. Even though the Unity Documentation clearly lists down the differences in features supported by the UPT, I still did not fully understand the significance of any of those differences.

Testing out the differences with the different pipelines and plugins was difficult as I did not have access to the Oculus Quest, what with the quarantine and all. I had to send the builds to my teammate and wait for him to get back to me.

If I were completely honest, our team couldn’t tell much of a difference between the pipelines. As such, our team decided that we would build our prototype in the 3D standard pipeline first because of our familiarity with the pipeline and its quirks. Eventually, we plan to import our prototype into the UPT. Also, we chose to stick with the XR plug-in because of the ease it added to VR development, as compared to the Oculus Integration plug-in.

What was done well:

I believe I organised my files well! It may seem small, but following naming conventions really helped me to find the things I needed easier.

Possible improvements: