AI
Pass

Build an AI Habit Coach App with AI Pass SDK — Complete Tutorial

Build an AI Habit Coach App with AI Pass SDK — Complete Tutorial

Wellness is one of the strongest app niches for AI. People invest in tools that help them become better — and habit coaches have high repeat usage as users come back to refine their plans.

What You'll Build

A conversational AI habit coach where users describe their goal, and the AI helps design a personalized habit plan through natural back-and-forth conversation.

Step 1: Get Your Client ID

  1. Sign up at aipass.one, verify email
  2. Developer DashboardOAuth2 Clients → Create client
  3. Copy Client ID

Step 2: The App

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>AI Habit Coach</title>
  <link href="https://aipass.one/aipass-ui.css" rel="stylesheet">
  <style>
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: sans-serif; background: #0a0a0b; color: #f0f0f0; height: 100vh; display: flex; flex-direction: column; }
    .header { padding: 16px 20px; border-bottom: 1px solid #1a1a1a; }
    .header h1 { font-size: 1.2rem; }
    .chat { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 14px; }
    .msg { max-width: 78%; padding: 12px 16px; border-radius: 14px; line-height: 1.6; }
    .msg.ai { background: #1a1a1c; align-self: flex-start; border-bottom-left-radius: 4px; white-space: pre-wrap; }
    .msg.user { background: #16a085; align-self: flex-end; border-bottom-right-radius: 4px; }
    .input-row { display: flex; gap: 10px; padding: 14px 20px; border-top: 1px solid #1a1a1a; }
    .input-row textarea { flex: 1; padding: 10px 14px; background: #1a1a1c; border: 1px solid #333; border-radius: 10px; color: #f0f0f0; font-size: 0.95rem; resize: none; min-height: 44px; max-height: 100px; font-family: inherit; }
    .input-row textarea:focus { outline: none; border-color: #16a085; }
    .send-btn { padding: 10px 18px; background: #16a085; border: none; border-radius: 10px; color: white; cursor: pointer; align-self: flex-end; }
    .send-btn:disabled { background: #333; cursor: not-allowed; }
    .quick-starts { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px 20px; border-top: 1px solid #1a1a1a; }
    .qs-btn { padding: 6px 12px; background: #1a1a1c; border: 1px solid #333; border-radius: 20px; color: #aaa; cursor: pointer; font-size: 0.85rem; }
    .qs-btn:hover { border-color: #16a085; color: #f0f0f0; }
    .typing { display: none; align-self: flex-start; padding: 12px 16px; background: #1a1a1c; border-radius: 14px; color: #888; border-bottom-left-radius: 4px; }
  </style>
</head>
<body>
  <div class="header"><h1>🌱 AI Habit Coach</h1></div>
  
  <div class="chat" id="chat">
    <div class="msg ai">Hey! 👋 I'm your AI Habit Coach.

Tell me about a habit you want to build — or a bad habit you want to break. The more you share about your current routine and past attempts, the more personalized I can make the plan.

What's the habit you're working on?</div>
  </div>
  <div class="typing" id="typing">thinking...</div>

  <div class="quick-starts" id="quickStarts">
    <button class="qs-btn" onclick="send('I want to start exercising regularly')">🏃 Exercise habit</button>
    <button class="qs-btn" onclick="send('I want to read more books')">📚 Reading habit</button>
    <button class="qs-btn" onclick="send('I want to wake up earlier')">⏰ Early rising</button>
    <button class="qs-btn" onclick="send('I want to meditate daily')">🧘 Meditation</button>
    <button class="qs-btn" onclick="send('I want to drink more water')">💧 Hydration</button>
  </div>

  <div class="input-row">
    <textarea id="input" placeholder="Describe your habit goal..." onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();sendMsg();}"></textarea>
    <button class="send-btn" id="sendBtn" onclick="sendMsg()">Send</button>
  </div>

  <script src="https://aipass.one/aipass-sdk.js"></script>
  <script>
    AiPass.initialize({ clientId: 'YOUR_CLIENT_ID', requireLogin: true, darkMode: true });

    const systemPrompt = `You are a world-class habit coach with deep knowledge of behavior change science (BJ Fogg's Tiny Habits, James Clear's Atomic Habits, Charles Duhigg's The Power of Habit).

Your approach:
1. Ask clarifying questions to understand the person's life, schedule, and past failures
2. Design a specific, small, implementable habit (not vague advice)
3. Use habit stacking (attach to existing behaviors)
4. Start absurdly small — build confidence before adding challenge
5. Anticipate obstacles and plan for them
6. Celebrate small wins — immediate satisfaction is key

Be warm, encouraging, and specific. Never give generic advice. Always ask follow-up questions if you need more context to personalize the plan.`;

    const messages = [];

    function addMsg(role, text) {
      messages.push({ role, content: text });
      const div = document.createElement('div');
      div.className = `msg ${role === 'user' ? 'user' : 'ai'}`;
      div.textContent = text;
      document.getElementById('chat').appendChild(div);
      document.getElementById('chat').scrollTop = document.getElementById('chat').scrollHeight;
    }

    async function send(text) {
      document.getElementById('input').value = text;
      await sendMsg();
    }

    async function sendMsg() {
      const input = document.getElementById('input');
      const text = input.value.trim();
      if (!text) return;
      input.value = '';
      document.getElementById('quickStarts').style.display = 'none';
      addMsg('user', text);
      document.getElementById('sendBtn').disabled = true;
      document.getElementById('typing').style.display = 'block';

      try {
        const r = await AiPass.generateCompletion({
          model: 'gpt-5-mini',
          temperature: 1,
          max_tokens: 16000,
          messages: [
            { role: 'system', content: systemPrompt },
            ...messages
          ]
        });
        const reply = r.choices[0].message.content;
        addMsg('assistant', reply);
        document.getElementById('typing').style.display = 'none';
      } catch(e) {
        console.error(e);
        document.getElementById('typing').style.display = 'none';
        addMsg('assistant', 'Something went wrong. Please try again.');
      } finally {
        document.getElementById('sendBtn').disabled = false;
        input.focus();
      }
    }
  </script>
</body>
</html>

Key SDK Pattern: Multi-turn Conversation

// Maintain conversation history across turns
const messages = [];

messages.push({ role: 'user', content: userText });

const r = await AiPass.generateCompletion({
  model: 'gpt-5-mini',
  temperature: 1,      // Required for GPT-5
  max_tokens: 16000,   // Required for complete responses
  messages: [
    { role: 'system', content: systemPrompt },
    ...messages          // Full conversation history
  ]
});

const reply = r.choices[0].message.content;
messages.push({ role: 'assistant', content: reply });

Multi-turn conversation is the core pattern for coaching, tutoring, and therapy apps. The SDK handles token costs transparently.

Monetization

Wellness apps have strong retention. Users who commit to a habit goal come back repeatedly to refine their plan or tackle a new habit. 50% commission on every message via your Client ID.

Live demo: aipass.one/apps/habit-coach Developer Dashboard: aipass.one/panel/developer.html