Families made gorgeous boots 👢… but the magic stopped at the touchscreen. In just one week I refactored the kiosk: every design now sits inside a one‑tap share button that triggers the device’s native Share sheet—more apps, zero friction—and visitors can layer any texture onto any color swatch, unleashing almost unlimited design possibilities.

🧑🏻‍💻 Role: Solo Full‑Stack Dev • 🗓️ Timeline: 1 week • 🛠 Tech: Nuxt, AWS S3 ✅ Result: Visitors can colorize textures + share designs via QR in 2 taps.

A well-known western heritage museum wanted to upgrade their interactive “Build Your Own Cowboy Boot” touchscreen experience. Visitors could pick from different shapes, colors, and exotic textures. However, two major pain points emerged:

Color + Texture Issue: If someone chose a texture (like snakeskin or alligator), they could not also pick a color. The texture image appeared as-is, ignoring the guest’s chosen hue.

Shareability: When visitors finished customizing their boots, they only got a link directly to the image file stored on Amazon S3. This meant no social-sharing features and no simple way to show off the design without sharing a boring direct link to a file.

The museum needed more flexibility for coloring these textures in real-time and an easier way for visitors to share their final designs—without sending people back into the actual kiosk app.

I came on board to solve these problems in a way that was both cost-efficient and user-friendly. Working in Nuxt (a Vue.js framework), with AWS S3 for image storage, I refactored the boot customizer and introduced a brand-new share page. Ultimately, the museum got the polished, engaging, and social-savvy solution they wanted—without blowing their budget.

Selecting “Ostrich” or “Alligator” locked in a preset image color.

Museum staff wanted visitors to be able to pick, say, a green alligator pattern and actually see a green alligator pattern on the boot preview.

I modified the images to strip out the original color (setting saturation to zero).

I applied the user’s chosen color behind the texture image and set the texture opacity to 40%.

This way, the base color would shine through, giving the texture a colorized look.

Removed the confusing toggle between “Color Only” and “Texture Only” so visitors see both at the same time—completely intuitive.

Now, if a visitor chooses “blue snake,” the texture overlay appears in blue. It looks sharp, and the kiosk interface remains simple for all ages.

After designing a boot, the kiosk generated a QR code linking to the raw file on S3.

The museum wanted a more polished share page with social buttons and a direct “Download” option—without letting people back into the kiosk app.

✅ Dynamic Share Page:

✅ Social Sharing & Meta Tags:

✅ Download & “Share” Buttons:

🚀 Result

When visitors scan their QR code, they land on a sleek page with their boot front-and-center, plus easy “Share” and “Download” options. The museum can even add messaging like “I made a boot at The Cowboy!” for social posts.

✅ User-Friendliness: Museum guests now have a seamless experience—pick a texture, pick a color, see it all at once.

✅ Social Engagement: The share page funnel dramatically improves how designs are posted to social media, letting the museum’s brand travel far beyond the kiosk itself.

✅ Flexibility & Scalability: Thanks to the dynamic page approach, adding new features, like collecting emails or storing visitor data, can be easily integrated in the future.

✅ Cost-Efficiency: By leveraging Nuxt’s built-in features, AWS S3, and a simple web share approach, I delivered maximum impact without requiring an entirely new backend or complicated hosting solutions.

Nuxt (Vue.js) for front-end, dynamic routing, and meta tag management.

AWS S3 for storing and retrieving the boot preview images.

Web Share API for quick, native mobile sharing.

CSS/JS Overlays for colorizing grayscale texture images.