Personalized Profile Section
Both [Checkout](Onboarding Templates/Checkout) and [PWYW with a Discounted Offer](../PWYW with a Discounted Offer) accept a personalizedProfile section to show the user’s profile based on their answers to the onboarding steps.
Example of a personalizedProfile object
"personalizedProfile": {
"goalTitleColor": "#07CB99",
"currentTitleColor": "#E14A4E",
"goalTitle": "Your Goal",
"currentTitle": "Now",
"backgroundColor": "#F5F7F8",
"backgroundImage": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_arrows.svg",
"imageLogic": [
{
"condition": "user.getOnboardingAnswerValue('gender') == 'male'",
"currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_sad_profile.png",
"goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_happy_profile_opt.webp"
},
{
"condition": "true",
"currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_sad_profile.png",
"goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_happy_profile_opt.webp"
}
],
"sections": [
{
"title": "Energy level:",
"configs": [
{
"condition": "user.getOnboardingAnswerValue('tired') == 28",
"text": "Low",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#F23160",
"goalText": "High",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 1
},
{
"condition": "true",
"text": "Medium",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#FF8900",
"goalText": "High",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 2
}
]
},
{
"title": "Well-being level:",
"configs": [
{
"condition": "(user.getOnboardingAnswerValue('tired') + user.getOnboardingAnswerValue('worried') + user.getOnboardingAnswerValue('in_harmony') + user.getOnboardingAnswerValue('overwhelmed_tasks')) < 60",
"text": "Suboptimal",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#FF8900",
"goalText": "Excellent",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 2
},
{
"condition": "true",
"text": "Week",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#F23160",
"goalText": "Strong",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 1
}
]
},
{
"title": "Self-esteem level:",
"configs": [
{
"condition": "user.getOnboardingAnswerValue('accept_compliments') == 10",
"text": "Medium",
"inactiveColor": "#D2E8DD",
"activeColor": "#00A37F",
"goalText": "Strong",
"goalActiveColor": "#00A37F",
"bar": {
"circleBackgroundColor": "white",
"circleBorderColor": "rgba(0, 0, 0, 0.15)",
"activeWidth": 55,
"goalActiveWidth": 85
}
},
{
"condition": "true",
"text": "Weak",
"inactiveColor": "#D2E8DD",
"activeColor": "#F23160",
"goalText": "Strong",
"goalActiveColor": "#07CB99",
"bar": {
"circleBackgroundColor": "white",
"circleBorderColor": "rgba(0, 0, 0, 0.15)",
"activeWidth": 35,
"goalActiveWidth": 85
}
}
]
}
],
"profile": {
"title": "Your personalized plan is ready!",
"textColor": "#14191D",
"sections": [
{
"title": "Main difficulty:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_brain_green.svg",
"iconBackgroundColor": "#F5F7F8",
"textLogic": [
{
"condition": "user.getOnboardingAnswerValue('fear_failing') > 3",
"text": "Perfectionist"
},
{
"condition": "user.getOnboardingAnswerValue('express_emotions') > 3",
"text": "Suppression"
},
{
"condition": "user.getOnboardingAnswerValue('overwhelmed_tasks') > 10",
"text": "Overwhelm"
},
{
"condition": "user.getOnboardingAnswerValue('make_decision') > 3",
"text": "Indecision"
},
{
"condition": "true",
"text": "Imbalance"
}
]
},
{
"title": "Goal:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_goal_green.svg",
"iconBackgroundColor": "#F5F7F8",
"textLogic": [
{
"condition": "true",
"text": "State of calm"
}
]
}
]
}
}
An example of an onboarding that uses imageProfile and PersonalizedProfile
{
"id": "mind_app_id",
"language": "en",
"appId": "co.thefab.mind",
"seo": {
"title": "Lumiere",
"favicon": "https://c.thefab.co/web-onboarding/mind/mind-favicon.png",
"description": "Manage stress and anxiety through self-care practices and empowering affirmations. Embark on a journey of self-love."
},
"logoWithProgressBar": {
"type": "gradient",
"logoImage": "https://c.thefab.co/web-onboarding/mind/img_logo_black_lumiere.png",
"logoWidth": "115px",
"logoWidthMobile": "115px",
"logoHeight": "26px",
"logoHeightMobile": "26px",
"progressBarBackground": "#FFF",
"progressBarColor": "#00A37F"
},
"steps": [
{
"type": "goalChoiceWithMessageBox",
"stepId": "gender",
"backgroundColor": "#ECEAFF",
"innerBackgroundColor": "#F6F5FF",
"title": "Create Your Personalized Journey to a Better Life",
"subtitle": "Build Healthy Habits and Routines Tailored to You",
"textColor": "#14191D",
"subtitleColor": "#14191D",
"choiceBackgroundColor": "white",
"choiceTextColor": "white",
"choiceTextBackgroundColor": "#6455FE",
"choiceTextSelectedBackgroundColor": "#3425B8",
"choiceTextHoverBackgroundColor": "#796CFF",
"ctaText": "Continue",
"ctaTextColor": "white",
"ctaBackgroundColor": "#3425B8",
"choices": [
{
"name": "Male",
"value": "male",
"imageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_opt.webp"
},
{
"name": "Female",
"value": "female",
"imageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_opt.webp"
}
],
"messageBox": {
"text": "By clicking 'Male' or 'Female' you agree with the <a href='https://www.thefabulous.co/terms.html'>Terms of Use</a> and <a href='https://www.thefabulous.co/terms.html#privacy'>Service Privacy Policy</a>, Subscription Policy and Cookie Policy.",
"textColor": "#14191D",
"linkColor": "#6455FE",
"backgroundColor": "#FFFFFF"
}
},
{
"type": "goalChoice",
"title": "How often do you feel tired or lack energy, even after rest?",
"stepId": "tired",
"subtitle": "",
"textColor": "#343134",
"subtitleTextColor": "gray",
"feedbackType": "radio",
"backgroundColor": "#E7E6E1",
"hoverBackgroundColor": "#D6E0FF",
"choiceBackgroundColor": "#F1F4FE",
"choiceTextColor": "#343134",
"key": "tired",
"hideIcons": true,
"showInnerProgressBar": true,
"innerBackgroundColor": "#F3F2EF",
"choices": [
{
"name": "Often",
"locked": false,
"value": 28,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_family.svg"
},
{
"name": "Sometimes",
"locked": false,
"value": 21,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_external.svg"
},
{
"name": "Rarely",
"locked": false,
"value": 15,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_appearance.svg"
}
]
},
{
"type": "goalChoice",
"title": "How often do you feel worried or overwhelmed?",
"stepId": "worried",
"subtitle": "",
"textColor": "#343134",
"subtitleTextColor": "gray",
"feedbackType": "radio",
"backgroundColor": "#E7E6E1",
"hoverBackgroundColor": "#D6E0FF",
"choiceBackgroundColor": "#F1F4FE",
"choiceTextColor": "#343134",
"key": "worried",
"hideIcons": true,
"showInnerProgressBar": true,
"innerBackgroundColor": "#F3F2EF",
"choices": [
{
"name": "Often",
"locked": false,
"value": 30,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_other.svg"
},
{
"name": "Sometimes",
"locked": false,
"value": 20,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_sleep.svg"
},
{
"name": "Rarely",
"locked": false,
"value": 15,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_job.svg"
}
]
},
{
"type": "goalChoice",
"title": "Have you felt in harmony with yourself and your circle in recent months?",
"stepId": "in_harmony",
"subtitle": "",
"textColor": "#343134",
"subtitleTextColor": "gray",
"feedbackType": "radio",
"backgroundColor": "#E7E6E1",
"hoverBackgroundColor": "#D6E0FF",
"choiceBackgroundColor": "#F1F4FE",
"choiceTextColor": "#343134",
"key": "in_harmony",
"hideIcons": true,
"showInnerProgressBar": true,
"innerBackgroundColor": "#F3F2EF",
"choices": [
{
"name": "Yes",
"locked": false,
"value": 20,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "Moderately",
"locked": false,
"value": 25,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "No",
"locked": false,
"value": 30,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
}
]
},
{
"type": "questionScale",
"stepId": "fear_failing",
"key": "fear_failing",
"title": "I often struggle to pursue my ambitions due to fear of messing up and failing",
"backgroundColor": "#E7E6E1",
"innerBackgroundColor": "#F3F2EF",
"scaleBarColor": "#D8E4E2",
"barIconBackgroundColor": "#FFFFFF",
"selectedBarIconBackgroundColor": "#FFFFFF",
"selectedBarIconBorderColor": "#00A37F",
"textColor": "#343134",
"ctaText": "Continue",
"ctaColor": "#FFF",
"ctaBackgroundColor": "#00A37F",
"ctaHoverBackgroundColor": "#0B866B",
"backButtonColor": "#00A37F",
"backButtonText": "Back",
"backButtonBackgroundColor": "#FFF",
"mode": "phone",
"choices": [
{
"name": "Strongly disagree",
"value": 1,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_disagree.svg"
},
{
"name": "Disagree",
"value": 2,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_disagree.svg"
},
{
"name": "Neutral",
"value": 3,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_neutral.svg"
},
{
"name": "Agree",
"value": 4,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_agree.svg"
},
{
"name": "Strongly agree",
"value": 5,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_agree.svg"
}
]
},
{
"type": "goalChoice",
"title": "Have you ever struggled with accepting compliments because you didn't believe they are true?",
"stepId": "accept_compliments",
"subtitle": "",
"textColor": "#343134",
"subtitleTextColor": "gray",
"feedbackType": "radio",
"backgroundColor": "#E7E6E1",
"hoverBackgroundColor": "#D6E0FF",
"choiceBackgroundColor": "#F1F4FE",
"choiceTextColor": "#343134",
"key": "accept_compliments",
"hideIcons": true,
"showInnerProgressBar": true,
"innerBackgroundColor": "#F3F2EF",
"choices": [
{
"name": "Almost always",
"value": 10,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "Depends",
"locked": false,
"value": 20,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "Not at all",
"value": 60,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "I'm not sure",
"value": 40,
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
}
]
},
{
"type": "questionScale",
"stepId": "express_emotions",
"title": "Do you agree with the following statement: It's difficult for me to express emotions",
"backgroundColor": "#E7E6E1",
"innerBackgroundColor": "#F3F2EF",
"scaleBarColor": "#D8E4E2",
"barIconBackgroundColor": "#FFFFFF",
"selectedBarIconBackgroundColor": "#FFFFFF",
"selectedBarIconBorderColor": "#00A37F",
"textColor": "#343134",
"ctaText": "Continue",
"ctaColor": "#FFF",
"ctaBackgroundColor": "#00A37F",
"ctaHoverBackgroundColor": "#0B866B",
"backButtonColor": "#00A37F",
"backButtonText": "Back",
"backButtonBackgroundColor": "#FFF",
"mode": "phone",
"choices": [
{
"name": "Strongly disagree",
"value": 1,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_disagree.svg"
},
{
"name": "Negative",
"value": 2,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_disagree.svg"
},
{
"name": "Neutral",
"value": 3,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_neutral.svg"
},
{
"name": "Positive",
"value": 4,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_agree.svg"
},
{
"name": "Strongly agree",
"value": 5,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_agree.svg"
}
]
},
{
"type": "goalChoice",
"title": "When was the last time you felt driven and motivated?",
"stepId": "motivated",
"subtitle": "",
"textColor": "#343134",
"subtitleTextColor": "gray",
"feedbackType": "radio",
"backgroundColor": "#E7E6E1",
"hoverBackgroundColor": "#D6E0FF",
"choiceBackgroundColor": "#F1F4FE",
"choiceTextColor": "#343134",
"key": "motivated",
"hideIcons": true,
"showInnerProgressBar": true,
"innerBackgroundColor": "#F3F2EF",
"choices": [
{
"name": "A few weeks ago",
"locked": false,
"value": "A few weeks ago",
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "less than a year ago",
"locked": false,
"value": "Less than a year ago",
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "More than a year ago",
"locked": false,
"value": "More than a year ago",
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
},
{
"name": "Never in my life",
"locked": false,
"value": "Never in my life",
"nameColor": "#343134",
"backgroundColor": "#FFFFFF",
"hoverBackgroundColor": "#D8E4E2"
}
]
},
{
"type": "questionScale",
"stepId": "make_decision",
"title": "I often find it challenging to make a decision",
"backgroundColor": "#E7E6E1",
"innerBackgroundColor": "#F3F2EF",
"scaleBarColor": "#D8E4E2",
"barIconBackgroundColor": "#FFFFFF",
"selectedBarIconBackgroundColor": "#FFFFFF",
"selectedBarIconBorderColor": "#00A37F",
"textColor": "#343134",
"ctaText": "Continue",
"ctaColor": "#FFF",
"ctaBackgroundColor": "#00A37F",
"ctaHoverBackgroundColor": "#0B866B",
"backButtonColor": "#00A37F",
"backButtonText": "Back",
"backButtonBackgroundColor": "#FFF",
"mode": "phone",
"key": "make_decision",
"choices": [
{
"name": "Strongly disagree",
"value": 1,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_disagree.svg"
},
{
"name": "Negative",
"value": 2,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_disagree.svg"
},
{
"name": "Neutral",
"value": 3,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_neutral.svg"
},
{
"name": "Positive",
"value": 4,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_agree.svg"
},
{
"name": "Strongly agree",
"value": 5,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_agree.svg"
}
]
},
{
"type": "goalMultiChoice",
"stepId": "struggle_more",
"key": "struggle_more",
"title": "Have any of the following caused you to struggle more than before?",
"subtitle": "Choose all that apply",
"backgroundColor": "#E7E6E1",
"innerBackgroundColor": "#F3F2EF",
"ctaBackgroundColor": "#00A37F",
"ctaColor": "#fff",
"textColor": "#343134",
"ctaText": "Continue",
"choiceBackgroundColor": "#FFFFFF",
"choiceTextColor": "#343134",
"hoverBackgroundColor": "#D8E4E2",
"hoverTextColor": "#343134",
"subtitleColor": "#777777",
"selectedChoiceBackgroundColor": "#D8E4E2",
"selectedChoiceTextColor": "#343134",
"checkboxBackgroundColor": "#F3F2EF",
"selectedCheckboxBackgroundColor": "#00A37F",
"selectMode": "single",
"bottomButtonTextColor": "#FFF",
"bottomViewColor": "transparent",
"bottomButtonColor": "#00A37F",
"hideProgressBar": true,
"choices": [
{
"name": "Family or relationship",
"value": "family",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_family.svg"
},
{
"name": "External circumstances",
"value": "circumstances",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_external.svg"
},
{
"name": "My appearance",
"value": "appearance",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_appearance.svg"
},
{
"name": "Sleep issues",
"value": "sleep",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_sleep.svg"
},
{
"name": "Job-related stress",
"value": "stress",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_job.svg"
},
{
"name": "Other",
"value": "other",
"iconUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_other.svg"
}
]
},
{
"type": "questionScale",
"stepId": "overwhelmed_tasks",
"title": "I often feel overwhelmed by the amount of tasks I have to do",
"backgroundColor": "#E7E6E1",
"innerBackgroundColor": "#F3F2EF",
"scaleBarColor": "#D8E4E2",
"barIconBackgroundColor": "#FFFFFF",
"selectedBarIconBackgroundColor": "#FFFFFF",
"selectedBarIconBorderColor": "#00A37F",
"textColor": "#343134",
"ctaText": "Continue",
"ctaColor": "#FFF",
"ctaBackgroundColor": "#00A37F",
"ctaHoverBackgroundColor": "#0B866B",
"backButtonColor": "#00A37F",
"backButtonText": "Back",
"backButtonBackgroundColor": "#FFF",
"mode": "phone",
"choices": [
{
"name": "Strongly disagree",
"value": 10,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_disagree.svg"
},
{
"name": "Negative",
"value": 11,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_disagree.svg"
},
{
"name": "Neutral",
"value": 10,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_neutral.svg"
},
{
"name": "Positive",
"value": 11,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_agree.svg"
},
{
"name": "Strongly agree",
"value": 10,
"imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/ic_strongly_agree.svg"
}
]
},
{
"type": "imageProfile",
"stepId": "image_profile",
"title": "Summary of your Well-being Profile",
"headerText": "Negative effects level",
"imageSectionBackgroundColor": "white",
"ctaText": "Continue",
"ctaTextColor": "#FFFFFF",
"ctaBackgroundColor": "#3425B8",
"backgroundColor": "#F6F5FF",
"textColor": "#14191D",
"barValue": "user.getOnboardingAnswerValue('tired') + user.getOnboardingAnswerValue('worried') + user.getOnboardingAnswerValue('in_harmony') + user.getOnboardingAnswerValue('overwhelmed_tasks')",
"bar": {
"backgroundColor": "linear-gradient(90deg, #78D3FB 0%, #9CF7A8 25.34%, #F2E87D 50%, #F1A368 75%, #F05E52 100%)",
"borderColor": "#F3F2EF",
"separatorColor": "#F3F2EF",
"circleBorderColor": "#D5D4D0",
"circleBackgroundColor": "white",
"circleBoxShadow": "0px 0.35px 1.95px 0px #00000026"
},
"barLevels": {
"low": {
"title": "LOW level",
"subtitle": "Low levels of negative effects mean lowered chance of procrastination, worry, reduced energy and well-being",
"textColor": "#14191D",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_warning_low.svg",
"backgroundColor": "#D4FBFF",
"label": {
"text": "Low",
"backgroundColor": "#D4FBFF",
"textColor": "#49B6D9",
"borderColor": "#8AD8F1"
}
},
"normal": {
"title": "NORMAL level",
"subtitle": "Even normal levels of negative effects may contribute to procrastination, worry, reduced energy and well-being",
"textColor": "#14191D",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_warning_normal.svg",
"backgroundColor": "#D9F9EC",
"label": {
"text": "Normal",
"backgroundColor": "#D9F9EC",
"textColor": "#1AC582",
"borderColor": "#9AEDCB"
}
},
"medium": {
"title": "MEDIUM level",
"subtitle": "Medium levels of negative effects may contribute to frequent procrastination, heightened worry, reduced energy and a noticeable decline in overall well-being",
"textColor": "#14191D",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_warning_medium.svg",
"backgroundColor": "#FFE7CC",
"label": {
"text": "Medium",
"backgroundColor": "#FFE7CC",
"textColor": "#FF8900",
"borderColor": "#FFCC91"
}
},
"high": {
"title": "HIGH level",
"subtitle": "High levels of negative effects can lead to constant procrastination, increased worrying, reduced energy and well-being",
"textColor": "#14191D",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_high-level.svg",
"backgroundColor": "#FDE0E7",
"label": {
"text": "High",
"backgroundColor": "#FFDEDE",
"textColor": "#E14A4E",
"borderColor": "#EFB7B7"
}
}
},
"sections": [
{
"title": "Main difficulty:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_dislike.svg",
"backgroundColor": "white",
"textLogic": [
{
"condition": "user.getOnboardingAnswerValue('tired') > (user.getOnboardingAnswerValue('worried') + 7)",
"text": "Low energy"
},
{
"condition": "true",
"text": "Worry"
}
]
},
{
"title": "Challenging period:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_calender.svg",
"backgroundColor": "white",
"textLogic": [
{
"condition": "user.getOnboardingAnswer('motivated') == 'Less than a year ago'",
"text": "Few months"
},
{
"condition": "user.getOnboardingAnswer('motivated') == 'More than a year ago'",
"text": "Few years"
},
{
"condition": "user.getOnboardingAnswer('motivated') == 'Never in my life'",
"text": "Whole life"
},
{
"condition": "true",
"text": "Few weeks"
}
]
},
{
"title": "Trigger:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_trigger.svg",
"backgroundColor": "white",
"textLogic": [
{
"condition": "user.getOnboardingAnswerValue('struggle_more') == 'family'",
"text": "Family or relationship"
},
{
"condition": "user.getOnboardingAnswerValue('struggle_more') == 'circumstances'",
"text": "External circumstances"
},
{
"condition": "user.getOnboardingAnswerValue('struggle_more') == 'appearance'",
"text": "My appearance"
},
{
"condition": "user.getOnboardingAnswerValue('struggle_more') == 'sleep'",
"text": "Sleep issues"
},
{
"condition": "user.getOnboardingAnswerValue('struggle_more') == 'stress'",
"text": "Job-related stress"
},
{
"condition": "true",
"text": "General triggers"
}
]
},
{
"title": "Energy level:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_low.svg",
"backgroundColor": "white",
"textLogic": [
{
"condition": "user.getOnboardingAnswerValue('tired') == 28",
"text": "Low"
},
{
"condition": "user.getOnboardingAnswerValue('tired') == 21",
"text": "Somewhat low"
},
{
"condition": "true",
"text": "Normal"
}
]
}
],
"imageLogic": [
{
"condition": "user.getOnboardingAnswerValue('gender') == 'male'",
"imageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_summary_sad.webp"
},
{
"condition": "true",
"imageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_summary_sad.webp"
}
]
},
{
"type": "pwywWithDiscountedOffer",
"stepId": "pwyw",
"backgroundColor": "white",
"logoUrl": "https://c.thefab.co/web-onboarding/mind/img_logo_black_lumiere.png",
"profileIconColor": "#7A90A3",
"textColor": "#14191D",
"subtitleColor": "#4F6171",
"paragraphColor": "#7A90A3",
"ctaTextColor": "white",
"ctaBackgroundColor": "#00A37F",
"ctaHoverBackgroundColor": "#0B866B",
"textWithArrowColor": "#00A37F",
"desktopBackground": "https://c.thefab.co/web-onboarding/mind/img_background_human_coaching_desktop.png",
"tabletBackground": "https://c.thefab.co/web-onboarding/mind/img_background_human_coaching_tablet.png",
"mobileBackground": "https://c.thefab.co/web-onboarding/mind/img_background_human_coaching_mobile.png",
"discountOfferPlanCode": "mind-subs-bimonthly-discount-19",
"overlayColor": "#0006",
"discount": 25,
"choices": [
{
"planCode": "mind-subs-bimonthly-normal-intro-1-thirtynine",
"textColor": "#343134",
"backgroundColor": "#F3F2EF",
"borderColor": "#00A37F"
},
{
"planCode": "mind-subs-bimonthly-normal-intro-11-thirtynine",
"textColor": "#343134",
"backgroundColor": "#F3F2EF",
"borderColor": "#00A37F"
},
{
"planCode": "mind-subs-bimonthly-normal-intro-16-thirtynine",
"textColor": "#00A37F",
"backgroundColor": "#E8F3F1",
"borderColor": "#00A37F",
"titleColor": "white",
"titleBackgroundColor": "#00A37F",
"mostPopular": true
}
],
"popupForm": {
"backgroundColor": "white",
"secondaryColor": "#7A90A3",
"closeIconColor": "#7A90A3",
"timer": {
"type": "rounded",
"textColor": "#343134",
"backgroundColor": "white",
"buttonBackgroundColor": "#00A37F",
"buttonColor": "white",
"boxShadow": "0px 0px 20px 0px rgba(123, 123, 123, 0.15)",
"ctaText": "Get my Plan"
},
"form": {
"placeholderColor": "#7A90A3",
"inputColor": "#14191d",
"inputBorderColor": "#E8EAED",
"ctaBackgroundColor": "linear-gradient(180deg, #00BAAF, #00BA82)",
"ctaTextColor": "white",
"noCommitmentsTextColor": "#4F6171",
"ctaText": "Start Membership"
},
"planDetails": {
"titleColor": "#4F6171",
"titleBackgroundColor": "#F1F3F5",
"textColor": "#14191D",
"subtitleColor": "#4F6171",
"hrColor": "#E8EAED",
"discountColor": "white",
"discountBackgroundColor": "linear-gradient(270deg,#88d16e,#07cb99)",
"cycleColor": "#A6B5C2"
},
"tabs": {
"activeTextColor": "white",
"textColor": "#4f6171",
"activeBackgroundColor": "#130a7e",
"backgroundColor": "#f1f3f5"
},
"terms": {
"type": "with-plan-details",
"linkColor": "#2C5FFF",
"backgroundColor": "#F5F7F8",
"textColor": "#4F6171"
},
"personalizedProfile": {
"goalTitleColor": "#07CB99",
"currentTitleColor": "#E14A4E",
"goalTitle": "Your Goal",
"currentTitle": "Now",
"backgroundColor": "#F5F7F8",
"backgroundImage": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_arrows.svg",
"imageLogic": [
{
"condition": "user.getOnboardingAnswerValue('gender') == 'male'",
"currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_sad_profile.png",
"goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_happy_profile_opt.webp"
},
{
"condition": "true",
"currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_sad_profile.png",
"goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_happy_profile_opt.webp"
}
],
"sections": [
{
"title": "Energy level:",
"configs": [
{
"condition": "user.getOnboardingAnswerValue('tired') == 28",
"text": "Low",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#F23160",
"goalText": "High",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 1
},
{
"condition": "true",
"text": "Medium",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#FF8900",
"goalText": "High",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 2
}
]
},
{
"title": "Well-being level:",
"configs": [
{
"condition": "(user.getOnboardingAnswerValue('tired') + user.getOnboardingAnswerValue('worried') + user.getOnboardingAnswerValue('in_harmony') + user.getOnboardingAnswerValue('overwhelmed_tasks')) < 60",
"text": "Suboptimal",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#FF8900",
"goalText": "Excellent",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 2
},
{
"condition": "true",
"text": "Week",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#F23160",
"goalText": "Strong",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 1
}
]
},
{
"title": "Self-esteem level:",
"configs": [
{
"condition": "user.getOnboardingAnswerValue('accept_compliments') == 10",
"text": "Medium",
"inactiveColor": "#D2E8DD",
"activeColor": "#00A37F",
"goalText": "Strong",
"goalActiveColor": "#00A37F",
"bar": {
"circleBackgroundColor": "white",
"circleBorderColor": "rgba(0, 0, 0, 0.15)",
"activeWidth": 55,
"goalActiveWidth": 85
}
},
{
"condition": "true",
"text": "Weak",
"inactiveColor": "#D2E8DD",
"activeColor": "#F23160",
"goalText": "Strong",
"goalActiveColor": "#07CB99",
"bar": {
"circleBackgroundColor": "white",
"circleBorderColor": "rgba(0, 0, 0, 0.15)",
"activeWidth": 35,
"goalActiveWidth": 85
}
}
]
}
],
"profile": {
"title": "Your personalized plan is ready!",
"textColor": "#14191D",
"sections": [
{
"title": "Main difficulty:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_brain_green.svg",
"iconBackgroundColor": "#F5F7F8",
"textLogic": [
{
"condition": "user.getOnboardingAnswerValue('fear_failing') > 3",
"text": "Perfectionist"
},
{
"condition": "user.getOnboardingAnswerValue('express_emotions') > 3",
"text": "Suppression"
},
{
"condition": "user.getOnboardingAnswerValue('overwhelmed_tasks') > 10",
"text": "Overwhelm"
},
{
"condition": "user.getOnboardingAnswerValue('make_decision') > 3",
"text": "Indecision"
},
{
"condition": "true",
"text": "Imbalance"
}
]
},
{
"title": "Goal:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_goal_green.svg",
"iconBackgroundColor": "#F5F7F8",
"textLogic": [
{
"condition": "true",
"text": "State of calm"
}
]
}
]
}
}
},
"discountOffer": {
"desktopBackground": "https://c.thefab.co/web-onboarding/fabulous/pwyw_popup_discount_bg_desktop.webp",
"tabletBackground": "https://c.thefab.co/web-onboarding/fabulous/pwyw_popup_discount_tablet.webp",
"mobileBackground": "https://c.thefab.co/web-onboarding/fabulous/pwyw_popup_discount_bg_mobile.webp",
"ctaTextColor": "white",
"ctaBackgroundColor": "#00CC9F",
"ctaHoverBackgroundColor": "#00A87F",
"textColor": "white",
"titleColor": "#FF8762",
"closeIconColor": "white",
"discount": 50,
"planDetails": {
"borderColor": "#FF8762",
"backgroundColor": "white",
"primaryColor": "#343D45",
"secondaryColor": "#7A90A3"
}
}
},
{
"type": "checkout",
"stepId": "discount-offer",
"backgroundColor": "white",
"planCode": "mind-subs-bimonthly-discount-19",
"textColor": "#14191D",
"secondaryColor": "#7A90A3",
"discount": 50,
"timer": {
"type": "rounded",
"textColor": "#343134",
"backgroundColor": "white",
"buttonBackgroundColor": "#00A37F",
"buttonColor": "white",
"boxShadow": "0px 0px 20px 0px rgba(123, 123, 123, 0.15)",
"ctaText": "Get my Plan"
},
"form": {
"placeholderColor": "#7A90A3",
"inputColor": "#14191d",
"inputBorderColor": "#E8EAED",
"ctaBackgroundColor": "linear-gradient(180deg, #00BAAF, #00BA82)",
"ctaTextColor": "white",
"noCommitmentsTextColor": "#4F6171"
},
"planDetails": {
"titleColor": "#4F6171",
"titleBackgroundColor": "#F1F3F5",
"textColor": "#14191D",
"subtitleColor": "#4F6171",
"hrColor": "#E8EAED",
"discountColor": "white",
"discountBackgroundColor": "linear-gradient(270deg,#88d16e,#07cb99)",
"cycleColor": "#A6B5C2"
},
"tabs": {
"activeTextColor": "white",
"textColor": "#4f6171",
"activeBackgroundColor": "#130a7e",
"backgroundColor": "#f1f3f5"
},
"terms": {
"type": "with-plan-details",
"linkColor": "#2C5FFF",
"backgroundColor": "#F5F7F8",
"textColor": "#4F6171"
},
"personalizedProfile": {
"goalTitleColor": "#07CB99",
"currentTitleColor": "#E14A4E",
"goalTitle": "Your Goal",
"currentTitle": "Now",
"backgroundColor": "#F5F7F8",
"backgroundImage": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_arrows.svg",
"imageLogic": [
{
"condition": "user.getOnboardingAnswerValue('gender') == 'male'",
"currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_sad_profile.png",
"goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_happy_profile_opt.webp"
},
{
"condition": "true",
"currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_sad_profile.png",
"goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_happy_profile_opt.webp"
}
],
"sections": [
{
"title": "Energy level:",
"configs": [
{
"condition": "user.getOnboardingAnswerValue('tired') == 28",
"text": "Low",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#F23160",
"goalText": "High",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 1
},
{
"condition": "true",
"text": "Medium",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#FF8900",
"goalText": "High",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 2
}
]
},
{
"title": "Well-being level:",
"configs": [
{
"condition": "(user.getOnboardingAnswerValue('tired') + user.getOnboardingAnswerValue('worried') + user.getOnboardingAnswerValue('in_harmony') + user.getOnboardingAnswerValue('overwhelmed_tasks')) < 60",
"text": "Suboptimal",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#FF8900",
"goalText": "Excellent",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 2
},
{
"condition": "true",
"text": "Week",
"borderColor": "#E8EAED",
"inactiveColor": "#ECEAFF",
"activeColor": "#F23160",
"goalText": "Strong",
"goalActiveColor": "#07CB99",
"activeBarsNumber": 1
}
]
},
{
"title": "Self-esteem level:",
"configs": [
{
"condition": "user.getOnboardingAnswerValue('accept_compliments') == 10",
"text": "Medium",
"inactiveColor": "#D2E8DD",
"activeColor": "#00A37F",
"goalText": "Strong",
"goalActiveColor": "#00A37F",
"bar": {
"circleBackgroundColor": "white",
"circleBorderColor": "rgba(0, 0, 0, 0.15)",
"activeWidth": 55,
"goalActiveWidth": 85
}
},
{
"condition": "true",
"text": "Weak",
"inactiveColor": "#D2E8DD",
"activeColor": "#F23160",
"goalText": "Strong",
"goalActiveColor": "#07CB99",
"bar": {
"circleBackgroundColor": "white",
"circleBorderColor": "rgba(0, 0, 0, 0.15)",
"activeWidth": 35,
"goalActiveWidth": 85
}
}
]
}
],
"profile": {
"title": "Your personalized plan is ready!",
"textColor": "#14191D",
"sections": [
{
"title": "Main difficulty:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_brain_green.svg",
"iconBackgroundColor": "#F5F7F8",
"textLogic": [
{
"condition": "user.getOnboardingAnswerValue('fear_failing') > 3",
"text": "Perfectionist"
},
{
"condition": "user.getOnboardingAnswerValue('express_emotions') > 3",
"text": "Suppression"
},
{
"condition": "user.getOnboardingAnswerValue('overwhelmed_tasks') > 10",
"text": "Overwhelm"
},
{
"condition": "user.getOnboardingAnswerValue('make_decision') > 3",
"text": "Indecision"
},
{
"condition": "true",
"text": "Imbalance"
}
]
},
{
"title": "Goal:",
"iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_goal_green.svg",
"iconBackgroundColor": "#F5F7F8",
"textLogic": [
{
"condition": "true",
"text": "State of calm"
}
]
}
]
}
}
}
],
"logic": []
}
| Key | Notes |
|---|---|
goalTitle | e.g, “Your Goal “ |
goalTitleColor | The text color of the goal label |
currentTitle | e.g, “Now” |
currentTitleColor | The text color of the now label |
backgroundColor | The data section background |
backgroundImage | The arrows in the screenshot |
imageLogic | The logic that we should use to show the user’s image. Example: "imageLogic": [ { "condition": "user.getOnboardingAnswerValue('gender') == 'male'", "currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_sad_profile.png", "goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_male_happy_profile_opt.webp" }, { "condition": "true", "currentImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_sad_profile.png", "goalImageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_happy_profile_opt.webp" } ] |
sections | An array of the sections to show: Energy level or Well-being level, for example. The object structure: [{ "title": "", "configs":[{ "condtion": "", "text": "", "borderColor": "", "activeColor": "", "goalText": "", "goalActiveColor": "", "activeBarsNumber": "", "bar": { "circleBackgroundColor": "", "circleBorderColor": "", "activeWidth": "", "goalActiveWidth":"" } }] }] Each section has a title and configs for the styles of each section. The condition in each config accepts JEXL to determine which config to choose: "condition": "user.getOnboardingAnswerValue('worried') == 20", bar can be used to show a bar sider design: Otherwise, the design will show a dashed icon:  The number of active dashes is determined by activeBarsNumber.  And the width of bar can be determined by activeWidth (the width of the current section) and goalActiveWidth (for the goal section) Example"sections": [ { "title": "Energy level:", "configs": [ { "condition": "user.getOnboardingAnswerValue('tired') == 20", "text": "Medium", "borderColor": "#E8EAED", "inactiveColor": "#D2E8DD", "activeColor": "#FF8900", "goalText": "High", "goalActiveColor": "#00A37F", "activeBarsNumber": 2 }, { "condition": "true", "text": "Low", "borderColor": "#E8EAED", "inactiveColor": "#D2E8DD", "activeColor": "#00A37F", "goalText": "High", "goalActiveColor": "#00A37F", "activeBarsNumber": 1 } ] }, { "title": "Well-being level:", "configs": [ { "condition": "user.getOnboardingAnswerValue('worried') == 20", "text": "Weak", "borderColor": "#E8EAED", "inactiveColor": "#ECEAFF", "activeColor": "#F23160", "goalText": "Strong", "goalActiveColor": "#00A37F", "activeBarsNumber": 2 }, { "condition": "true", "text": "Medium", "borderColor": "#E8EAED", "inactiveColor": "#D2E8DD", "activeColor": "#FF8900", "goalText": "Strong", "goalActiveColor": "#00A37F", "activeBarsNumber": 2 } ] }, { "title": "Self-esteem level:", "configs": [ { "condition": "user.getOnboardingAnswerValue('in_harmony') == 10", "text": "Medium", "inactiveColor": "#D2E8DD", "activeColor": "#00A37F", "goalText": "Strong", "goalActiveColor": "#00A37F", "bar": { "circleBackgroundColor": "white", "circleBorderColor": "rgba(0, 0, 0, 0.15)", "activeWith": 55 } }, { "condition": "true", "text": "Weak", "inactiveColor": "#D2E8DD", "activeColor": "#F23160", "goalText": "Strong", "goalActiveColor": "#07CB99", "bar": { "circleBackgroundColor": "white", "circleBorderColor": "rgba(0, 0, 0, 0.15)", "activeWith": 35 } } ] } ],Each config also supports an optional goalActiveBarsNumber, by default it’s 3 full bars, but it can be changed to 0, 1, 2. |
profile | profile is used to show the profile section at the bottom:  Accepts title, textColor, and sections |
profile.sections | sections is where we add the configs of each section. It accepts: "title": "", "iconUrl": "", "iconBackgroundColor":"", "textLogic": [{ "condition": "jexl-string", "text": "" }] Example"profile": { "title": "Your personalized plan is ready!", "textColor": "#14191D", "sections": [ { "title": "Main difficulty:", "iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_brain_green.svg", "iconBackgroundColor": "#F5F7F8", "textLogic": [ { "condition": "user.getOnboardingAnswerValue('tired') == 20", "text": "Energy level" }, { "condition": "user.getOnboardingAnswerValue('worried') == 20", "text": "Well-being level" }, { "condition": "true", "text": "Perfectionist" } ] }, { "title": "Goal:", "iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_goal_green.svg", "iconBackgroundColor": "#F5F7F8", "textLogic": [ { "condition": "true", "text": "State of calm" } ] } ] } |