https://www.theworkdocs.com/_next/static/chunks/5737.3585d1f460841d9f.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5737],{85737:function(e,i,s){"use strict";s.r(i),s.d(i,{default:function(){return E}});var t=s(57437);s(98072);var a=s(2265),l=s(69076),n=s(86608),r=s(85254),o=s(7497),d=s(17750),c=s(4312),x=s(57115),h=s(59419),p=s(25624);s(71140);var b=s(9538),u=s(70132),m=s(65251),j=e=>{let{notes:i,selectedNoteId:s,onSelect:a}=e,n=(0,p.a)("(max-width: 768px)");return(0,t.jsxs)(d.Box,{w:{base:120,sm:210,md:260},bg:"var(--site-surface)",className:"border-r flex flex-col",style:{minWidth:110,display:n?"none":"block",borderTopLeftRadius:16,borderBottomLeftRadius:16},children:[(0,t.jsxs)(l.Flex,{align:"center",justify:"space-between",px:"md",py:18,className:"border-b",children:[(0,t.jsx)("div",{className:"font-bold text-base truncate",children:"Your Documents"}),(0,t.jsx)(o.A,{variant:"subtle",color:"indigo",size:"sm","aria-label":"Add document (preview only)","aria-disabled":"true",children:(0,t.jsx)(m.Z,{size:18})})]}),(0,t.jsx)(b.x,{h:"calc(100vh - 120px)",children:(0,t.jsx)(u.Stack,{gap:0,mt:4,children:i.map(e=>(0,t.jsxs)(l.Flex,{align:"center",px:"md",py:10,className:"cursor-pointer hover:bg-indigo-50 transition ".concat(s===e.id?"bg-[var(--site-accent-tint)]":""),children:[(0,t.jsx)("button",{type:"button","aria-pressed":s===e.id,onClick:()=>a(e.id),className:"text-sm text-left truncate flex-1 min-w-0 rounded-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--site-accent)] ".concat(s===e.id?"font-bold":"font-normal"),children:e.title}),(0,t.jsx)(o.A,{variant:"subtle",size:"sm","aria-label":"Options for ".concat(e.title," (preview only)"),"aria-disabled":"true",children:(0,t.jsx)(h.Z,{size:16})})]},e.id))})})]})};s(86447);var g=s(96293);s(69008);var v=s(58565),f=s(9550),w=s(75913),z=s(12807),y=s(36184),N=s(94905),A=s(76342),T=s(86604);let F=[{icon:(0,t.jsx)(f.Z,{size:22}),label:"Header 1"},{icon:(0,t.jsx)(w.Z,{size:22}),label:"Header 2"},{icon:(0,t.jsx)(z.Z,{size:22}),label:"Header 3"},{icon:(0,t.jsx)(y.Z,{size:22}),label:"Bulleted List"},{icon:(0,t.jsx)(N.Z,{size:22}),label:"Numbered List"},{icon:(0,t.jsx)(A.Z,{size:22}),label:"Checklist"},{icon:(0,t.jsx)(T.Z,{size:22}),label:"Table"}];var Z=()=>(0,t.jsxs)(d.Box,{className:"site-surface rounded-xl shadow p-2 flex flex-col gap-2 w-[290px] border",children:[(0,t.jsx)(v.I,{placeholder:"Filter","aria-label":"Filter example block types",size:"xs",className:"mb-1"}),(0,t.jsx)(u.Stack,{gap:2,children:F.map(e=>(0,t.jsxs)(d.Box,{className:"flex items-center gap-2 px-1 py-1 rounded hover:bg-gray-100 cursor-pointer",children:[e.icon,(0,t.jsx)(g.Text,{size:"sm",children:e.label})]},e.label))})]});s(39429);var k=s(42554),B=s(48992),S=s(84526),L=s(53739),C=s(71213),P=s(52707),I=s(84571),R=e=>{let{text:i}=e;return(0,t.jsxs)("span",{className:"relative",children:[(0,t.jsx)("span",{className:"text-base bg-yellow-300 text-[#302a14]",children:i}),(0,t.jsx)(l.Flex,{component:"span",p:2,w:280,bg:"var(--site-surface)",className:"rounded-md border absolute bottom-[-42px] drop-shadow-md",children:(0,t.jsxs)(l.Flex,{component:"span",justify:"center",align:"center",w:"100%",gap:2,children:[(0,t.jsx)(k.u,{label:"Text options",className:"border",position:"top",withArrow:!0,children:(0,t.jsxs)(o.A,{variant:"subtle",size:"lg","aria-label":"Text options (preview only)","aria-disabled":"true",children:[(0,t.jsx)("span",{className:"font-bold",children:"T"}),(0,t.jsx)(B.Z,{size:16})]})}),(0,t.jsx)(k.u,{label:"Bold",position:"top",withArrow:!0,children:(0,t.jsx)(o.A,{variant:"subtle",size:"lg","aria-label":"Bold (preview only)","aria-disabled":"true",children:(0,t.jsx)(S.Z,{size:16})})}),(0,t.jsx)(k.u,{label:"Italic",position:"top",withArrow:!0,children:(0,t.jsx)(o.A,{variant:"subtle",size:"lg","aria-label":"Italic (preview only)","aria-disabled":"true",children:(0,t.jsx)(L.Z,{size:16})})}),(0,t.jsx)(k.u,{label:"Code",position:"top",withArrow:!0,children:(0,t.jsx)(o.A,{variant:"subtle",size:"lg","aria-label":"Code (preview only)","aria-disabled":"true",children:(0,t.jsx)(C.Z,{size:16})})}),(0,t.jsx)(k.u,{label:"Link",position:"top",withArrow:!0,children:(0,t.jsx)(o.A,{variant:"subtle",size:"lg","aria-label":"Link (preview only)","aria-disabled":"true",children:(0,t.jsx)(P.Z,{size:16})})}),(0,t.jsx)(k.u,{label:"Language",position:"top",withArrow:!0,children:(0,t.jsx)(o.A,{variant:"subtle",size:"lg","aria-label":"Language (preview only)","aria-disabled":"true",children:(0,t.jsx)(I.Z,{size:16})})}),(0,t.jsx)(k.u,{label:"More",position:"top",withArrow:!0,children:(0,t.jsx)(o.A,{variant:"subtle",size:"lg","aria-label":"More text options (preview only)","aria-disabled":"true",children:(0,t.jsx)(B.Z,{size:16})})})]})})]})},W=()=>(0,t.jsx)(l.Flex,{direction:"column",w:"100%",flex:1,h:"100%",children:(0,t.jsx)(l.Flex,{direction:{base:"column",md:"row"},gap:24,px:"md",style:{position:"relative",height:"100%"},children:(0,t.jsxs)(d.Box,{flex:1,style:{minWidth:0},children:[(0,t.jsx)("div",{className:"text-[18px] md:text-[36px] font-bold mb-4",children:"Personalization and A/B Testing"}

1),(0,t.jsxs)(g.Text,{mb:16,children:[(0,t.jsx)(R,{text:"Personalization"})," and A/B testing are methods used to ensure that design decisions align with user preferences and improve engagement."]}),(0,t.jsxs)(g.Text,{mb:16,children:[(0,t.jsx)("b",{children:"Personalization"})," involves tailoring the user experience based on individual user data, such as preferences and behavior. This makes applications more relevant to each user by providing content and features that resonate with them specifically, which can lead to higher user satisfaction and engagement."]}),(0,t.jsxs)("div",{className:"hidden md:block",children:[(0,t.jsxs)(g.Text,{mb:16,visibleFrom:"lg",children:[(0,t.jsx)("b",{children:"A/B Testing"})," (also known as split testing) involves comparing two or more versions of a web page or feature to determine which one performs better in terms of specific goals, such as click-through rates or sales. This method provides insights into what design choices work best for the audience."]}),(0,t.jsx)(g.Text,{mb:16,visibleFrom:"lg",children:"By implementing personalization and A/B testing, developers can create more engaging and successful applications. Personalization ensures users see content that matters to them, while A/B testing helps optimize design choices based on measurable data, leading to improved user experience and application performance."}),(0,t.jsxs)(l.Flex,{w:"fit-content",className:"relative hidden md:block",children:["Adding new text with ease with The Work Docs Note Tool /",(0,t.jsx)(l.Flex,{visibleFrom:"lg",className:"absolute right-[-300px] top-0",children:(0,t.jsx)(Z,{})})]}),(0,t.jsx)(g.Text,{fz:32,visibleFrom:"lg",fw:700,mt:32,mb:8,children:"Personalization"}

1),(0,t.jsx)(g.Text,{mb:16,children:"Personalization refers to the practice of creating tailored experience for individual users or groups based on their preferences, behavior or other identifiable attributes."}),(0,t.jsx)(g.Text,{mb:16,visibleFrom:"lg",children:"To implement personalization we have to identify the areas of the application where personalization can be useful. That include personalizing the content shown to user based on their preferences, their device and location, or even based on their behavior"})]})]})})}),_=s(26042),D=s.n(_);let H=[{id:1,title:"Personalization and A/B Testing"},{id:2,title:"Scalable Application"},{id:3,title:"Building large scale..."},{id:4,title:"Generative AI with..."},{id:5,title:"Self-Discipline in..."}];var E=()=>{let[e,i]=(0,a.useState)(H[0]),[s,b]=(0,a.useState)(e.title),[u,m]=(0,a.useState)(""),g=(0,p.a)("(max-width: 768px)");return(0,t.jsxs)(l.Flex,{className:D().demoFrame,children:[(0,t.jsx)(j,{notes:H,selectedNoteId:e.id,onSelect:e=>{let s=H.find(i=>i.id===e);s&&(i(s),b(s.title),m(""))}}),(0,t.jsxs)(l.Flex,{direction:"column",w:"100%",flex:1,h:"100%",className:D().noteBody,style:{borderRadius:16},children:[(0,t.jsxs)(l.Flex,{align:"center",justify:"space-between",px:28,py:18,className:"border-b site-surface",style:{display:g?"none":"flex",borderTopRightRadius:16},children:[(0,t.jsxs)(l.Flex,{align:"center",gap:8,children:[(0,t.jsx)(c.Z,{size:18}),(0,t.jsx)("span",{className:"text-sm font-semibold site-text",children:e.title})]}),(0,t.jsxs)(n.Z,{gap:8,children:[(0,t.jsx)(r.Button,{size:"xs",variant:"outline",leftSection:(0,t.jsx)(x.Z,{size:14}),"aria-label":"Share note (preview only)","aria-disabled":"true",children:"Share"}),(0,t.jsx)(o.A,{size:"sm",variant:"subtle","aria-label":"Note options (preview only)","aria-disabled":"true",children:(0,t.jsx)(h.Z,{size:18})})]})]}),(0,t.jsx)(l.Flex,{direction:{base:"column",md:"row"},className:D().noteContent,gap:24,px:"md",py:20,style:{position:"relative",height:"100%"},children:(0,t.jsx)(d.Box,{flex:1,style:{minWidth:0},children:(0,t.jsx)(W,{})})})]})]})}},69008:function(){},71140:function(){},39429:function(){},98072:function(){},86447:function(){}}]);