6 Commits

Author SHA1 Message Date
7eb9616337 Merge pull request 'main' (#4) from 20254236/homework5:main into 20254236
Reviewed-on: #4
2026-04-21 23:37:57 +00:00
d5d200456f done 2026-04-21 18:12:19 +09:00
6f65c876a2 ready 2026-04-21 13:32:26 +09:00
0b9a3c4415 Ready 2026-04-21 13:29:50 +09:00
0570efcdfc test 2026-04-21 13:26:12 +09:00
9e96f5dcbf test 2026-04-21 12:16:09 +09:00
14 changed files with 133 additions and 175 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 840 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.4 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 347 KiB

133
PROPOSAL_20254236.md Normal file
View File

@@ -0,0 +1,133 @@
# Kakamora: C🥥c🥥nut Carvers
Haeri Kim (20254236) | [git.prototyping.id/20254236/homework5](https://git.prototyping.id/20254236/homework5)
### Table of Contents
- [Concept Overview](#concept-overview)
- [Core Mechanic: Carving](#core-mechanic-carving)
- [Progression System](#progression-system)
- [Tribe and Combat Phase](#tribe-and-combat-phase)
- [Win and Lose Conditions](#win-and-lose-conditions)
- [Key Controls](#key-controls)
---
## Concept Overview
> *Inspired by the Kakamora from Disney **Moana**. Tiny coconut warriors who go absolutely wild at sea.*
![Moana](assets/Moana.jpg)
A **first-person crafting and survival game** where you carve 🥥 coconuts into warriors, weapons, and tools. The better you carve, the stronger your tribe. Get enough crew together and they sail out to sea and then things get wild.
![Kakamora Warriors](assets/Kakamora.webp)
> *Visual tone ref: Kakamora from Moana (2016)*
---
## Core Mechanic: Carving
![Coconut](assets/Coconut-cutting.webp)
You see your **hands holding a knife**, cutting a coconut straight off the tree. Something similar to *Fruitninja.*
![Fruitninja](assets/fruitninja-1.jpg.webp)
### 🗡️ Knife Sharpness
Knife starts out **dull and slow**. Carving is a bit of a struggle at first.
Level up and the blade gets **sharper and snappier.**
```
bladeLevel = 1 -> slow drag, rough edges
bladeLevel = 5 -> smooth arc, clean cuts
bladeLevel = MAX -> one-swipe precision
```
### Facial Expressions and Accessories
How fast you carve changes what the Kakamora looks like:
| Carving Speed | Face Expression | Accessories |
|:---:|:---:|:---:|
| Slow | Blank stare | Plain coconut shell |
| Medium | Determined | Tiny painted markings |
| Fast | Fierce grin | War paint + bone trinkets |
| Ultra Fast | Battle-ready | Full armor + war crown |
---
## Progression System
1. **Start** - Grab a coconut off the tree (first-person knife action)
2. **Carve** - Shape it up. Carving speed decides warrior quality
3. **Level Up Knife** - Sharper blade = faster and cleaner carves
4. **Craft Arrows** - Once the tribe is big enough, start carving **poison arrows** for sea combat
| Name | Reference |
|:---:|:---:|
| Face | ![Face](assets/face.webp) ![Faces](assets/face2.png) |
| Arrow | ![Arrow](assets/arrow.png) |
```
if (tribeSize >= 10):
unlockPhase("ocean_voyage")
beginCrafting("toxic_arrows")
```
> **Toxic arrow carving** is its own minigame -- you need good timing or the poison goes to waste
---
## Tribe and Combat Phase
![Moana Ocean](assets/Moana.jpg)
### Setting Sail
Once you have **10+ Kakamora** carved and ready, the whole group **heads out to sea**.
Enemies start showing up.
### Ocean Battle
- Warriors fight with the **arrows you made**
- You keep crafting from the boat to resupply on the fly
### Retreat
If **more than half the tribe goes down** at sea:
```
if (survivors < tribeSize / 2):
triggerRetreat()
returnToLand()
// back to square one -> harvest new coconuts from trees
```
---
## Win and Lose Conditions
| Condition | Outcome |
|:---|:---|
| Tribe makes it through ocean combat | **Win** |
| Over half the tribe dies at sea | **Retreat** |
| Whole tribe wiped out | **GAME OVER** |
---
## Key Controls
All **keyboard-based**:
| Key | Action |
|:---:|:---|
| `W A S D` | Move / navigate |
| `Space` | Grab coconut from tree |
| `← →` | Carving stroke direction |
| `E` | Confirm / finish carve |
| `Q` | Switch to arrow crafting mode |

View File

@@ -1,175 +0,0 @@
# Game Proposal | Graphic Puzzle Game
- **Name**: Suhyun Lim
- **Student ID**: 20265367
- **Repository URL**: https://git.prototyping.id/20265367/homework5.git
## 1. Game Overview
This project proposes an educational puzzle game designed to improve the perceptual sensitivity of beginner designers.
The game focuses on enhancing the player's ability to recognize subtle visual differences in composition, alignment, typography, and graphic details.
The game is structured into two rounds, each targeting a different aspect of visual literacy.
- **Round 1: Tile Sliding Composition Puzzle**
The player rearranges fragmented image tiles to reconstruct the original reference design.
- **Round 2: Typeface Matching Challenge**
The player identifies and connects four matching pairs of alphabet letters that belong to the same font family.
The broader purpose of the game is not only entertainment, but also the cultivation of observational skills essential to graphic design practice. Through repeated play, users are expected to improve their ability to detect formal inconsistencies and typographic nuances.
The player wins by clearing both rounds within the time limit or target score. The player loses if time expires or too many mistakes are made.
<p align="center">
<img src="IMG_5367_1.png" width="800">
</p>
---
## 2. Game Mechanics
The player interacts through **mouse clicks** and **dragging gestures**.
| Action | Description |
| :--- | :--- |
| **Slide Tile** | Click or drag adjacent tiles to reconstruct the target image. |
| **Compare Reference** | Observe the reference design and identify misplaced visual fragments. |
| **Select Letter** | Click two letters to attempt a font match. |
| **Connect Pair** | Successfully identify four correct font pairs. |
| **Hint Use** | Optional hint reveals one correct move with score penalty. |
### Round 1: Tile Sliding Puzzle
The player is shown a target composition (poster, layout, or logo-based image) and a shuffled tile board.
The objective is to restore the original arrangement by sliding tiles into the empty space.
This round trains:
- spatial organization awareness
- balance and hierarchy recognition
- sensitivity to alignment and negative space
### Round 2: Typeface Pair Matching
The player is shown multiple alphabet characters rendered in different fonts.
The objective is to identify four pairs of letters that share the same typeface characteristics.
Examples of recognition cues include:
- serif vs sans-serif
- stroke contrast
- terminal shape
- x-height proportion
- geometric vs humanist construction
This round trains typographic discrimination and detail recognition.
---
## 3. Core Systems
### 3.1 Puzzle Board System (Array-based Grid Logic)
The tile puzzle board will be implemented as a two-dimensional array.
Each tile object stores:
- currentRow
- currentCol
- targetRow
- targetCol
- imageFragment
- movable
Where 0 represents the empty slot.
The system checks whether adjacent tiles may move into the empty space and continuously verifies puzzle completion.
### 3.2 Typography Matching System (Object Comparison Logic)
Each letter card is stored as an object in an array.
Main properties:
- character
- fontFamily
- selected
- matched
- position
[
letter: "R",
fontFamily: "Helvetica",
selected: false,
matched: false
]
When two cards are selected, the system compares their fontFamily values.
If identical:
- pair remains visible
- score increases
If different:
- cards reset after delay
- mistake counter increases
### 3.3 Scoring and Progression System
The game rewards speed and accuracy.
**Score Sources**
- Puzzle completion bonus
- Fast matching bonus
- Consecutive correct streak bonus
- Remaining time bonus
**Penalties**
- Wrong font matches
- Hint usage
- Excessive move count
**Win Condition**
- Clear Round 1 and Round 2 successfully
**ose Condition**
- Timer reaches zero
- Mistake limit exceeded
### 3.4 Adaptive Difficulty Scaling
To maintain challenge and learning effectiveness, the game gradually increases difficulty.
**Round 1 Scaling**
- Grid size expands: 3×3 → 4×4
- More visually similar fragments used
- Consecutive correct streak bonus
- Less reference preview time
**Round 2 Scaling**
- Fonts become more visually similar
- More distractor letters appear
- Matching time shortens
This system encourages progressive perceptual training.
---
## 4. Educational Value
This game explores how interactive systems can support design literacy through play.
Rather than teaching design through lectures alone, it applies procedural learning: users repeatedly engage with perceptual tasks and improve through immediate feedback.
The project therefore combines entertainment, pedagogy, and visual cognition training in a game format.
---
## 5. References
- sliding-puzzle.com: https://sliding-puzzle.com/impossible
<p align="center">
<img src="IMG_5367_2.png" width="800">
</p>
- Kern Type: https://type.method.ac/
<p align="center">
<img src="IMG_5367_3.png" width="800">
</p>

BIN
assets/Coconut-cutting.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

BIN
assets/Coconut.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 139 KiB

BIN
assets/Kakamora.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

BIN
assets/Kakomora_face.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 149 KiB

BIN
assets/Moana.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 132 KiB

BIN
assets/arrow.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

BIN
assets/face.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 611 KiB

BIN
assets/face2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 224 KiB