Over the past few days, I worked on something I’ve always wanted to try; my very own dress-up game! Inspired by the nostalgic flash games I used to love and my own drawings, this was a cozy coding project and a chance to bring a static illustration to life in a simple and interactive way.

I drew the illustrations in Procreate; each accessory, outfit piece, and hairstyle was made on a square 248x248px canvas with some space left at the bottom for the buttons. There are layers for tops, bottoms, shoes, accessories, and headwear, all designed to stack perfectly over a base character.

The colour palette I wanted were soft pastels, and I kept the interface cute and minimal. I also added navigation arrows to scroll through the items and category buttons to choose between types of clothing/accesories. Everything fits into a neat little frame, just like a mini digital stickerbook

This was my first time diving into coding using Visual Studio Code, and it was an exciting learning journey! I started by creating the assets folder, where I organized everything from the base character to all the accessories, like necklaces, shoes, and tops. Once the assets were in place, I moved on to writing the HTML file, which laid the foundation for the structure of the game, defining where each element (like buttons and images) would go. Then, I tackled the CSS, where I focused on making the game visually appealing with pastel colors and ensuring everything was well-positioned within a square layout. After styling, I created the script.js, which brought the interactive part to life, switching the items when you click the buttons. Once everything was set, I used the live server extension to view it online.

Once I had everything working on my own computer, I published it as a web app using GitHub Pages, so anyone can try it out online! You can check it out here: PinkWallsDressUpGame

This project really reminded me how fun it is to combine illustration and interaction... I’m already thinking about ways to improve it with more themes or seasonal outfits and even new coding projects...

Let me know if you try it out!

Until next time,
Carina ♡