Website powered by

Concept, UI/UX: Suku Suku Separuh

Update (12/6/2023): This game was featured on gaming journalism site Kakuchopurei! (https://www.kakuchopurei.com/2023/05/get-ready-to-serve-with-suku-suku-separuh-an-upcoming-educational-game/)

"Suku Suku Separuh" (Quarter Quarter Half) is an edutainment game for primary school students aged 9-12, where you play as a "kakak" working at a school canteen serving balanced nutritional meals to children during recess. The trick is: the menu switches up every time you play! Can you keep track of every student's demands while serving them balanced meals before time runs out?!

The aim of the game is to educate the public on healthy eating habits based on research conducted on healthy plate portions and the food pyramid.

As property of Universiti Putra Malaysia and the Health Ministry of Malaysia (Kementerian Kesihatan Malaysia, or KKM), the game is available for play on primary school computers nationwide... and also on itch.io! Download it here! (https://s34nn.itch.io/suku-suku-separuh)

I was the sole artist for this project --- hence the Art Direction credit --- and our 3-person team (one other designer and programmer) worked closely with the Health Ministry of Malaysia across meetings and reviews to ensure the desired message of the game was conveyed correctly.

5 minutes of "Suku Suku Separuh" gameplay.

Project thumbnail.

Project thumbnail.

Graphical user interace (GUI) art asset layout sheet for the active game level. This game is a time-based mix-and-match puzzle game, so you roleplay as the canteen worker to serve healthy meals to students.

Graphical user interace (GUI) art asset layout sheet for the active game level. This game is a time-based mix-and-match puzzle game, so you roleplay as the canteen worker to serve healthy meals to students.

Graphical user interace (GUI) art layout sheet for the food trays, pots and plated food assets in the active game level. The plated food assets are resized directly in-engine to reflect the desired portion size on the plate.

Graphical user interace (GUI) art layout sheet for the food trays, pots and plated food assets in the active game level. The plated food assets are resized directly in-engine to reflect the desired portion size on the plate.

Student sprites in the active game level. There are 13 approved students in total, but the player will only see 10 random students per level.

Student sprites in the active game level. There are 13 approved students in total, but the player will only see 10 random students per level.

Art direction document for the game, first presented to the KKM for their approval in the early stages of the project.

Art direction document for the game, first presented to the KKM for their approval in the early stages of the project.

UI layout concept art for the active game level. The preliminary sketch was presented alongside other alternate game pitches to the KKM with sketches of their own, not pictured in this entry.

UI layout concept art for the active game level. The preliminary sketch was presented alongside other alternate game pitches to the KKM with sketches of their own, not pictured in this entry.

UI layout concept art for the active game level, with gameplay design notes.

UI layout concept art for the active game level, with gameplay design notes.

UI layout concept art for the active game level, with gameplay design notes.

UI layout concept art for the active game level, with gameplay design notes.

Proof of concept screenshot samples of the active game level, to demonstrate the utility and look of various gameplay mechanics and art assets.

Proof of concept screenshot samples of the active game level, to demonstrate the utility and look of various gameplay mechanics and art assets.

Animation documentation for UI assets in the active game level, provided as reference to the programmers for asset implementation.

Animation documentation for UI assets in the active game level, provided as reference to the programmers for asset implementation.

Animation documentation for UI assets in the active game level, provided as reference to the programmers for asset implementation.

Animation documentation for UI assets in the active game level, provided as reference to the programmers for asset implementation.

Preliminary sketches of the male students for the game, reviewed and approved at multiple stages by KKM.

Preliminary sketches of the male students for the game, reviewed and approved at multiple stages by KKM.

Preliminary sketches of the female students for the game, reviewed and approved at multiple stages by KKM.

Preliminary sketches of the female students for the game, reviewed and approved at multiple stages by KKM.

Graphical user interace (GUI) art asset layout sheet for the main menu.

Graphical user interace (GUI) art asset layout sheet for the main menu.

Alternate concepts and development sketches for main menu. A comic book cover-styled main menu was favoured over a diegetic canteen menu. The old game title "Kakak Kantin Masak" is a shrewd reference to the KKM as this project's sponsor.

Alternate concepts and development sketches for main menu. A comic book cover-styled main menu was favoured over a diegetic canteen menu. The old game title "Kakak Kantin Masak" is a shrewd reference to the KKM as this project's sponsor.

Concept art for the canteen "kakak" that would be displayed on the main menu, reviewed and approved at multiple stages by KKM.

Concept art for the canteen "kakak" that would be displayed on the main menu, reviewed and approved at multiple stages by KKM.

Graphical user interace (GUI) art asset layout sheet for the today's food menu. Players learn about the gameplay mechanics of the food in this menu, as well as some scientific nutritional information provided by KKM.

Graphical user interace (GUI) art asset layout sheet for the today's food menu. Players learn about the gameplay mechanics of the food in this menu, as well as some scientific nutritional information provided by KKM.

Alternate concepts and development sketches for the today's food menu. A vertical arrangement of the food was suggested at one point to subtly illustrate the food's place in the layers of the pyramid.

Alternate concepts and development sketches for the today's food menu. A vertical arrangement of the food was suggested at one point to subtly illustrate the food's place in the layers of the pyramid.

Graphical user interace (GUI) art asset layout sheet for the settings and achievements menu, and concept art for the respective menus.

Graphical user interace (GUI) art asset layout sheet for the settings and achievements menu, and concept art for the respective menus.

Graphical user interace (GUI) art asset layout sheet for the tutorial and results menu.

Graphical user interace (GUI) art asset layout sheet for the tutorial and results menu.

Development sketches for the tutorial. Due to the inclusion of English and Malay languages in the game, we faced a challenge to not include text in the tutorial to save time on translations being provided by KKM.

Development sketches for the tutorial. Due to the inclusion of English and Malay languages in the game, we faced a challenge to not include text in the tutorial to save time on translations being provided by KKM.

Concept art for the tutorial. As a result of the aforementioned challenge, all tutorial steps are conveyed through reused assets and animations for consistency and simplicity.

Concept art for the tutorial. As a result of the aforementioned challenge, all tutorial steps are conveyed through reused assets and animations for consistency and simplicity.

Concept art for the results menu. The simpler option was favoured over the fully illustrated results screen to mitigate on variating art assets based on the player's performance.

Concept art for the results menu. The simpler option was favoured over the fully illustrated results screen to mitigate on variating art assets based on the player's performance.

Sample poster for "Suku Suku Separuh". Multiple versions were made in various dimensions for different purposes.

Sample poster for "Suku Suku Separuh". Multiple versions were made in various dimensions for different purposes.

Sample poster for "Suku Suku Separuh". Multiple versions were made in various dimensions for different purposes.

Sample poster for "Suku Suku Separuh". Multiple versions were made in various dimensions for different purposes.

Sample poster for "Suku Suku Separuh". Multiple versions were made in various dimensions for different purposes.

Sample poster for "Suku Suku Separuh". Multiple versions were made in various dimensions for different purposes.