304 lines
8.8 KiB
Markdown
304 lines
8.8 KiB
Markdown
# User Flow Documentation
|
|
|
|
## Onboarding Flow
|
|
|
|
```mermaid
|
|
stateDiagram-v2
|
|
[*] --> LandingPage: User visits site
|
|
|
|
LandingPage --> Registration: Click "Sign Up"
|
|
Registration --> GoogleAuth: Click "Sign in with Google"
|
|
|
|
GoogleAuth --> WelcomePage: Successfully authenticated
|
|
GoogleAuth --> Registration: Authentication failed
|
|
|
|
WelcomePage --> SetupOptions: Choose setup path
|
|
|
|
SetupOptions --> GuidedTour: Choose "Show me around"
|
|
SetupOptions --> APIKeySetup: Choose "Set up API keys"
|
|
SetupOptions --> SkipSetup: Choose "Skip for now"
|
|
|
|
GuidedTour --> APIKeySetup: Tour complete
|
|
APIKeySetup --> Dashboard: API keys set
|
|
SkipSetup --> Dashboard: Skip setup
|
|
|
|
Dashboard --> [*]
|
|
```
|
|
|
|
### Steps Breakdown:
|
|
|
|
1. **Landing Page**
|
|
- Introduction to TradingScriptPro
|
|
- Value proposition
|
|
- Call-to-action for sign-up
|
|
- Login option for existing users
|
|
|
|
2. **Registration**
|
|
- Google social login option
|
|
- Terms of service acceptance
|
|
- Privacy policy acknowledgment
|
|
|
|
3. **Google Authentication**
|
|
- Secure OAuth flow
|
|
- Email permission request
|
|
|
|
4. **Welcome Page**
|
|
- Welcome message for new users
|
|
- Brief explanation of the 5 free credits
|
|
- Setup options presentation
|
|
|
|
5. **API Key Setup (Optional)**
|
|
- Educational content about LLM API keys
|
|
- Secure input fields for API keys
|
|
- Validation and test connection
|
|
|
|
6. **Guided Tour (Optional)**
|
|
- Interactive walkthrough of key features
|
|
- Example strategy creation
|
|
- Quick tips for best results
|
|
|
|
## Core User Journey: Strategy Creation
|
|
|
|
```mermaid
|
|
stateDiagram-v2
|
|
[*] --> Dashboard: User logged in
|
|
|
|
Dashboard --> StrategyBuilder: Click "Create New Strategy"
|
|
Dashboard --> AIGenerator: Click "AI Generate Strategy"
|
|
|
|
StrategyBuilder --> TrendSetup: Step 1
|
|
TrendSetup --> EntrySetup: Continue
|
|
EntrySetup --> ExitSetup: Continue
|
|
ExitSetup --> StopLossSetup: Continue
|
|
|
|
StopLossSetup --> StrategyReview: All components configured
|
|
|
|
AIGenerator --> AIPromptInput: Describe strategy goals
|
|
AIPromptInput --> AIProcessing: Submit request
|
|
AIProcessing --> AIResults: Strategy generated
|
|
AIProcessing --> AIError: Generation failed
|
|
|
|
AIError --> AIPromptInput: Retry with modifications
|
|
AIResults --> StrategyReview: Review generated strategy
|
|
|
|
StrategyReview --> StrategyTesting: Preview strategy
|
|
StrategyReview --> StrategyModification: Edit components
|
|
|
|
StrategyModification --> StrategyReview: Changes complete
|
|
|
|
StrategyTesting --> StrategySaving: Save strategy
|
|
StrategySaving --> ExportOptions: Strategy saved
|
|
|
|
ExportOptions --> PineScriptMinimal: Export minimal code
|
|
ExportOptions --> PineScriptDetailed: Export detailed code
|
|
ExportOptions --> ShareCommunity: Share with community
|
|
|
|
PineScriptMinimal --> Dashboard: Return to dashboard
|
|
PineScriptDetailed --> Dashboard: Return to dashboard
|
|
ShareCommunity --> Dashboard: Return to dashboard
|
|
```
|
|
|
|
### Steps Breakdown:
|
|
|
|
1. **Strategy Builder Entry**
|
|
- Two paths: Manual builder or AI generator
|
|
- Clear explanation of each approach
|
|
- Credit usage information for AI generation
|
|
|
|
2. **Manual Strategy Building**
|
|
- **Trend Setup**:
|
|
- Select from trend indicators
|
|
- Configure parameters
|
|
- Visual feedback on selection
|
|
|
|
- **Entry Setup**:
|
|
- Select from entry indicators
|
|
- Configure parameters
|
|
- Rules for entry conditions
|
|
|
|
- **Exit Setup**:
|
|
- Select from exit indicators
|
|
- Configure parameters
|
|
- Rules for exit conditions
|
|
|
|
- **Stop Loss Setup**:
|
|
- Configure stop loss approach
|
|
- Set parameters (fixed, trailing, indicator-based)
|
|
- Risk management options
|
|
|
|
3. **AI Strategy Generation**
|
|
- **Prompt Input**:
|
|
- Market selection
|
|
- Trading style preferences
|
|
- Goals and risk tolerance
|
|
|
|
- **Processing**:
|
|
- Loading indicator
|
|
- Status updates
|
|
- Credit usage notification
|
|
|
|
- **Results**:
|
|
- Complete strategy presentation
|
|
- Educational explanation of components
|
|
- Options to modify or accept
|
|
|
|
4. **Strategy Review**
|
|
- Complete strategy overview
|
|
- Component interaction explanation
|
|
- Performance expectations
|
|
- Modification options
|
|
|
|
5. **Export Options**
|
|
- PineScript code generation:
|
|
- Minimal code option
|
|
- Detailed commented code option
|
|
- Copy to clipboard functionality
|
|
- Community sharing option
|
|
- Version saving
|
|
|
|
## Account Management Flow
|
|
|
|
```mermaid
|
|
stateDiagram-v2
|
|
[*] --> Dashboard
|
|
|
|
Dashboard --> AccountSettings: Click user avatar
|
|
|
|
AccountSettings --> SubscriptionManagement: "Subscription" tab
|
|
AccountSettings --> APIKeyManagement: "API Keys" tab
|
|
AccountSettings --> ProfileSettings: "Profile" tab
|
|
|
|
SubscriptionManagement --> ViewCurrentPlan: View subscription details
|
|
SubscriptionManagement --> UpgradePlan: Upgrade to premium
|
|
SubscriptionManagement --> EnterCoupon: Apply coupon code
|
|
|
|
UpgradePlan --> PaymentSelection: Choose payment method
|
|
PaymentSelection --> StripeCheckout: Stripe selected
|
|
PaymentSelection --> PayPalCheckout: PayPal selected
|
|
|
|
StripeCheckout --> SubscriptionConfirmation: Payment successful
|
|
PayPalCheckout --> SubscriptionConfirmation: Payment successful
|
|
|
|
SubscriptionConfirmation --> Dashboard: Return to dashboard
|
|
|
|
APIKeyManagement --> AddNewKey: Add new provider key
|
|
APIKeyManagement --> RemoveKey: Remove existing key
|
|
APIKeyManagement --> UpdateKey: Update existing key
|
|
|
|
AddNewKey --> APIKeyValidation: Test connection
|
|
UpdateKey --> APIKeyValidation: Test connection
|
|
|
|
APIKeyValidation --> APIKeySuccess: Validation passed
|
|
APIKeyValidation --> APIKeyError: Validation failed
|
|
|
|
APIKeySuccess --> APIKeyManagement: Return to key management
|
|
APIKeyError --> AddNewKey: Try again
|
|
|
|
RemoveKey --> APIKeyManagement: Key removed
|
|
|
|
ProfileSettings --> UpdateProfile: Edit profile information
|
|
UpdateProfile --> ProfileSettings: Save changes
|
|
```
|
|
|
|
### Steps Breakdown:
|
|
|
|
1. **Account Settings Entry**
|
|
- User avatar menu in header
|
|
- Settings categories
|
|
- Account status overview
|
|
|
|
2. **Subscription Management**
|
|
- Current plan display
|
|
- Usage statistics (credits remaining)
|
|
- Upgrade options with benefits
|
|
- Coupon code redemption
|
|
|
|
3. **Payment Process**
|
|
- Payment method selection
|
|
- Secure checkout integration
|
|
- Order summary
|
|
- Confirmation and receipt
|
|
|
|
4. **API Key Management**
|
|
- Current keys display (partially masked)
|
|
- Add/update/remove functionality
|
|
- Connection testing
|
|
- Security information
|
|
|
|
5. **Profile Settings**
|
|
- Basic profile information
|
|
- Email preferences
|
|
- Account deletion option
|
|
|
|
## Error Handling Flows
|
|
|
|
```mermaid
|
|
stateDiagram-v2
|
|
[*] --> UserAction: User performs action
|
|
|
|
UserAction --> Success: Action completes successfully
|
|
UserAction --> Error: Action fails
|
|
|
|
Error --> ValidationError: Input validation fails
|
|
Error --> APIError: API call fails
|
|
Error --> CreditsExhausted: User out of credits
|
|
Error --> AuthError: Authentication issue
|
|
|
|
ValidationError --> InlineErrorDisplay: Show error next to input
|
|
ValidationError --> UserAction: User corrects input
|
|
|
|
APIError --> ConnectionErrorModal: Show API connection error
|
|
APIError --> APITroubleshooting: Show troubleshooting steps
|
|
|
|
CreditsExhausted --> UpgradePrompt: Show upgrade offer
|
|
CreditsExhausted --> CouponPrompt: Offer coupon option
|
|
|
|
AuthError --> ReauthPrompt: Prompt for reauthentication
|
|
|
|
InlineErrorDisplay --> UserAction: User corrects error
|
|
ConnectionErrorModal --> APIKeyManagement: Go to API key settings
|
|
APITroubleshooting --> UserAction: User retries after troubleshooting
|
|
UpgradePrompt --> SubscriptionManagement: User opts to upgrade
|
|
CouponPrompt --> EnterCoupon: User enters coupon
|
|
ReauthPrompt --> GoogleAuth: User reauthenticates
|
|
```
|
|
|
|
### Error Scenarios and Recovery:
|
|
|
|
1. **Validation Errors**
|
|
- Field-specific error messages
|
|
- Immediate feedback on input
|
|
- Clear recovery instructions
|
|
|
|
2. **API Connection Errors**
|
|
- Clear explanation of the issue
|
|
- Troubleshooting steps:
|
|
- Check API key validity
|
|
- Verify internet connection
|
|
- Check LLM provider service status
|
|
- Retry options with backoff
|
|
|
|
3. **Credits Exhausted**
|
|
- Friendly notification
|
|
- Options to:
|
|
- Upgrade to premium
|
|
- Enter coupon code
|
|
- Review existing strategies
|
|
|
|
4. **Authentication Errors**
|
|
- Session expiration handling
|
|
- Secure re-authentication
|
|
- Session persistence options
|
|
|
|
## Alternative Flows
|
|
|
|
1. **Guest Mode (Limited Features)**
|
|
- Strategy browsing only
|
|
- Community section access
|
|
- Call-to-action for registration
|
|
|
|
2. **Free vs. Premium User Paths**
|
|
- Clear indicators of premium features
|
|
- Upgrade prompts at strategic points
|
|
- Value demonstration before paywall
|