🧱 DevLog #1 – Clicking Into Place: Crafting a Custom ImageButton Class

Hey folks — welcome to the first ever devlog for Retrogression Games!

A couple days ago, I spent over 12 solid hours working on something deceptively simple: building a reusable ImageButton class for my games. Not just any button — a pixel-perfect, image-based, scalable button system designed to give me full control over UI in Teddy Bear Fishing Tournament and beyond.

🎮 Why Build It From Scratch?

I could've hacked together something quick, but I want my games to feel tight — even in the UI. That means:

• Total control over appearance and placement
• Support for different button states (idle, hover, pressed)
• Easy reusability across future projects

No Unity. No drag-and-drop. Just C#, MonoGame, and precision coding.

💻 The Tech Stack

I'm building everything with:

• C#/MonoGame as my core framework
• Tiled Map Editor for level design and mapping
• Custom-built components designed for reuse across projects

This combination gives me the perfect balance of performance and control while keeping my workflow straightforward.

🔧 What Got Done (So Far)

• The core of my ImageButton class is in place — it handles textures, interaction detection, and state tracking.
• I built in comprehensive state tracking (hover, pressed, selected) with unique visual feedback for each state—making buttons that feel responsive without overdoing the effects.
• The class intelligently handles positioning of both text labels and graphic elements relative to the button itself, maintaining proper alignment regardless of scale or position changes.
• I spent a big chunk of time just testing placement — getting those buttons to sit exactly where I wanted in Teddy Bear Fishing Tournament.
• It's not finished yet, but the bones are strong — and the structure will be reusable across all my future retro-style projects.

🧠 Lessons from the Trenches

• UI layout is way more time-consuming than it looks.
• A button is never just a button — it's sizing, spacing, alignment, interaction, and aesthetics all bundled together.
• Creating a flexible drawing system that accommodates different visual styles (with or without borders, with or without separate graphic elements) was surprisingly challenging but pays dividends for visual consistency.
• Properly calculating text and value positioning to maintain pixel-perfect alignment took more math than I initially expected—another reminder that even "simple" UI elements deserve careful attention.
• It's worth putting in the effort now, because future projects will drop this in and just work.
• MonoGame gives you the freedom to build exactly what you need, but you have to be ready to roll up your sleeves.

🔜 What's Next

• Finish up edge case handling (like overlapping click zones or state flickering).
• Maybe add sound hooks for click/hover effects — thanks to the idea that just popped into my head while writing this

This might all sound overkill for buttons, but for me, it's about shipping polished, player-friendly experiences from the ground up. One click at a time.

More to come.

— Retrogression Games