Mori AtelierDefault Ren'Py looks, well, default. Every VN made with the engine shares the same basic look until you customize it. Today I tackled the GUI layer and made the game feel uniquely ours.
The GUI System
Ren'Py's GUI is built with its own screen language — a declarative system for defining UI layouts. The default screens live in gui.rpy and screens.rpy, and you can override nearly everything.
Custom Dialogue Box
The first thing I changed was the dialogue box. The default one is functional but bland. Here's the custom say screen:
screen say(who, what):
style_prefix "say"
window:
id "window"
background Frame("gui/textbox.png", 40, 40)
if who is not None:
window:
id "namebox"
style "namebox"
text who id "who"
text what id "what"
The key is the Frame object — it takes a 9-patch style image and stretches it to fit the text. I painted a semi-transparent dark box with a subtle cyan border that matches our color scheme.
Main Menu Overhaul
The main menu got the biggest visual upgrade. Instead of the default list of buttons, I created a fullscreen layout with:
- A background illustration that sets the mood
- The game logo rendered as an image, not text
- Minimal buttons with hover animations
- A subtle particle effect using ATL (Animation and Transformation Language)
transform menu_button_hover:
on hover:
easein 0.2 xoffset 8
on idle:
easeout 0.2 xoffset 0
ATL is one of Ren'Py's best features — it lets you define complex animations declaratively without writing any Python.
Color Palette
I settled on a consistent palette throughout the UI:
| Element | Color | Hex |
|---------|-------|-----|
| Background | Deep charcoal | #111e21 |
| Primary accent | Cyan | #30c9e8 |
| Text | Light slate | #cbd5e1 |
| Borders | Dark teal | #1e3a3f |
| Highlight | Violet | #8b5cf6 |
Consistency is everything. Every button, every panel, every text color now pulls from this palette.
Before & After
The transformation is dramatic. What was a generic-looking VN now has a distinct visual identity. The dark theme with cyan accents gives it a slightly futuristic, melancholic vibe — exactly what the story calls for.
Takeaways
- Don't fight the framework — Ren'Py's screen language is powerful once you learn it
- Start with the textbox — it's what the player sees 90% of the time
- Consistency over complexity — a simple palette applied everywhere beats elaborate one-off designs
- Test on multiple resolutions — GUI elements that look great at 1920x1080 might break at 1280x720
Next up: implementing a custom save/load screen and adding sound design.