For the Touch2Tech project, I wanted the branding to reflect not only the project's core philosophy—bringing physical-world analogies into UI—but also a sense of fun, curiosity, and nostalgia. That’s where Cpt. Revolt was born.

Website Link : https://touch2tech.framer.website/

🪙 The Mascot: Cpt. Revolt

Cpt. Revolt is a charming, slightly confused robot who comes from a world of knobs, levers, and paper. He’s learning to adapt to the digital age, and he invites users to teach him how physical objects become digital UI components.
This narrative instantly adds personality and emotional connection to the project. His character became the anchor for the visual storytelling used across the website and design challenge.

🔁 Logo Design & Identity

The Touch2Tech logo was crafted around the mascot, designed as a 3D physical button character that feels tangible and playful. The round button design is a direct nod to the analog interfaces we reference—adding depth and realism. The color palette leans into a retro-tech aesthetic to emphasize nostalgia while keeping the design crisp and web-friendly.

🕹️ Visual Language & Theme

The entire branding system uses:

• Retro UI cues (like old-school windows, neon outlines, pixel fonts)

• Bright interaction colors for clear hierarchy and excitement

• Rounded typography and playful language to make the challenge more inviting

• Character animations and comic-style UI panels that give motion and delight

📅 Campaign Integration

The branding supports the 30-day challenge structure, where each day’s prompt feels like a new “mission” from Cpt. Revolt. From tooltips to modal messages, the mascot guides the user like a quirky sidekick, transforming the learning experience into a journey rather than a task.

By embedding branding into every layer—from logotype to user interaction—the Touch2Tech campaign builds a cohesive, enjoyable identity that speaks to both designers’ creativity and users’ emotions.

🧠 Branding Tools Used:

• Figma for UI design & layout

• Womp for 3D mascot rendering

• Web animations with Framer