Aiki | Devpost

Aiki Logo
Main Screen
Loading Screen
Main Dashboard
Analytics Page

Inspiration

In a world obsessed with hyper-productivity, we noticed a missing metric: Cognitive Friction. When you push too hard, your brain burns out. Existing wellness apps try to fix this with boring graphs and clinical dashboards, which often just induce more stress. We wanted to build something entirely different—a wellness app that doesn't feel like a medical tool, but rather a premium, modern Japanese digital companion.

What it does

Aiki is a cognitive wellness ecosystem. Instead of showing you raw data and graphs, Aiki translates your current mental state (your cognitive friction) into one of five dynamic companions:

🔥 Fire (火): High energy, high friction. You are moving fast, but at risk of burnout. Represented by a Kitsune - a fox.

💧 Water (水): Low friction, high adaptability. You are in a state of flow. Represented by a Kawauso - a river otter.

🌍 Earth (土): Stable and grounded. Represented by a Tanuki - a raccoon dog.

💨 Wind (風): Erratic friction. Thoughts are expanding, but focus is scattered. Represented by a Momonga - a flying squirrel.

🌑 Void (空): Deep rest. Cognitive friction is neutralized. Represented by a Neko - a cat.

When Aiki detects dangerous friction levels, it opens a "Harmonize" window, prompting the user to realign their energy before their flow state breaks.

How we built it

We approached this hackathon like a real product launch, prioritizing a rigorous design system before writing a single line of logic or generating a single screen.

Step 1: Architecting the Brand Guide

Before we built a single prototype, we spent hours carefully selecting every element of the Aiki brand to ensure the design was as perfect and calming as possible. Inspired by the Japanese Godai (the Five Elements) and the clean look of Japanese streetwear art, we established a strict, stripped-down color triad. We also chose minimalist typography to maintain a modern Japanese aesthetic. Throughout the whole creation process, we refused to deviate from this foundation.

Step 2: Character Conceptualization

To represent the five Godai elements, we drew the initial ideas and character poses by hand. We wanted them to feel like premium streetwear mascots rather than generic stock icons.

Step 3: Rendering with Generative AI

Given the tight timeframe of the hackathon, we couldn't manually vectorize every character. We took our initial sketches and concepts and used Generative AI to finish them. We treated our prompt engineering like code—feeding the AI our exact hex codes, enforcing a "no shadows, no gradients" rule, and strictly guiding it to match our specific art style. This allowed us to produce five 100% custom, production-ready assets that look identically branded.

Step 4: Building with Figma Make

With the brand guide, character assets, and pages designed in Figma Design, we moved into the UI build. We translated our brand rules into detailed prompts for Figma Make, instructing the AI to generate the core pages, layouts, and routing for our educational hub and dashboards.

Step 5: Final Polish

We fixed Figma Make's mistakes, re-applied our strict brand guide rules, dropped in our custom Godai vector characters, and linked the final prototype together to create a flawless user experience.

Challenges we ran into

While AI was a massive help, forcing it to respect our brand guide was our hardest step. Inside Figma Make, we constantly battled the AI hallucinating structural elements. It would frequently override our custom typography, add off-brand colors, and completely break our minimalist layout structures. Taming the AI to adhere to a strict, high-end UI design required deep and thoughtful prompt engineering, as well as intense manual refinement to fix the fonts, colors, and routing it broke along the way.

Accomplishments that we're proud of

We are incredibly proud of the storytelling and our unwavering visual consistency. Aiki doesn't just look beautiful; the lore gives it a soul. Tying the abstract concept of "Cognitive Friction" to the Japanese Godai system makes the user experience feel magical and deeply personal. We successfully built a prototype that feels like a polished, market-ready app, without ever compromising our initial brand vision.

What we learned

We learned the sheer power of a strict design system. By locking in our brand guide in the first hours of the project, we had a single source of truth that saved us during the final sprint. We also learned how to integrate Gen-AI into a professional design workflow—using it to execute a specific artistic vision (rendering our character sketches) rather than letting it dictate the design for us.

What's next for Aiki

The immediate next step is integrating real-time wearable biometrics (like HRV and screen-time APIs) so the app can autonomously shift the user's Godai state in real-time. After that, we plan to manually render the Godai characters ourselves using digital software to have total control over our creations. We also plan to build out the "Harmonize" portal with dynamic, element-specific breathing exercises.

Aiki isn't just a project; it's a shift in how we interact with our own mental health. We proved that wellness tech doesn't have to look like a clinical hospital monitor. By blending ancient philosophy, strict design principles, and cutting-edge AI, we didn't just build an app—we built an ecosystem. The future of productivity isn't about pushing harder; it's about flowing smarter.