Skip to main content

Image Profile

imageProfile is a template in the onboarding to show the user’s profile data based on their onboarding answers (Figma here)

ImageProfile onbaording example
{
"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": []
}

KeyNotes
typeimageProfile
stepIdUnique step ID
titlee.g., Summary of your Well-being Profile in the screenshot
headerTexte.g, Negative effects level
barValueAccept JEXL to determine the bar value based on the user’s answers to specific steps in the onboarding:
user.getOnboardingAnswerValue('tired') + user.getOnboardingAnswerValue('worried') + user.getOnboardingAnswerValue('in_harmony') + user.getOnboardingAnswerValue('overwhelmed_tasks')
barAn object for the bar styles:
"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"
} Note: The gray label color is set in the barLevels object below.
barLevelsAn object that supports low, normal, medium, and high to show the template’s content based on the user’s score.
For example, if the user’s score is high, the template will show the high bar level set in the object:


barLevels example

 "barLevels": {
  "low": {
      "title": "LOW level",
      "subtitle": "Low levels of negative effects mean lowered chance of procrastination, worry, reduced energy and well-being",
      "textColor": "#7A90A3",
      "iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_high-level.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": "#7A90A3",
      "iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_high-level.svg",
      "backgroundColor": "#D9F9EC",
      "label": {
          "text": "Normal",
          "backgroundColor": "#D9F9EC",
          "textColor": "#1AC582",
          "borderColor": "#1AC582"
      }
  },
  "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": "#7A90A3",
      "iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_high-level.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": "#7A90A3",
      "iconUrl": "https://c.thefab.co/web-onboarding/fabulous/icon/ic_high-level.svg",
      "backgroundColor": "#FDE0E7",
      "label": {
          "text": "High",
          "backgroundColor": "#FFDEDE",
          "textColor": "#E14A4E",
          "borderColor": "#EFB7B7"
      }
  }
},


imageLogicAn array of objects that accepts JEXL scripts to determine the image based on the user’s answers.
For example, the logic for showing a female vs. male image based on the gender step should be like this:
"imageLogic": [
    {
        "condition": "user.getOnboardingAnswerValue('gender') == 'male'",
        "imageUrl": "https://c.thefab.co/web-onboarding/mind/alive/img_male_sad_mobile_opt.png"
    },
    {
        "condition": "true",
        "imageUrl": "https://c.thefab.co/web-onboarding/fabulous/img_female_summary_sad.webp"
    }
]
sectionsIt’s an object to fill the section part in the template. An example of a Trigger:


Trigger section logic

{
    "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"
        }
    ]
}



This logic will check the user’s answer on the step whose ID is struggle_more, and based on that answer, the text will be shown on the template Trigger: section (same title added to the config (full example in the JSON file above).
backgroundColorThe step’s background color
imageSectionBackgroundColorThe background of the main image
ctaText, ctaTextColor, and ctaBackgroundColorRelated to the CTA styles in the step.