[{"data":1,"prerenderedAt":449},["ShallowReactive",2],{"casestudy-how_to_build_an_atomic_fluid_design_system":3},{"title":4,"slug":5,"body":6,"project":336},"How to build an atomic fluid design system?","how_to_build_an_atomic_fluid_design_system",{"data":7,"body":8},{},{"type":9,"children":10},"root",[11,19,24,28,35,42,47,52,55,61,67,72,77,258,265,271,276,281,284,290,295,306,316,326],{"type":12,"tag":13,"props":14,"children":15},"element","p",{},[16],{"type":17,"value":18},"text","A design system begins with foundational elements (colour, typography, spacing) and grows into components and interaction patterns. Its purpose is to be a single source of truth for designers and engineers, ensuring consistency, speeding up development, and enabling high-quality iteration.",{"type":12,"tag":13,"props":20,"children":21},{},[22],{"type":17,"value":23},"At eJobs, the system was born out of a digital strategy shift: a full backend and frontend rewrite paired with a redesigned user experience. The goal was a fluid system — one that adapts across platforms, screen sizes, and accessibility needs, minimising the differences between Android, iOS, and responsive web without compromising on quality.",{"type":12,"tag":25,"props":26,"children":27},"hr",{},[],{"type":12,"tag":29,"props":30,"children":32},"h6",{"id":31},"the-challenge",[33],{"type":17,"value":34},"The challenge",{"type":12,"tag":36,"props":37,"children":39},"h1",{"id":38},"where-consistency-meets-complexity",[40],{"type":17,"value":41},"Where consistency meets complexity",{"type":12,"tag":13,"props":43,"children":44},{},[45],{"type":17,"value":46},"Design systems must adapt to constraints, from technology to user needs. Supporting Android, iOS, and a responsive web app simultaneously meant defining clear breakpoints, simplifying platform quirks, and optimising performance for smooth experiences across devices.",{"type":12,"tag":13,"props":48,"children":49},{},[50],{"type":17,"value":51},"With 500k monthly active users spanning all ages and digital literacy levels, accessibility and usability were priorities from day one. The system needed to stay true to the brand while integrating custom illustrations and subtle UI touches that reinforced eJobs' visual identity.",{"type":12,"tag":25,"props":53,"children":54},{},[],{"type":12,"tag":29,"props":56,"children":58},{"id":57},"how",[59],{"type":17,"value":60},"How",{"type":12,"tag":36,"props":62,"children":64},{"id":63},"simplifying-design-with-the-atomic-principle",[65],{"type":17,"value":66},"Simplifying design with the atomic principle",{"type":12,"tag":13,"props":68,"children":69},{},[70],{"type":17,"value":71},"Following the atomic principle, we first defined the fundamentals: grid, colour palette, buttons, input fields, typeface, hierarchy, line widths, and illustrations. From there, we built out components like navigation, states (such as zero and loading), and patterns for layout and animation.",{"type":12,"tag":13,"props":73,"children":74},{},[75],{"type":17,"value":76},"By breaking everything into smaller, manageable parts, we created a modular system that is easy to scale, adapt, and customise. Designer tokens were then handed to the front-end team, who translated them into their own component library; ensuring the visual language carried through consistently into the live product.",{"type":12,"tag":78,"props":79,"children":84},"div",{"className":80,"style":83},[81,82],"mb-20","lg:mb-28","background: linear-gradient(rgba(252, 250, 255, 0) 0%, rgba(252, 250, 255, 1) 5%);",[85],{"type":12,"tag":78,"props":86,"children":94},{"className":87},[88,89,90,91,92,93],"gallery-block","container","mx-auto","p-5","py-20","lg:py-28",[95,97,144,145,182,183,220,221],{"type":17,"value":96},"\n  ",{"type":12,"tag":78,"props":98,"children":102},{"className":99},[100,101],"tile","is-ancestor",[103,105,126,127,143],{"type":17,"value":104},"\n    ",{"type":12,"tag":78,"props":106,"children":110},{"className":107},[100,108,109],"is-6","is-parent",[111,113,125],{"type":17,"value":112},"\n      ",{"type":12,"tag":78,"props":114,"children":118},{"className":115},[100,116,117],"is-child","box",[119,124],{"type":12,"tag":120,"props":121,"children":123},"img",{"src":122},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F1FgVryTsaFP3UEGVOLt8b1\u002F132597234ba917cef60161b8876e269d\u002FeJobsTypograpgy.png",[],{"type":17,"value":104},{"type":17,"value":104},{"type":17,"value":104},{"type":12,"tag":78,"props":128,"children":130},{"className":129},[100,108,109],[131,132,141],{"type":17,"value":104},{"type":12,"tag":78,"props":133,"children":135},{"className":134},[100,116,117],[136,140],{"type":12,"tag":120,"props":137,"children":139},{"src":138},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F3MKtJgj1hCFkrtdAiuyyew\u002Fd7b2dbc3c64592a8f0f486ed2d1abe24\u002FeJobsColor.png",[],{"type":17,"value":104},{"type":17,"value":142},"\n   ",{"type":17,"value":96},{"type":17,"value":96},{"type":12,"tag":78,"props":146,"children":148},{"className":147},[100,101],[149,150,165,166,181],{"type":17,"value":104},{"type":12,"tag":78,"props":151,"children":153},{"className":152},[100,108,109],[154,155,164],{"type":17,"value":112},{"type":12,"tag":78,"props":156,"children":158},{"className":157},[100,116,117],[159,163],{"type":12,"tag":120,"props":160,"children":162},{"src":161},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F1rzpSBIpLvoeG8dsx3PJtP\u002Fc16854639bb6eba2b8c86bb53eb659d7\u002FeJobsSpacing.png",[],{"type":17,"value":104},{"type":17,"value":104},{"type":17,"value":104},{"type":12,"tag":78,"props":167,"children":169},{"className":168},[100,108,109],[170,171,180],{"type":17,"value":104},{"type":12,"tag":78,"props":172,"children":174},{"className":173},[100,116,117],[175,179],{"type":12,"tag":120,"props":176,"children":178},{"src":177},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F544wVyv8Hha1rX1arocVOL\u002F987bfa86fc3344c5fd6abf6139ab60cf\u002FeJobsInputFiled.png",[],{"type":17,"value":104},{"type":17,"value":142},{"type":17,"value":96},{"type":17,"value":96},{"type":12,"tag":78,"props":184,"children":186},{"className":185},[100,101],[187,188,203,204,219],{"type":17,"value":104},{"type":12,"tag":78,"props":189,"children":191},{"className":190},[100,108,109],[192,193,202],{"type":17,"value":112},{"type":12,"tag":78,"props":194,"children":196},{"className":195},[100,116,117],[197,201],{"type":12,"tag":120,"props":198,"children":200},{"src":199},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F2AeGk9qlOd6sesysdWs9QX\u002Faeeba68ab7a712bcbda42669efb7650e\u002FeJobsPrimaryButtons.png",[],{"type":17,"value":104},{"type":17,"value":104},{"type":17,"value":104},{"type":12,"tag":78,"props":205,"children":207},{"className":206},[100,108,109],[208,209,218],{"type":17,"value":104},{"type":12,"tag":78,"props":210,"children":212},{"className":211},[100,116,117],[213,217],{"type":12,"tag":120,"props":214,"children":216},{"src":215},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F1RL4TH1lRgObITU1i7qBbX\u002Fb184c85f5c83c9726e4b2adca6816fd4\u002FeJobsSwitcherCheckbox.png",[],{"type":17,"value":104},{"type":17,"value":142},{"type":17,"value":96},{"type":17,"value":96},{"type":12,"tag":78,"props":222,"children":224},{"className":223},[100,101],[225,226,241,242,257],{"type":17,"value":104},{"type":12,"tag":78,"props":227,"children":229},{"className":228},[100,108,109],[230,231,240],{"type":17,"value":112},{"type":12,"tag":78,"props":232,"children":234},{"className":233},[100,116,117],[235,239],{"type":12,"tag":120,"props":236,"children":238},{"src":237},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F21vRj5i1Kw88Fob1eXHSfM\u002Fe8f68a802f7d897f05b19abd8f72aba5\u002FeJobsIcons.png",[],{"type":17,"value":104},{"type":17,"value":104},{"type":17,"value":104},{"type":12,"tag":78,"props":243,"children":245},{"className":244},[100,108,109],[246,247,256],{"type":17,"value":104},{"type":12,"tag":78,"props":248,"children":250},{"className":249},[100,116,117],[251,255],{"type":12,"tag":120,"props":252,"children":254},{"src":253},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F3dvaDzvnIIpTHah8mVjfH8\u002F44a670bd0a09c7ff8a2e7e0a214f7c9c\u002FeJobsMoleculs.png",[],{"type":17,"value":104},{"type":17,"value":142},{"type":17,"value":96},{"type":12,"tag":259,"props":260,"children":262},"h5",{"id":261},"build-refine",[263],{"type":17,"value":264},"Build & refine",{"type":12,"tag":36,"props":266,"children":268},{"id":267},"validating-by-designing-critical-flows",[269],{"type":17,"value":270},"Validating by designing critical flows",{"type":12,"tag":13,"props":272,"children":273},{},[274],{"type":17,"value":275},"A design system only proves its value when it meets real product problems. Rather than testing the system in isolation, we validated it by designing critical user flows with the new styling applied; the most demanding surfaces, where hierarchy, accessibility, and interaction patterns all needed to work together under pressure.",{"type":12,"tag":13,"props":277,"children":278},{},[279],{"type":17,"value":280},"This approach meant refinements were grounded in real context, not just hypothetical edge cases. Each flow revealed where the system held and where it needed adjustment, feeding directly back into the component library.",{"type":12,"tag":25,"props":282,"children":283},{},[],{"type":12,"tag":36,"props":285,"children":287},{"id":286},"how-we-improved-our-design-library",[288],{"type":17,"value":289},"How we improved our design library",{"type":12,"tag":13,"props":291,"children":292},{},[293],{"type":17,"value":294},"The system was tested through new flows with guerrilla-style sessions at job fairs, gathering direct feedback from real users. Four lessons shaped how the library evolved:\nContrast matters.",{"type":12,"tag":13,"props":296,"children":297},{},[298,304],{"type":12,"tag":299,"props":300,"children":301},"strong",{},[302],{"type":17,"value":303},"Accessibility is not optional;",{"type":17,"value":305}," every state was tested and refined to meet standards, ensuring the platform works for users across all levels of visual ability.",{"type":12,"tag":13,"props":307,"children":308},{},[309,314],{"type":12,"tag":299,"props":310,"children":311},{},[312],{"type":17,"value":313},"Redundancy helps.",{"type":17,"value":315}," Giving users two ways to perform the same action (a cancel button and a close button, for example) reduces friction and cognitive load, especially for infrequent users.",{"type":12,"tag":13,"props":317,"children":318},{},[319,324],{"type":12,"tag":299,"props":320,"children":321},{},[322],{"type":17,"value":323},"Clarity is key.",{"type":17,"value":325}," eJobs users do not visit every day. Clear labels on every element mean that someone returning after weeks away can orient themselves immediately without relearning the interface.",{"type":12,"tag":13,"props":327,"children":328},{},[329,334],{"type":12,"tag":299,"props":330,"children":331},{},[332],{"type":17,"value":333},"Choice empowers users.",{"type":17,"value":335}," Dark mode was introduced not as a trend but as an accessibility and comfort option; a recognition that different users have different needs at different times.",{"metadata":337,"sys":340,"fields":361},{"tags":338,"concepts":339},[],[],{"space":341,"id":346,"type":347,"createdAt":348,"updatedAt":349,"environment":350,"publishedVersion":354,"revision":355,"contentType":356,"locale":360},{"sys":342},{"type":343,"linkType":344,"id":345},"Link","Space","8fhxjm7547cq","1ZXub0XDOGb5lfP1R0257X","Entry","2020-11-28T15:33:47.508Z","2026-09-12T14:38:30.451Z",{"sys":351},{"id":352,"type":343,"linkType":353},"master","Environment",1143,236,{"sys":357},{"type":343,"linkType":358,"id":359},"ContentType","project","en-US",{"title":362,"teaser":363,"slug":364,"type":365,"highlight":369,"order":370,"thumbnail":371,"herocolor":397,"link":398,"year":399,"problem":400,"outcome":401,"contribution":416,"content":423,"thankYou":424,"readNext":425,"casestudies":428},"eJobs","Elevating Romania’s top job portal with a reimagined digital experience and a scalable design system that connects brand to product.","ejobs",[366,367,368],"Client","UX","Case Study",true,90,{"metadata":372,"sys":375,"fields":386},{"tags":373,"concepts":374},[],[],{"space":376,"id":378,"type":379,"createdAt":380,"updatedAt":381,"environment":382,"publishedVersion":384,"revision":385,"locale":360},{"sys":377},{"type":343,"linkType":344,"id":345},"7HDRa3rPLVzHVITZuAP2Z6","Asset","2021-01-10T17:58:54.207Z","2024-04-30T10:40:26.699Z",{"sys":383},{"id":352,"type":343,"linkType":353},14,4,{"title":387,"file":388},"ejobsHeader",{"url":389,"details":390,"fileName":395,"contentType":396},"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F7HDRa3rPLVzHVITZuAP2Z6\u002F82859de52a013a5f2809a5a82c9446a9\u002Fheader.png",{"size":391,"image":392},2265270,{"width":393,"height":394},2880,1752,"header.png","image\u002Fpng","753BBC","https:\u002F\u002Fwww.ejobs.ro\u002F",2018,"With over 20 years of experience, eJobs is Romania's leading digital job portal — trusted, widely recognised, and home to a database of more than 4.5 million CVs. Its audience reflects the full demographic spectrum of the country, which brings both opportunity and real design complexity: the platform needs to work for users with vastly different levels of technical literacy. As Romania's largest job portal continues its digital transformation, the challenge was clear. Long-standing business expectations, entrenched user perceptions, and outdated technology all needed to move together.",[402,405,408,411,414],{"number":403,"description":404},"500k","monthly active user",{"number":406,"description":407},"↑","scalable multi-platfrom design system",{"number":409,"description":410},"4+","rating in Appstore and Playstore",{"number":412,"description":413},"3.9M","professionals on the platform",{"number":406,"description":415},"art direction spanning brand, product, and campaigns",[417,418,419,420,421,422],"Product Design","Branding","Art Direction","User Experience","Animation","Editoral","###### The observation\n# Beyond an aggregator\neJobs has uncovered major opportunities for growth that extend far beyond its traditional role as a job ad aggregator. The vision includes offering comprehensive HR services, delivering specialised recruitment solutions for niche industries, and supporting the workforce of the future through educational programmes focused on upskilling and reskilling.\n\nTo realise that vision, the brand and the product needed to grow together. The job was to build a complete visual language from the ground up: one that could scale across every surface the product touches, from campaigns to product to communications.\n\n::gallery\n  ::gallery-item{span=\"8\" src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002FHh5txnetHoUxKF9TgPqRn\u002Fcb1135fbe56d52a4c7e421c695560465\u002FeJobsLogo.png?w=1600\"}\n  ::\n  ::gallery-item{span=\"6\" src=\"\u002F\u002Fvideos.ctfassets.net\u002F8fhxjm7547cq\u002F3q2dNlhjnKe05JlMcuDiYH\u002F3412e49e641ee9fcfc27b6ee52f74d21\u002F_logoOutro.mp4\"}\n  ::\n  ::gallery-item{span=\"6\" src=\"\u002F\u002Fvideos.ctfassets.net\u002F8fhxjm7547cq\u002F3vOxX0sG5eaWJiemSGjfEP\u002F1775834f52d2ee0e3af1067272c6c76f\u002F_logoTVpurple.mp4\"}\n  ::\n  ::gallery-item{span=\"4\" src=\"\u002F\u002Fvideos.ctfassets.net\u002F8fhxjm7547cq\u002F4g9md5lcoMtxKZ82A3g13h\u002F8e53f825ad31d01b54af9b22ca8f141e\u002FeJobsLogoSwap.mp4\"}\n  ::\n  ::gallery-item{span=\"4\" src=\"\u002F\u002Fvideos.ctfassets.net\u002F8fhxjm7547cq\u002F1JmbAx5BeJP2PvIx0Hd5sk\u002Fbb01ff510a79f2fe115f11c30d2df6a6\u002FeJobshHuman.mp4\"}\n  ::\n  ::gallery-item{span=\"4\" src=\"\u002F\u002Fvideos.ctfassets.net\u002F8fhxjm7547cq\u002F5RJcSGk3eJjY6Tk7fk6VuN\u002F6ee4c26803bb886beb5615ce6b1438de\u002FeJobsShoutOut.mp4\"}\n  ::\n::\n\n---\n\n###### The art direction\n# A new journey starts here\nThe central idea was to make eJobs feel like a genuine starting point for every career move, not just a listings page. The art direction I developed centres on realistic objects — familiar, everyday items whose meaning is subtly reimagined to spark curiosity and connection. Friendly and playful, yet vibrant and distinctive, the style needed to work fast and at scale across campaigns, product, and communications.\n\nI developed the line art illustration style into something more flexible and systematic, giving the team a visual language they could apply consistently without losing character.\n\n\u003Cdiv class=\"gallery-block gallery-block container mx-auto h-max p-5 py-20 lg:py-28\">\n\n  \u003Cdiv class=\"tile is-ancestor\">\n\n   \u003Cdiv class=\"tile is-8 is-parent is-vertical\">\n    \u003Cdiv class=\"tile is-child box\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F7aiRnaPhMr8f429K3y7b8W\u002F0b57be618be0c0b3999111f15d61a8da\u002Felements.png?w=1200\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n\n   \u003Cdiv class=\"tile is-4 is-parent is-vertical\">\n    \u003Cdiv class=\"tile is-child box\" style=\"background:#8538C1\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F5U3fRl3tobr7nNAIHL2zBC\u002F1cef08eb14d5dc0b5fbfd14c6ab881ac\u002FpencilDesign.png?w=800\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n\n  \u003C\u002Fdiv>\n\n  \u003Cdiv class=\"tile is-ancestor\">\n   \u003Cdiv class=\"tile is-4 is-parent is-vertical\">\n    \u003Cdiv class=\"tile is-child box\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F4kyfUToTLaMYCeW1Fjeudc\u002F0e9b6d378d1619bf8f3aa5af6743cecc\u002Fperson.png?w=800\" \u002F>\n    \u003C\u002Fdiv>\n         \u003Cdiv class=\"tile is-child box\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F7GK1uXiOuH6tPQN3QHCuTQ\u002Fa813a1006e4e963b503b27f1113b4605\u002Fframe.png?w=800\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n   \u003Cdiv class=\"tile is-8 is-parent is-vertical\">\n    \u003Cdiv class=\"tile is-child box\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002Fw05XD4ibhUCzGkmJwbjv2\u002Fd86a0c8e9acdbe78f7928be9fe5bfb55\u002Fbooklet__2_.png?w=1200\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n \u003Cdiv class=\"tile is-ancestor\">\n   \u003Cdiv class=\"tile is-6 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n            \u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F3DOlHZRXRRZALqpsrfGS77\u002F4d06231f53859d13203e477c8147c087\u002FperformanceMarketing.png?w=1200\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n   \u003Cdiv class=\"tile is-6 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n            \u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002FUzejk62L1FojZgJU2lBj0\u002Fb3ca32ece060631766eab5dd5bd058c6\u002FserviceOverview.png?w=1200\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n\u003C\u002Fdiv>\n\n---\n\n###### The product design\n# A blueprint for a design system\nThe design system builds directly on the established art direction, turning aesthetic principles into a scalable, user-friendly, and accessible framework. Working from the atomic principle, I developed the foundational layer — grid, colour palette, typography system and scale, buttons, input fields, hierarchy, line widths, and illustrations — before advancing to more complex interaction patterns and components.\n\nThe system needed to support Android, iOS, and a responsive web app simultaneously, which meant defining clear breakpoints, simplifying platform quirks, and optimising performance across devices. With 500k monthly active users spanning all ages and digital literacy levels, accessibility and usability were priorities from the start. Custom illustrations and subtle UI touches kept everything true to the brand. Designer tokens were then handed to the front-end team, who translated them into their own component library.\n\n[Read more about eJobs' design system](\u002Fproject\u002Fejobs\u002Fhow_to_build_an_atomic_fluid_design_system)\n\n\u003Cdiv class=\"gallery-block gallery-block container mx-auto h-max p-5 py-20 lg:py-28\">\n\n  \u003Cdiv class=\"tile is-ancestor\">\n   \u003Cdiv class=\"tile is-4 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n      \u003Cvideo autoplay loop>\n\u003Csource src=\"\u002F\u002Fvideos.ctfassets.net\u002F8fhxjm7547cq\u002F7bF5HAHwKbThKrR2wHuR8k\u002F3333a070a7842425186c4262c99f7d43\u002FmobileAnimeJobs.mp4\">\n\u003C\u002Fvideo>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n   \u003Cdiv class=\"tile is-8 is-parent\">\n    \u003Cdiv class=\"tile is-child box\" style=\"background:#24184D\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002FmCtLZtR4hby9SJMhfJjGI\u002Fe510ee83da14f69b3f723e4fe534feac\u002FlandingPageExemples.png?w=1200\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003Cdiv class=\"tile is-ancestor\">\n   \u003Cdiv class=\"tile is-12 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F57NU9TIWtFE0xsuYaT6Due\u002F400b6cffb79dd3b51b8a4e4007c7b8d9\u002FsearchPage.png?w=2000\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n   \u003Cdiv class=\"tile is-ancestor\">\n   \u003Cdiv class=\"tile is-4 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F6y1mA9L2evwldP37IPtaJ3\u002F00fb3afa27a86743e5974f346b204d1d\u002FdarkMobileExample.png?w=800\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n   \u003Cdiv class=\"tile is-8 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n\u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F116bgDkFHTCgxmLgLpyewq\u002F3c1f528dd5c4cc6575c841091857aa0a\u002FsearchPageDark.png?w=1400\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003Cdiv class=\"tile is-ancestor\">\n   \u003Cdiv class=\"tile is-6 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n      \u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002FF9BblJd4NzoRff89q8ZQm\u002Fddff8bae381f95052ee39fb5c58fe367\u002FillustratedIcons.png?w=1200\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n    \u003Cdiv class=\"tile is-6 is-parent\">\n    \u003Cdiv class=\"tile is-child box\">\n      \u003Cimg src=\"\u002F\u002Fimages.ctfassets.net\u002F8fhxjm7547cq\u002F6wvNOfdLv1iT1RXCNaK9xo\u002Fa6d12c26c567130b1de06fcb9bcdfa97\u002Femojies.png?w=1200\" \u002F>\n    \u003C\u002Fdiv>\n   \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n\u003C\u002Fdiv>","Thanks to David for management and product design and Mircea for the clever UX interactions, feedback, etc. To Laura for the research, insights, and clarity. And to Ana and Alexandra.",{"sys":426},{"type":343,"linkType":347,"id":427},"7z52gqj4GX0cEklQu5bgdM",[429,432],{"sys":430},{"type":343,"linkType":347,"id":431},"59Q6hNF2XXk6KV17Mj6scW",{"metadata":433,"sys":436},{"tags":434,"concepts":435},[],[],{"space":437,"id":439,"type":347,"createdAt":440,"updatedAt":441,"environment":442,"publishedVersion":444,"revision":445,"contentType":446,"locale":360},{"sys":438},{"type":343,"linkType":344,"id":345},"1FyKA04BPD32a8LYeB99rP","2022-04-09T19:59:14.004Z","2026-05-10T10:21:56.254Z",{"sys":443},{"id":352,"type":343,"linkType":353},295,55,{"sys":447},{"type":343,"linkType":358,"id":448},"casestudy",1791308692995]