Google Authentication

VibeMap landing page showing the Sign in with Google button

Google Sign Up Process

Sign Up Steps

1. Navigate to the landing page

2. Click "Sign in with Google" button

3. Select your Google account from the popup

4. Grant necessary permissions

5. Account is automatically created and logged in

Google OAuth Flow

1. Initial Click: Click "Sign in with Google" button

2. Google Popup: Google authentication popup appears

3. Account Selection: Choose your Google account

4. Permission Grant: Allow VibeMap to access your basic profile

5. Account Creation: VibeMap creates account using Google profile data

6. Auto Login: You're automatically logged in

7. Dashboard Redirect: Redirected to dashboard

Google OAuth popup showing permission request screen

Required Permissions

• Profile Information: Name and email address

• Profile Picture: Avatar image (optional)

• Email Address: For account identification

Account Data Imported

• Name: Full name from Google profile

• Email: Primary email address

• Profile Picture: Avatar image (if available)

• Account Status: Automatically verified

Google Login Process

Login Steps

1. Click "Sign in with Google" button

2. Complete OAuth flow

3. Redirected to dashboard

Login Flow

1. Click Button: Click "Sign in with Google"

2. Google Auth: Google authentication popup

3. Account Selection: Select your Google account

4. Permission Check: Verify existing permissions

5. Login Success: Redirected to dashboard

Account Linking

• Existing Account: Links to existing VibeMap account

• New Account: Creates new account if none exists

• Multiple Accounts: Supports multiple Google accounts

Dashboard Overview

Upon successful Google authentication, you'll see:

• Header: Navigation menu with user profile dropdown

• Main Area: Empty state with "Create New Project" button

• Sidebar: Quick access to projects (initially empty)

Dashboard view after successful Google authentication showing empty state and Create New Project button

User Profile Dropdown

• Profile Settings: Edit account information

• Account Settings: Manage Google account connection

• Billing: View subscription and usage

• Sign Out: Logout from account

Account Management

Google Account Connection

• View Connection: See connected Google account

• Disconnect: Remove Google account connection

• Reconnect: Re-establish Google account connection

• Account Sync: Sync profile changes from Google

Profile Management

• Name: Editable name field

• Email: Read-only (managed by Google)

• Profile Picture: Syncs with Google profile

• Account Settings: Manage account preferences