[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-previews":3,"case-study-previews":137,"article-en-cm8bcqvvl008i9q2nt8yd135t":581,"article-designing-vitras-flagship-configurator-en":1753},["Reactive",4],[5,35,62,87,111],{"showImage":6,"isFeatured":6,"hero":7,"heroCaption":7,"id":8,"title":9,"shortDescription":15,"category":26,"tags":27,"readingDuration":32,"createdAt":33,"updatedAt":34,"slug":29},false,null,"cm8l9tbl5006s14of2lwhm6aw",{"id":10,"language":11,"value":12,"type":14},"cm975paaq00bk38jd0nejuhce","en",{"text":13},"Configurators","text",{"id":16,"language":11,"value":17,"type":25},"cm975paar00bm38jd6fcve6q0",{"type":18,"content":19},"doc",[20],{"type":21,"content":22},"paragraph",[23],{"text":24,"type":14},"In this article, we’ll explore what goes into building a great product configurator, sharing insights and lessons from our past projects.","richText","ECOMMERCE",[28,29,30,31],"configurator","configurators","apple","ecommerce",11,"2025-03-23T06:42:23.081Z","2025-04-07T14:18:12.192Z",{"showImage":6,"isFeatured":6,"hero":36,"heroCaption":7,"id":42,"title":43,"shortDescription":47,"category":55,"tags":56,"readingDuration":58,"createdAt":59,"updatedAt":60,"slug":61},{"id":37,"url":38,"alt":39,"type":40,"width":41,"height":41},"cm9846gzf0044c8nkfcng0qpq","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F6f8f0cdc-048e-4110-96e5-dbdd0d3d1ef8","Loop hero image","image\u002Fwebp",0,"cm8ad902700009q2nbegh7lpx",{"id":44,"language":11,"value":45,"type":14},"cm9846gze003yc8nklsfanz5b",{"text":46},"The Next Step for Closed-Loop Systems",{"id":48,"language":11,"value":49,"type":25},"cm9846gze0040c8nkapyqifdd",{"type":18,"content":50},[51],{"type":21,"content":52},[53],{"text":54,"type":14},"In this article, we explore how to overcome their biggest challenges to drive the next generation of closed-loop systems.","MOBILE APP",[57],"Loop",6,"2025-03-15T15:33:05.551Z","2025-04-08T06:23:20.953Z","the-next-step-for-closed-loop-systems",{"showImage":6,"isFeatured":6,"hero":63,"heroCaption":7,"id":68,"title":69,"shortDescription":73,"category":26,"tags":81,"readingDuration":83,"createdAt":84,"updatedAt":85,"slug":86},{"id":64,"url":65,"alt":66,"type":67,"width":41,"height":41},"cm98ncfvb0190c8nkmuj1yv66","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F04b4f6be-2bac-428f-83ce-d962b76e6567","Vitra ","video\u002Fmp4","cm8bcqvvl008i9q2nt8yd135t",{"id":70,"language":11,"value":71,"type":14},"cm98ncfva018uc8nkvlpya98m",{"text":72},"Designing Vitra’s flagship configurator",{"id":74,"language":11,"value":75,"type":25},"cm98ncfvb018wc8nkjo07sark",{"type":18,"content":76},[77],{"type":21,"content":78},[79],{"text":80,"type":14},"In this article, we dive into the design process behind Vitra's flagship configurator and explore how we improved the shopping experience at every step.",[82],"Vitra",16,"2025-03-16T08:06:46.497Z","2025-04-08T15:19:52.146Z","designing-vitras-flagship-configurator",{"showImage":6,"isFeatured":6,"hero":88,"heroCaption":7,"id":92,"title":93,"shortDescription":97,"category":105,"tags":106,"readingDuration":107,"createdAt":108,"updatedAt":109,"slug":110},{"id":89,"url":90,"alt":91,"type":40,"width":41,"height":41},"cm98pazwz01fyc8nkkbl5j6fg","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F0623dcd8-36e7-46d3-9738-4705c440c2bf","Platform Examples","cm8l9um2w006z14ofism8znn5",{"id":94,"language":11,"value":95,"type":14},"cm98pazwy01fsc8nk6s3p43ff",{"text":96},"The architecture of modern eCommerce platforms",{"id":98,"language":11,"value":99,"type":25},"cm98pazwz01fuc8nk67upqvuy",{"type":18,"content":100},[101],{"type":21,"content":102},[103],{"text":104,"type":14},"In today’s fast-paced e-commerce world, businesses need more than just a functional online store—they need a platform that’s flexible, scalable, and tailored to their brand. ","CATEGORY",[],9,"2025-03-23T06:43:23.336Z","2025-04-08T16:14:44.048Z","the-architecture-of-modern-ecommerce-platforms",{"showImage":6,"isFeatured":6,"hero":112,"heroCaption":7,"id":116,"title":117,"shortDescription":121,"category":129,"tags":130,"readingDuration":133,"createdAt":134,"updatedAt":135,"slug":136},{"id":113,"url":114,"alt":115,"type":67,"width":41,"height":41},"cm9ctxjio000o12zwkrijxeww","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fd1dc6d4d-9292-4aa3-abfd-a61662bd1428","New Ecommerce Overview","cm8u8zmxf018o13z9ras6v433",{"id":118,"language":11,"value":119,"type":14},"cm9ctxjin000i12zw1elqhr0y",{"text":120},"Smart eCommerce is Transforming Online Shopping",{"id":122,"language":11,"value":123,"type":25},"cm9ctxjin000k12zwr2ygg8vh",{"type":18,"content":124},[125],{"type":21,"content":126},[127],{"text":128,"type":14},"In this article, we explore how brands are leading the way with innovative tools and strategies to redefine digital retail.","Ecommerce",[26,131,132],"CONFIGURATOR","FINDER",14,"2025-03-29T13:29:13.683Z","2025-04-11T13:35:19.051Z","smart-ecommerce-is-transforming-online-shopping",["Reactive",138],[139,212,278,398,477],{"tags":140,"themeColor":141,"platform":142,"type":143,"technologies":144,"id":150,"title":161,"isFeatured":162,"isPrivate":162,"slug":163,"yearOfPublication":164,"brandName":165,"features":166,"url":168,"thumbnail":169,"logo":172,"createdAt":177,"updatedAt":178,"metrics":179,"description":180,"heading":188,"extendedDescription":192,"credits":200},[],"#090713","desktop","Packaging",[145,151,156],{"id":146,"category":147,"technologies":148,"caseStudyId":150},"cm9zewdh600cb13drfe2v7ozy","Animation",[149],"After Effects","5",{"id":152,"category":153,"technologies":154,"caseStudyId":150},"cm9zewdh600cc13dru48x0scs","Design ",[155],"Figma",{"id":157,"category":158,"technologies":159,"caseStudyId":150},"cm9zewdh600cd13drwiiz53rc","Protoype",[160],"Protopie","Other Projects",true,"other-projects",2024,"Other",[142,167],"innovation","https:\u002F\u002Fwww.x-bionic.com",{"width":41,"height":41,"id":170,"url":171,"alt":161,"type":40},"cm9zewdgr00ao13dr8nmkiuyk","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fd366729a-4a84-4340-a753-6ddca8135d51",{"width":41,"height":41,"id":173,"url":174,"alt":175,"type":176},"cm9zewdgv00aq13drrtkmfc8p","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F4228da45-a3db-4ef0-9b75-7df6f4adb0af","Dior Logo CD Subtract","image\u002Fsvg+xml","2025-02-05T17:49:45.819Z","2025-04-27T08:53:12.373Z",[],{"id":181,"language":11,"value":182,"type":25},"cm9zewdh600c613drwa9k4xsb",{"type":18,"content":183},[184],{"type":21,"content":185},[186],{"text":187,"type":14},"Sharing a collection of project highlights that showcase the diversity of challenges and solutions from various projects I've worked on. These “bites” give a snapshot of the technical solutions, and creative problem-solving that went into each project.",{"id":189,"language":11,"value":190,"type":14},"cm9zewdh600c313drsht43wl6",{"text":191},"Project Bites",{"id":193,"language":11,"value":194,"type":25},"cm9zewdh600c713drvgr0zwk2",{"type":18,"content":195},[196],{"type":21,"content":197},[198],{"text":199,"type":14},"From crafting new icon languages and expanding visual identities to designing seamless interactions and packaging for global distribution, these highlights illustrate the breadth of my contributions across multiple platforms and industries.\"",[201,205,208],{"id":202,"name":203,"role":204},"cm9zewdh500c013dr4fwpw14c","Jonas Auernhammer ","Design",{"id":206,"name":207,"role":204},"cm9zewdh500c113drjs1u75gq","Kristina Nikaj",{"id":209,"name":210,"role":211},"cm9zewdh500c213dr0ysok2ad","Daan Klaver","Creative Direction",{"tags":213,"themeColor":214,"platform":142,"type":215,"technologies":216,"id":217,"title":218,"isFeatured":162,"isPrivate":162,"slug":218,"yearOfPublication":219,"brandName":218,"features":220,"url":222,"thumbnail":223,"logo":229,"createdAt":236,"updatedAt":237,"metrics":238,"description":239,"heading":247,"extendedDescription":251,"footnote":259,"credits":277},[],"","App",[],"cmg5lz5yz0019122phahtegr2","nsave",2025,[221,142],"mobile","https:\u002F\u002Fwww.nsave.com",{"width":224,"height":225,"id":226,"url":227,"alt":228,"type":40},1920,1080,"cml2k6eho000stonze6l91054","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F1fe47700-3284-4454-a834-c244523f4163","nsave investment tab nike stock detail view",{"width":230,"height":231,"id":232,"url":233,"alt":234,"type":235},481,480,"cml2k6ehp000utonzmm32gnp3","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F3be34b36-56fe-4d45-9d09-ba483125d330","logo nsave","image\u002Fpng","2025-09-29T20:56:11.000Z","2026-01-31T17:01:02.558Z",[],{"id":240,"language":11,"value":241,"type":25},"cml2k6ehq000xtonzh6s9hluw",{"type":18,"content":242},[243],{"type":21,"content":244},[245],{"text":246,"type":14},"As the Founding Product Designer at nsave, I led the design across the mobile banking app, website, and brand identity, unifying them into a seamless and trusted experience. ",{"id":248,"language":11,"value":249,"type":14},"cml2k6ehq000vtonzxz67r5h3",{"text":250},"Earn globally, spend locally.",{"id":252,"language":11,"value":253,"type":25},"cml2k6ehq000ztonz88gz4579",{"type":18,"content":254},[255],{"type":21,"content":256},[257],{"text":258,"type":14},"From early research and low-fidelity explorations to a refined design system, every detail was crafted to create an interface that feels simple, secure, and empowering.",{"id":260,"language":11,"value":261,"type":25},"cml2k6ehq0011tonzpoz8nz0c",{"type":18,"content":262},[263],{"type":21,"content":264},[265,267,269,271,272,274,275],{"text":266,"type":14},"If you'd like to share our work publicly, we kindly request that you tag us visibly on the platform.",{"type":268},"hardBreak",{"text":270,"type":14},"This ensures proper attribution, which is important in the creative space for recognizing the",{"type":268},{"text":273,"type":14},"effort and creativity involved. Including our website or account handle helps maintain transparency",{"type":268},{"text":276,"type":14},"and supports the ethical sharing of content.",[],{"tags":279,"themeColor":282,"platform":142,"type":283,"technologies":284,"id":291,"title":302,"isFeatured":162,"isPrivate":6,"slug":303,"yearOfPublication":164,"brandName":304,"features":305,"url":307,"thumbnail":308,"logo":314,"createdAt":319,"updatedAt":320,"metrics":321,"description":345,"heading":353,"extendedDescription":357,"footnote":373,"credits":386},[280,281],"wallet ","geldbeutel","#111112","Configurator",[285,292,297],{"id":286,"category":287,"technologies":288,"caseStudyId":291},"cml76kk1g007stonzj963h702","Frontend",[289,290],"Vue.Js","Three.js","1",{"id":293,"category":294,"technologies":295,"caseStudyId":291},"cml76kk1g007ttonz3dx7hpsa","CMS",[296],"Shopify",{"id":298,"category":299,"technologies":300,"caseStudyId":291},"cml76kk1g007utonz0h4l9tcy","Hosting",[301],"Vercel","Lockcard ","lockcard","Lockcard",[306,142],"threeD","https:\u002F\u002Fconfigurator.lockcard.com\u002F",{"width":309,"height":310,"id":311,"url":312,"alt":313,"type":40},2880,1620,"cml76kk11005otonzb9di144k","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F090e0dd0-b7cd-4da9-bd5b-2097f0cc0130","Lockcard Thumbnail",{"width":315,"height":315,"id":316,"url":317,"alt":318,"type":235},128,"cml76kk15005qtonzus7vml8h","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F59f6782a-baaa-4934-9331-d3206c4d82b8","Lockcard Logo","2025-01-31T10:16:12.893Z","2026-02-03T22:38:59.183Z",[322,329,337],{"id":323,"value":324,"order":41,"title":325},"cml76kk1f0076tonz634dd813","1m +",{"id":326,"language":11,"value":327,"type":14},"cml76kk1f0077tonzeex7sko0",{"text":328},"Annual Users",{"id":330,"value":331,"order":332,"title":333},"cml76kk1f0079tonz0goutz1w","4.8",1,{"id":334,"language":11,"value":335,"type":14},"cml76kk1f007atonzftje029e",{"text":336},"Ø User Rating",{"id":338,"value":339,"order":340,"title":341},"cml76kk1f007ctonzyyapi0oc","2x",2,{"id":342,"language":11,"value":343,"type":14},"cml76kk1f007dtonzzk1pjivy",{"text":344},"Custom bundles sold",{"id":346,"language":11,"value":347,"type":14},"cml76kk1g007ltonzcedrpr0c",{"type":18,"content":348},[349],{"type":21,"content":350},[351],{"text":352,"type":14},"Lockcard entrusted us with building an advanced 3D configurator for their popular modular wallets. We provided a seamless digital shopping experience, allowing their users to effortlessly customize their wallets to suit their needs. Designing the configurator involved an extensive prototyping phase, where we explored various.",{"id":354,"language":11,"value":355,"type":14},"cml76kk1f007itonz0gsbzb1z",{"text":356},"Introducing the new Lockcard Wallet Configurator",{"id":358,"language":11,"value":359,"type":25},"cml76kk1g007mtonzng7nf8ot",{"type":18,"content":360},[361,369],{"type":21,"content":362},[363,365,366,367],{"text":364,"type":14},"Designing the configurator involved an extensive prototyping phase, where we explored various user flows and design paths. We maintained a close collaboration with the Lockcard team with regular check-ins to ensure a solution perfectly tailored to their audience. When working on the UI, we elevated Lockcard's design language while ensuring it remained consistent with their existing e-commerce platform.",{"type":268},{"type":268},{"text":368,"type":14},"We used their existing Shopify as the Backend, Vue.js for dynamic ",{"type":21,"content":370},[371],{"text":372,"type":14},"interfaces, Vercel for seamless hosting and Three.js for 3D interactions",{"id":374,"language":11,"value":375,"type":25},"cml76kk1g007otonzo38ns1rk",{"type":18,"content":376},[377],{"type":21,"content":378},[379,380,381,382,383,384,385],{"text":266,"type":14},{"type":268},{"text":270,"type":14},{"type":268},{"text":273,"type":14},{"type":268},{"text":276,"type":14},[387,390,394],{"id":388,"name":389,"role":204},"cml76kk1f007ftonz2l2yefxt","Jonas Auernhammer",{"id":391,"name":392,"role":393},"cml76kk1f007gtonzf2r5l5tu","Thomas Fichtner","Development",{"id":395,"name":396,"role":397},"cml76kk1f007htonzou55obgz","Jip Newland","Models",{"tags":399,"themeColor":214,"platform":142,"type":405,"technologies":406,"id":411,"title":401,"isFeatured":162,"isPrivate":162,"slug":421,"yearOfPublication":219,"brandName":401,"features":422,"url":425,"thumbnail":426,"logo":432,"createdAt":436,"updatedAt":437,"metrics":438,"description":439,"heading":447,"extendedDescription":451,"footnote":459,"credits":467},[400,401,402,403,404],"Case Study","Puma","Conmebol","AC Millan","Cumbre","Product Design",[407,412,416],{"id":408,"category":204,"technologies":409,"caseStudyId":411},"cml76p8de008qtonzbwbhh7vw",[410],"Adobe Illustrator","3",{"id":413,"category":393,"technologies":414,"caseStudyId":411},"cml76p8de008rtonzlkufwnmb",[415],"Puma T1",{"id":417,"category":418,"technologies":419,"caseStudyId":411},"cml76p8de008stonz6ud8x598","Visualization",[420],"Blender","puma",[423,424],"teamsport","colors-and-materials","https:\u002F\u002Fwww.puma.com",{"width":427,"height":428,"id":429,"url":430,"alt":431,"type":40},4908,2761,"cml76p8d5007xtonzsn7aim23","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F6f649d43-a7f2-4787-95bb-3f9968c0275b","PUMA YOGA THUMBNAIL",{"width":315,"height":315,"id":433,"url":434,"alt":435,"type":176},"cml76p8d8007ztonzjymk6vta","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Ff4ddce75-5b81-4bfa-a574-1e0dce6b97a6","Puma Logo Cat Negative","2025-02-05T17:31:41.782Z","2026-02-03T22:42:37.344Z",[],{"id":440,"language":11,"value":441,"type":25},"cml76p8dd008itonzgte7jzx2",{"type":18,"content":442},[443],{"type":21,"content":444},[445],{"text":446,"type":14},"At PUMA, I am designing the next generation of teamsport equipment, covering everything from performance balls and goalkeeper gloves to shin guards, rackets, and sports bags. The focus lies in creating high-quality, functional gear that meets the needs of both professional athletes and everyday players around the world.",{"id":448,"language":11,"value":449,"type":14},"cml76p8dd008gtonzlu8x1ayz",{"text":450},"Empowering Greatness: Elevating Athletes to New Heights",{"id":452,"language":11,"value":453,"type":25},"cml76p8de008ktonzuhf5jf3n",{"type":18,"content":454},[455],{"type":21,"content":456},[457],{"text":458,"type":14},"Collaborating with first-division clubs like Manchester City, AC Milan, and other top-tier partners, the work blends innovation with deep brand identity. Each product is crafted to reflect PUMA’s performance standards and design DNA, while pushing the boundaries of what modern teamsport gear can offer.",{"id":460,"language":11,"value":461,"type":25},"cml76p8de008ntonzsg9i6jsp",{"type":18,"content":462},[463],{"type":21,"content":464},[465],{"text":466,"type":14},"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. ",[468,470,473],{"id":469,"name":389,"role":204},"cml76p8dd008dtonz9sht7brq",{"id":471,"name":472,"role":211},"cml76p8dd008etonz4q05bkpr","Harald Barani",{"id":474,"name":475,"role":476},"cml76p8dd008ftonzn7eks7w8","Dorn Pablo","3D Modeling",{"tags":478,"themeColor":479,"platform":142,"type":283,"technologies":480,"id":486,"title":82,"isFeatured":162,"isPrivate":6,"slug":496,"yearOfPublication":219,"brandName":82,"features":497,"url":498,"thumbnail":499,"logo":503,"createdAt":507,"updatedAt":508,"metrics":509,"description":531,"heading":539,"extendedDescription":543,"footnote":556,"credits":570},[],"#161009",[481,487,491],{"id":482,"category":483,"technologies":484,"caseStudyId":486},"cml77143o00bntonz16i80ee4","Platform",[485],"vitra.com","2",{"id":488,"category":489,"technologies":490,"caseStudyId":486},"cml77143o00botonz2ndy9mfu","Type",[129],{"id":492,"category":493,"technologies":494,"caseStudyId":486},"cml77143o00bptonz7b5j03ev","Duration",[495],"4 m","vitra",[142,306],"https:\u002F\u002Fvitra.com",{"width":224,"height":225,"id":500,"url":501,"alt":502,"type":40},"cml771437008wtonzv5hrrjc4","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F74394103-76ec-4697-a98d-7f29d9859b4d","Modern room with furniture from Vitra",{"width":315,"height":315,"id":504,"url":505,"alt":506,"type":176},"cml77143a008ytonzwbhqxbrz","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fea12051e-61a6-406f-9165-801343cff652","Logo Vitra V.","2025-02-04T21:17:15.308Z","2026-02-03T22:51:51.676Z",[510,517,524],{"id":511,"value":512,"order":41,"title":513},"cml77143n00b0tonz6twu1vdr","4.8m",{"id":514,"language":11,"value":515,"type":14},"cml77143n00b1tonzl3oi78i5",{"text":516},"Ø Annual Users ",{"id":518,"value":519,"order":332,"title":520},"cml77143n00b3tonzvj73lzyz","28+",{"id":521,"language":11,"value":522,"type":14},"cml77143n00b4tonzu5jw9w5b",{"text":523},"Product Categories",{"id":525,"value":526,"order":340,"title":527},"cml77143n00b6tonzhf6xj1wc","645",{"id":528,"language":11,"value":529,"type":14},"cml77143n00b7tonzlih38c8m",{"text":530},"Configurable Products ",{"id":532,"language":11,"value":533,"type":25},"cml77143o00betonzm5jvmsza",{"type":18,"content":534},[535],{"type":21,"content":536},[537],{"text":538,"type":14},"During my time at Build in Amsterdam, we were entrusted with building a flagship configurator for Vitra’s entire furniture lineup. While doing so, we not only improved the digital shopping experience at every step but also set the stage for a playful yet elegant new UI language for Vitra.com. ",{"id":540,"language":11,"value":541,"type":14},"cml77143o00bctonzhpe8ju46",{"text":542},"Vitra: Flagship Furniture Configurator",{"id":544,"language":11,"value":545,"type":25},"cml77143o00bgtonzuicnt2oo",{"type":18,"content":546},[547,551,552],{"type":21,"content":548},[549],{"text":550,"type":14},"Together with a colleague, I designed a configurator that allowed users to easily customize a wide range of products—from office chairs to sofas and tables—offering real-time visual feedback on materials, colors, and configurations. We also integrated a built-in comparison tool to help users make informed decisions without leaving the product flow. ",{"type":21},{"type":21,"content":553},[554],{"text":555,"type":14},"We seamlessly integrated the configurator into Vitra’s platform while setting the stage for a future redesign of the entire site. This approach ensured the tool not only elevated the current shopping experience but also aligned with Vitra’s long-term digital vision.",{"id":557,"language":11,"value":558,"type":25},"cml77143o00bitonzpkuvto1s",{"type":18,"content":559},[560],{"type":21,"content":561},[562,563,564,565,566,568,569],{"text":266,"type":14},{"type":268},{"text":270,"type":14},{"type":268},{"text":567,"type":14},"effort and creativity involved. Including my website or account handle helps maintain transparency",{"type":268},{"text":276,"type":14},[571,574,577],{"id":572,"name":573,"role":204},"cml77143n00b9tonzoqkeitjn","Charlotte Scherf, Jonas Auernhammer",{"id":575,"name":576,"role":211},"cml77143n00batonzvflg9b98","Daan Klaver, Jerrie Buhrman",{"id":578,"name":579,"role":580},"cml77143n00bbtonzborlt4k5","Karla Vincheva","Project Management",{"id":68,"description":582,"sections":590,"authors":1741},{"id":583,"language":11,"value":584,"type":25},"cm98ncfvb018yc8nklx6dt79t",{"type":18,"content":585},[586],{"type":21,"content":587},[588],{"text":589,"type":14},"In this article, we dive into the design process behind Vitra's flagship configurator and explore how we improved the shopping experience at every step while also setting the stage for a playful yet elegant new design system for Vitra.",[591,640,661,792,808,830,846,887,904,926,942,1034,1049,1075,1091,1122,1138,1167,1183,1217,1233,1271,1287,1313,1329,1359,1375,1401,1417,1439,1456,1478,1495,1521,1538,1560,1577,1599,1615,1637,1654,1676,1693,1707,1716],{"id":592,"order":41,"textContent":593},"cm98ncfvi0191c8nkjganimu7",{"id":594,"content":595},"cm98ncfvi0192c8nk6yhxfx8b",{"id":596,"language":11,"value":597,"type":25},"cm98ncfvj0193c8nk8xqmi4yo",{"type":18,"content":598},[599,605],{"type":600,"attrs":601,"content":602},"heading",{"level":291},[603],{"text":604,"type":14},"Introduction",{"type":21,"content":606},[607,609,618,620,621,622,624,625,626,628,629,630,632,633,634,636,637,638],{"text":608,"type":14},"Following the success of the Vitra Chair Finder and Vitra Gift Finder, Build in Amsterdam was challanged with creating a new flagship configurator for ",{"text":610,"type":14,"marks":611},"Vitra.com",[612],{"type":613,"attrs":614},"link",{"rel":615,"href":616,"target":617},"noopener noreferrer nofollow","http:\u002F\u002FVitra.com","_blank",{"text":619,"type":14},". ",{"type":268},{"type":268},{"text":623,"type":14},"I worked on the project for four months at Build in Amsterdam, collaborating 50\u002F50 with another designer, Charlotte Cherf. The project was supervised by Creative Director Daan Klaaver and Associate Creative Director Jerrie Bührmann. ",{"type":268},{"type":268},{"text":627,"type":14},"This configurator, integrated into every product detail page (PDP) on the site, plays a pivotal role in enhancing and reshaping Vitra’s e-commerce experience. ",{"type":268},{"type":268},{"text":631,"type":14},"As part of the project, we also developed a new design system that lays the foundation for the future redesign of the entire platform. ",{"type":268},{"type":268},{"text":635,"type":14},"Additionally, we introduced an engaging and playful way to explain how to use the products, making it both informative and entertaining.",{"type":268},{"type":268},{"text":639,"type":14},"In this case study, we’ll dive deep into the design of the configurator as I will share the key learnings of the process.",{"id":641,"order":332,"mediaContent":642},"cm98ncfvj0195c8nkvjxmx9pb",{"id":643,"media":644,"caption":648},"cm98ncfvj0196c8nk642o0cqb",{"width":41,"height":41,"id":645,"url":646,"alt":647,"type":40},"cm98ncfrz0188c8nkfnss39mc","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F07da1885-4c1c-4bf5-82eb-6fd7831c1679","Old Vitra Configurator",{"id":649,"language":11,"value":650,"type":25},"cm98ncfvj0197c8nk4a4u0r50",{"type":18,"content":651},[652],{"type":21,"content":653},[654,656],{"text":655,"type":14},"The previous Vitra configurator presented several issues that we identified and resolved with the redesign. ",{"text":657,"type":14,"marks":658},"https:\u002F\u002Fwww.vitra.com\u002Fen-de\u002Fproduct\u002Fdetails\u002Ffauteuil-direction-pivotant",[659],{"type":613,"attrs":660},{"rel":615,"href":657,"target":617},{"id":662,"order":340,"textContent":663},"cm98ncfvk0199c8nk45u3z635",{"id":664,"content":665},"cm98ncfvl019ac8nkh79nmdjn",{"id":666,"language":11,"value":667,"type":25},"cm98ncfvm019bc8nk1c3ehn9f",{"type":18,"content":668},[669,674,735,769],{"type":600,"attrs":670,"content":671},{"level":291},[672],{"text":673,"type":14},"Why Redesign the Configurator",{"type":21,"content":675},[676,678,679,680,681,686,687,688,692,694,695,696,700,702,703,704,708,710,711,712,716,718,719,720,724,726,727,728,732,734],{"text":677,"type":14},"There were three primary issues that drove the need for a redesign of the existing Vitra configurator: UX problems, UI problems, and other considerations.",{"type":268},{"type":268},{"type":268},{"text":682,"type":14,"marks":683},"UX Problems",[684],{"type":685},"bold",{"type":268},{"type":268},{"text":689,"type":14,"marks":690},"1. Decision Difficulty:",[691],{"type":685},{"text":693,"type":14}," Users struggled to confidently choose fabrics, as there wasn’t enough guidance or clarity.",{"type":268},{"type":268},{"text":697,"type":14,"marks":698},"2. Mobile Limitations:",[699],{"type":685},{"text":701,"type":14}," On mobile devices, the available space for 3D visualization was too limited, leading to a less immersive experience.",{"type":268},{"type":268},{"text":705,"type":14,"marks":706},"3. Lack of Information:",[707],{"type":685},{"text":709,"type":14}," For some decisions, users didn’t have enough information to make an informed choice, leading to frustration.",{"type":268},{"type":268},{"text":713,"type":14,"marks":714},"4. Saved Configurations:",[715],{"type":685},{"text":717,"type":14}," Previously saved configurations weren’t well integrated into the platform, making it difficult for users to revisit or continue a past configuration.",{"type":268},{"type":268},{"text":721,"type":14,"marks":722},"5. Option Visualization: ",[723],{"type":685},{"text":725,"type":14},"The sublayers lacked clear visualization of the configuration options, requiring users to apply each option before seeing how it looked.",{"type":268},{"type":268},{"text":729,"type":14,"marks":730},"6. Engagement: ",[731],{"type":685},{"text":733,"type":14},"The process of configuring furniture lacked an element of fun, making it feel more like a chore than a creative experience.",{"type":268},{"type":21,"content":736},[737,738,739,743,744,745,749,751,752,753,757,759,760,761,765,767,768],{"type":268},{"type":268},{"text":740,"type":14,"marks":741},"UI Problems",[742],{"type":685},{"type":268},{"type":268},{"text":746,"type":14,"marks":747},"1. Inconsistent Visual Language: ",[748],{"type":685},{"text":750,"type":14},"The configurator and Vitra's platform lacked a cohesive UI language that reflected Vitra’s tone of voice and wasn’t easily recognizable as part of the brand.",{"type":268},{"type":268},{"text":754,"type":14,"marks":755},"2. Lack of Visualization: ",[756],{"type":685},{"text":758,"type":14},"Many configuration options lacked thumbnails or visual representations, making it harder for users to scan and compare options quickly.",{"type":268},{"type":268},{"text":762,"type":14,"marks":763},"3. Lack of Character: ",[764],{"type":685},{"text":766,"type":14},"The tool lacked personality and didn’t stand out as a distinctive part of Vitra’s digital identity.",{"type":268},{"type":268},{"type":21,"content":770},[771,772,776,777,778,782,784,785,786,790],{"type":268},{"text":773,"type":14,"marks":774},"Other Considerations:",[775],{"type":685},{"type":268},{"type":268},{"text":779,"type":14,"marks":780},"1. Inconsistent Cross-Device Experience:",[781],{"type":685},{"text":783,"type":14},"  Users experienced inconsistent functionality and design across devices, which negatively impacted engagement and led to drop-offs, especially on mobile.",{"type":268},{"type":268},{"text":787,"type":14,"marks":788},"2. Drop-Off During Configuration:",[789],{"type":685},{"text":791,"type":14},"  The complexity of certain configurations resulted in user drop-offs, particularly when the process became too time-consuming or overwhelming.",{"id":793,"order":794,"mediaContent":795},"cm98ncfvo019dc8nke680djwn",3,{"id":796,"media":797,"caption":800},"cm98ncfvo019ec8nk7f4stzp9",{"width":41,"height":41,"id":798,"url":799,"alt":214,"type":40},"cm98ncftr018cc8nkcmy9o2yd","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fe80c2ae3-e519-4871-9347-496cfabda92e",{"id":801,"language":11,"value":802,"type":25},"cm98ncfvo019fc8nk82yxdf4h",{"type":18,"content":803},[804],{"type":21,"content":805},[806],{"text":807,"type":14},"A sample image of a Miro board used for ideation and briefing. The actual briefing was extensive, but for obvious reasons, I cannot show it.",{"id":809,"order":810,"textContent":811},"cm98ncfvo019hc8nkp85ox11c",4,{"id":812,"content":813},"cm98ncfvo019ic8nkrleox5mo",{"id":814,"language":11,"value":815,"type":25},"cm98ncfvo019jc8nklq3olyby",{"type":18,"content":816},[817,822],{"type":600,"attrs":818,"content":819},{"level":291},[820],{"text":821,"type":14},"Briefing",{"type":21,"content":823},[824,826,827,828],{"text":825,"type":14},"Vitra provided a comprehensive briefing through virtual meetings and a well-organized Miro board, where they shared their insights, ideas, and expectations for the project. ",{"type":268},{"type":268},{"text":829,"type":14},"With their deep industry experience and understanding of customer struggles, Vitra’s input was invaluable and played a key role in shaping the success of the project.",{"id":831,"order":832,"mediaContent":833},"cm98ncfvp019lc8nk2hsjtp4x",5,{"id":834,"media":835,"caption":838},"cm98ncfvp019mc8nkh0ccaq0v",{"width":41,"height":41,"id":836,"url":837,"alt":214,"type":40},"cm98ncftr018bc8nkjti9tt4w","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fe03c5174-c623-4743-8e8d-414c0ed83fea",{"id":839,"language":11,"value":840,"type":25},"cm98ncfvp019nc8nkmu86uf9t",{"type":18,"content":841},[842],{"type":21,"content":843},[844],{"text":845,"type":14},"We conducted deep research on existing configurator solutions and built a research board with over 50 user flows from the best configurators. Some examples are shown above.",{"id":847,"order":58,"textContent":848},"cm98ncfvp019pc8nks9yc7xxr",{"id":849,"content":850},"cm98ncfvp019qc8nki3iy1og0",{"id":851,"language":11,"value":852,"type":25},"cm98ncfvp019rc8nk45mqhdk1",{"type":18,"content":853},[854,859],{"type":600,"attrs":855,"content":856},{"level":291},[857],{"text":858,"type":14},"Research",{"type":21,"content":860},[861,863,864,865,869,871,872,873,877,879,880,881,885],{"text":862,"type":14},"To truly understand the platform, brand, and users, we utilized multiple research methods.",{"type":268},{"type":268},{"text":866,"type":14,"marks":867},"Brand Research:",[868],{"type":685},{"text":870,"type":14}," Both Charlotte and I were already familiar with Vitra’s iconic brand and legendary products, but for this project, we took the time to dive deep into its heritage and character. We thoroughly explored Vitra’s platforms, brand books, and any other materials we could access to fully immerse ourselves in the brand’s identity.",{"type":268},{"type":268},{"text":874,"type":14,"marks":875},"User Research:",[876],{"type":685},{"text":878,"type":14}," To get a better understanding of the user perspective, we spoke with previous Vitra customers and interviewed colleagues. Throughout the design process, we conducted smaller user tests on specific aspects of the project to validate our decisions. We even tested the icons we designed to ensure they were readable and clear for users.",{"type":268},{"type":268},{"text":882,"type":14,"marks":883},"Configurator Research:",[884],{"type":685},{"text":886,"type":14}," We gathered a comprehensive overview of the best configurators available online to study their UX choices and draw inspiration for our project. This research helped us benchmark top-notch configurator experiences, and I still refer to this board today for inspiration.",{"id":888,"order":889,"mediaContent":890},"cm98ncfvq019tc8nkjm1x5tk7",7,{"id":891,"media":892,"caption":896},"cm98ncfvq019uc8nku5j0hm5g",{"width":41,"height":41,"id":893,"url":894,"alt":895,"type":40},"cm98ncftr018ac8nks6q1u0xt","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F4f56aada-e076-43ee-b974-e1ce211359d1","Sitemap for both mobile and desktop",{"id":897,"language":11,"value":898,"type":25},"cm98ncfvq019vc8nky9ouf7dj",{"type":18,"content":899},[900],{"type":21,"content":901},[902],{"text":903,"type":14},"A sitemap for both mobile and desktop, showcasing the architecture we designed for seamless integration into the platform.",{"id":905,"order":906,"textContent":907},"cm98ncfvq019xc8nkt9zb3v8v",8,{"id":908,"content":909},"cm98ncfvq019yc8nk7kovp3ge",{"id":910,"language":11,"value":911,"type":25},"cm98ncfvq019zc8nkabqsy9st",{"type":18,"content":912},[913,918],{"type":600,"attrs":914,"content":915},{"level":291},[916],{"text":917,"type":14},"Integration into the platform",{"type":21,"content":919},[920,922,923,924],{"text":921,"type":14},"Throughout the design process, we were mindful of how the configurator would seamlessly blend into the rest of the platform. This meant ensuring a cohesive visual and functional integration while keeping all entry points in mind. ",{"type":268},{"type":268},{"text":925,"type":14},"We also focused on refining how users enter and exit the configurator, making sure the transitions felt natural and intuitive.",{"id":927,"order":107,"mediaContent":928},"cm98ncfvq01a1c8nki61dr8hg",{"id":929,"media":930,"caption":934},"cm98ncfvr01a2c8nkqbb6ejo9",{"width":41,"height":41,"id":931,"url":932,"alt":933,"type":40},"cm98ncfu1018fc8nksdhf2nct","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fcbb19e07-ea84-429f-a7eb-2c41425aea05","Vitra Mobile Ideations",{"id":935,"language":11,"value":936,"type":25},"cm98ncfvr01a3c8nkxfril45k",{"type":18,"content":937},[938],{"type":21,"content":939},[940],{"text":941,"type":14},"We sketched out dozens of ideas in low-fidelity UX wireframes to explore various solutions.",{"id":943,"order":944,"textContent":945},"cm98ncfvr01a5c8nkc1nqt4lh",10,{"id":946,"content":947},"cm98ncfvr01a6c8nkk8yi953b",{"id":948,"language":11,"value":949,"type":25},"cm98ncfvr01a7c8nkpdc60954",{"type":18,"content":950},[951,956],{"type":600,"attrs":952,"content":953},{"level":291},[954],{"text":955,"type":14},"Design Approach",{"type":21,"content":957},[958,960,961,962,966,968,972,974,975,976,980,982,983,984,988,989,993,995,996,997,1001,1002,1006,1008,1009,1010,1014,1015,1019,1021,1022,1023,1027,1028,1032],{"text":959,"type":14},"To find the best solution, we followed a clear, multi-step design process.",{"type":268},{"type":268},{"text":963,"type":14,"marks":964},"1.",[965],{"type":685},{"text":967,"type":14}," ",{"text":969,"type":14,"marks":970},"Research: ",[971],{"type":685},{"text":973,"type":14},"We began with intensive research, as previously explained, to gain a solid foundation of knowledge.",{"type":268},{"type":268},{"text":977,"type":14,"marks":978},"2. Wireframes:",[979],{"type":685},{"text":981,"type":14}," We created dozens of wireframes to explore various UX solutions for the platform, blocking out multiple potential user flows and interfaces.",{"type":268},{"type":268},{"text":985,"type":14,"marks":986},"3.",[987],{"type":685},{"text":967,"type":14},{"text":990,"type":14,"marks":991},"Prototyping:",[992],{"type":685},{"text":994,"type":14}," We refined the most promising solutions into clickable prototypes, which we presented and discussed with the client for feedback.",{"type":268},{"type":268},{"text":998,"type":14,"marks":999},"4.",[1000],{"type":685},{"text":967,"type":14},{"text":1003,"type":14,"marks":1004},"Refinement:",[1005],{"type":685},{"text":1007,"type":14}," After deciding on one direction, we continued to refine the chosen approach.",{"type":268},{"type":268},{"text":1011,"type":14,"marks":1012},"5.",[1013],{"type":685},{"text":967,"type":14},{"text":1016,"type":14,"marks":1017},"Iteration:",[1018],{"type":685},{"text":1020,"type":14}," Throughout the refinement process, we incorporated learnings from user feedback and client input to continuously improve the UX, integrating smart ideas to elevate the experience to the next level.",{"type":268},{"type":268},{"text":1024,"type":14,"marks":1025},"6.",[1026],{"type":685},{"text":967,"type":14},{"text":1029,"type":14,"marks":1030},"Handoff:",[1031],{"type":685},{"text":1033,"type":14}," With my experience in front-end development, we made an extensive dev-handoff to Vitra’s internal development team, providing clear documentation so they could focus on the code and implementation without ambiguity.",{"id":1035,"order":32,"mediaContent":1036},"cm98ncfvs01a9c8nk2kgxkpzj",{"id":1037,"media":1038,"caption":1041},"cm98ncfvs01aac8nklbj6jd9u",{"width":41,"height":41,"id":1039,"url":1040,"alt":214,"type":67},"cm98ncfu3018hc8nk95vr3f0i","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fa8fed237-d982-4950-9d9c-d504e9c902fa",{"id":1042,"language":11,"value":1043,"type":25},"cm98ncfvt01abc8nkmb08aprl",{"type":18,"content":1044},[1045],{"type":21,"content":1046},[1047],{"text":1048,"type":14},"A collection of prototypes showcasing different user flows we designed and built to test which configurations worked best.",{"id":1050,"order":1051,"textContent":1052},"cm98ncfvt01adc8nk3t2xyqdn",12,{"id":1053,"content":1054},"cm98ncfvt01aec8nknnn8d4oz",{"id":1055,"language":11,"value":1056,"type":25},"cm98ncfvt01afc8nkd2xue09i",{"type":18,"content":1057},[1058,1063],{"type":600,"attrs":1059,"content":1060},{"level":291},[1061],{"text":1062,"type":14},"Configurator Directions",{"type":21,"content":1064},[1065,1067,1068,1069,1071,1072,1073],{"text":1066,"type":14},"From the UX phase, we selected the most promising directions and designed eight mid-fidelity prototypes for each. After internal testing, we presented the strongest options to the client for discussion on which direction to pursue. ",{"type":268},{"type":268},{"text":1070,"type":14},"Ultimately, we chose a blend of two directions, focusing on a sublayer approach (you can learn more about this approach in my Configurator article). ",{"type":268},{"type":268},{"text":1074,"type":14},"This decision was driven by the need for users to quickly experiment with color and configuration options, as step-by-step solutions would have made it too time-consuming for users to try different combinations and variations.",{"id":1076,"order":1077,"mediaContent":1078},"cm98ncfvt01ahc8nkgkjpmqb2",13,{"id":1079,"media":1080,"caption":1083},"cm98ncfvt01aic8nk1i692faf",{"width":41,"height":41,"id":1081,"url":1082,"alt":214,"type":40},"cm98ncfu4018ic8nkbtuam0lt","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fec34c7d9-cab2-4d6c-8100-d58d225b11d5",{"id":1084,"language":11,"value":1085,"type":25},"cm98ncfvt01ajc8nkokbks0i0",{"type":18,"content":1086},[1087],{"type":21,"content":1088},[1089],{"text":1090,"type":14},"An overview of the UI language we developed, reflecting Vitra’s playful yet elegant identity.",{"id":1092,"order":133,"textContent":1093},"cm98ncfvu01alc8nk2db6y6qx",{"id":1094,"content":1095},"cm98ncfvu01amc8nkgxb2eviz",{"id":1096,"language":11,"value":1097,"type":25},"cm98ncfvu01anc8nkzs566oou",{"type":18,"content":1098},[1099,1104],{"type":600,"attrs":1100,"content":1101},{"level":291},[1102],{"text":1103,"type":14},"UI Language \u002F Design System",{"type":21,"content":1105},[1106,1108,1109,1110,1112,1116,1118,1119,1120],{"text":1107,"type":14},"Inspired by Vitra’s colorful, playful yet elegant furniture, we crafted a UI language that mirrors these qualities. ",{"type":268},{"type":268},{"text":1111,"type":14},"The result was a vibrant, playful, yet sophisticated design system that not only enhances the configurator experience but also lays the groundwork for the future redesign of the entire ",{"text":610,"type":14,"marks":1113},[1114],{"type":613,"attrs":1115},{"rel":615,"href":616,"target":617},{"text":1117,"type":14}," platform. ",{"type":268},{"type":268},{"text":1121,"type":14},"This new UI language was designed for scalability, with the brand’s essence at its core, ensuring it could grow with the platform while maintaining a strong connection to Vitra's identity.",{"id":1123,"order":1124,"mediaContent":1125},"cm98ncfvu01apc8nkbnt8tugw",15,{"id":1126,"media":1127,"caption":1130},"cm98ncfvu01aqc8nk7ptjfabp",{"width":41,"height":41,"id":1128,"url":1129,"alt":214,"type":67},"cm98ncfu6018jc8nk9bi7nark","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F66f9f982-47c0-40ad-9ea7-6357fc79134b",{"id":1131,"language":11,"value":1132,"type":25},"cm98ncfvu01arc8nkmnhvklos",{"type":18,"content":1133},[1134],{"type":21,"content":1135},[1136],{"text":1137,"type":14},"An overview of the configurator layout, designed to give maximum space to product visualization while maintaining easy navigation through the side panel.",{"id":1139,"order":83,"textContent":1140},"cm98ncfvv01atc8nk2s5rna6h",{"id":1141,"content":1142},"cm98ncfvv01auc8nk1flvqpfz",{"id":1143,"language":11,"value":1144,"type":25},"cm98ncfvv01avc8nk2r6sccc3",{"type":18,"content":1145},[1146,1151],{"type":600,"attrs":1147,"content":1148},{"level":291},[1149],{"text":1150,"type":14},"Configuration Overview",{"type":21,"content":1152},[1153,1155,1156,1157,1159,1160,1161,1163,1164,1165],{"text":1154,"type":14},"We ensured that the furniture visualization took center stage, providing ample space for users to get a clear view of their customization and what they are about to purchase. ",{"type":268},{"type":268},{"text":1158,"type":14},"To complement this, we utilized a side panel for most of the UI elements, incorporating a sublayer approach. This included a streamlined pipeline we developed to quickly generate thumbnails for each configuration category, enabling easy navigation.",{"type":268},{"type":268},{"text":1162,"type":14},"Additionally, we gave users the flexibility to add their current configuration to their wishlist or cart at any point during the process.",{"type":268},{"type":268},{"text":1166,"type":14},"Based on insights from the previous configurator, Vitra learned that customers highly value delivery time, so we included this information prominently next to the price. This feature ensured users were aware if certain configuration options would impact shipping times.",{"id":1168,"order":1169,"mediaContent":1170},"cm98ncfvv01axc8nk6uj8t7qq",17,{"id":1171,"media":1172,"caption":1175},"cm98ncfvv01ayc8nkb81mipkf",{"width":41,"height":41,"id":1173,"url":1174,"alt":214,"type":40},"cm98ncfu7018kc8nkhppuxwus","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fa4d7474c-7171-4c37-bdce-28bb92526578",{"id":1176,"language":11,"value":1177,"type":25},"cm98ncfvw01azc8nkga5awi8q",{"type":18,"content":1178},[1179],{"type":21,"content":1180},[1181],{"text":1182,"type":14},"The five most common sublayers, each with custom visualization for configuration options, while sharing the same cohesive UI language.",{"id":1184,"order":1185,"textContent":1186},"cm98ncfvw01b1c8nk78vdx6fw",18,{"id":1187,"content":1188},"cm98ncfvw01b2c8nkkfwcj7og",{"id":1189,"language":11,"value":1190,"type":25},"cm98ncfvw01b3c8nkpuepk83q",{"type":18,"content":1191},[1192,1197],{"type":600,"attrs":1193,"content":1194},{"level":291},[1195],{"text":1196,"type":14},"Sublayers",{"type":21,"content":1198},[1199,1201,1202,1203,1205,1206,1207,1209,1210,1211,1213,1214,1215],{"text":1200,"type":14},"Almost every item available at Vitra offers some level of customization—some products feature extensive options, while others may only allow for color choices. ",{"type":268},{"type":268},{"text":1204,"type":14},"The system we designed needed to accommodate every level of customization. To achieve this, we created visualized solutions for every type of sublayer, ensuring that the design would work seamlessly across the platform, no matter the product.",{"type":268},{"type":268},{"text":1208,"type":14},"The five most common sublayer types are visualized above, and each sublayer configuration option can include an information text. This allows Vitra to provide additional details that help users make informed decisions.",{"type":268},{"type":268},{"text":1212,"type":14},"One of the most common sublayers users struggle with is the fabric selection, which is also the most prevalent category across Vitra’s product line. ",{"type":268},{"type":268},{"text":1216,"type":14},"We took special care to refine the fabric sublayer, ensuring users had the guidance they needed, as you’ll see next.",{"id":1218,"order":1219,"mediaContent":1220},"cm98ncfvw01b5c8nkv7mmxnso",19,{"id":1221,"media":1222,"caption":1225},"cm98ncfvw01b6c8nkujhnm5b6",{"width":41,"height":41,"id":1223,"url":1224,"alt":214,"type":40},"cm98ncfu8018lc8nkalcf55ih","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F90576af4-b27c-4128-ab0f-eca72b4c491f",{"id":1226,"language":11,"value":1227,"type":25},"cm98ncfvx01b7c8nk7av637rv",{"type":18,"content":1228},[1229],{"type":21,"content":1230},[1231],{"text":1232,"type":14},"An example of the fabric sublayer for the Rookie Chair, showcasing a streamlined selection process with integrated search, filter, and compare options.",{"id":1234,"order":1235,"textContent":1236},"cm98ncfvx01b9c8nk4n6c6jtk",20,{"id":1237,"content":1238},"cm98ncfvx01bac8nkyap0anw4",{"id":1239,"language":11,"value":1240,"type":25},"cm98ncfvx01bbc8nkf5ek6db8",{"type":18,"content":1241},[1242,1247],{"type":600,"attrs":1243,"content":1244},{"level":291},[1245],{"text":1246,"type":14},"Fabrics",{"type":21,"content":1248},[1249,1251,1252,1253,1255,1256,1257,1259,1260,1261,1263,1264,1265,1267,1268,1269],{"text":1250,"type":14},"As previously mentioned, fabrics are the most common configuration option across Vitra’s product range. In the previous configurator, users had to navigate two separate sublayers—one for selecting the fabric material and another for choosing the color. ",{"type":268},{"type":268},{"text":1254,"type":14},"This separation caused confusion and made it harder for users to see which materials were available in their preferred colors. ",{"type":268},{"type":268},{"text":1258,"type":14},"As a result, Vitra had even added a separate section on their product detail pages to display all fabric options.",{"type":268},{"type":268},{"text":1262,"type":14},"With the redesign, we resolved this issue by consolidating both material and color selection under a single Fabrics category. ",{"type":268},{"type":268},{"text":1266,"type":14},"We also introduced search, filter, and compare options, giving users the tools to make more informed decisions and streamline the fabric selection process. ",{"type":268},{"type":268},{"text":1270,"type":14},"This made it easier for users to find exactly what they wanted without the previous complications.",{"id":1272,"order":1273,"mediaContent":1274},"cm98ncfvx01bdc8nkc1qas4c4",21,{"id":1275,"media":1276,"caption":1279},"cm98ncfvx01bec8nkshrh2vt4",{"width":41,"height":41,"id":1277,"url":1278,"alt":214,"type":67},"cm98ncfua018nc8nkv9b5tr6p","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F93034ace-6d85-40a0-999b-897159632f35",{"id":1280,"language":11,"value":1281,"type":25},"cm98ncfvy01bfc8nkin6x6j3y",{"type":18,"content":1282},[1283],{"type":21,"content":1284},[1285],{"text":1286,"type":14},"The playful yet functional filtering system we designed, allowing users to easily search through fabric options by color, texture, and other criteria.",{"id":1288,"order":1289,"textContent":1290},"cm98ncfvy01bhc8nk5k5o5hhl",22,{"id":1291,"content":1292},"cm98ncfvy01bic8nkpse9s3id",{"id":1293,"language":11,"value":1294,"type":25},"cm98ncfvy01bjc8nkheqwq5uu",{"type":18,"content":1295},[1296,1301],{"type":600,"attrs":1297,"content":1298},{"level":291},[1299],{"text":1300,"type":14},"Filtering System",{"type":21,"content":1302},[1303,1305,1306,1307,1309,1310,1311],{"text":1304,"type":14},"Drawing from Vitra’s extensive experience and knowledge of what customers prioritize when selecting fabrics, we designed an accessible yet playful filtering system. Recognizing that users often search within a range of color tones—such as various shades of green—we introduced the idea of using split color spaces. ",{"type":268},{"type":268},{"text":1308,"type":14},"This visual approach allows users to filter for an entire range of colors, rather than one specific value, making the process clearer and more intuitive.",{"type":268},{"type":268},{"text":1312,"type":14},"The filtering tags were carefully crafted based on Vitra’s deep understanding of their customers' needs, ensuring that users could easily find the fabrics that match their preferences without feeling overwhelmed.",{"id":1314,"order":1315,"mediaContent":1316},"cm98ncfvy01blc8nka4kqiq2n",23,{"id":1317,"media":1318,"caption":1321},"cm98ncfvy01bmc8nkcdgp6fvz",{"width":41,"height":41,"id":1319,"url":1320,"alt":214,"type":40},"cm98ncfua018mc8nk85vrjccv","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F8b45d1c7-fdef-4c37-bc88-7f660d0df93b",{"id":1322,"language":11,"value":1323,"type":25},"cm98ncfvy01bnc8nk8wck7b9p",{"type":18,"content":1324},[1325],{"type":21,"content":1326},[1327],{"text":1328,"type":14},"The fabric comparison tool, designed with scannable graphs and a toggle to show only key differences, helping users make informed choices quickly.",{"id":1330,"order":1331,"textContent":1332},"cm98ncfvz01bpc8nkgss6i5yk",24,{"id":1333,"content":1334},"cm98ncfvz01bqc8nk6kkeu8h1",{"id":1335,"language":11,"value":1336,"type":25},"cm98ncfvz01brc8nkc1g070xm",{"type":18,"content":1337},[1338,1343],{"type":600,"attrs":1339,"content":1340},{"level":291},[1341],{"text":1342,"type":14},"Compare Fabrics",{"type":21,"content":1344},[1345,1347,1348,1349,1351,1352,1353,1355,1356,1357],{"text":1346,"type":14},"Typically found on product detail pages (PDPs) or product listing pages (PLPs), we decided to include a fabric compare tool directly within the configurator—right where and when customers need it during the fabric selection process. ",{"type":268},{"type":268},{"text":1350,"type":14},"We designed the tool with scannability in mind, incorporating easy-to-read graphs and custom illustrations to represent different comparison categories.",{"type":268},{"type":268},{"text":1354,"type":14},"Since fabrics often have many similar attributes, and it can be challenging for users to differentiate between them. Thus we added a toggle button that allows users to show only the differences. ",{"type":268},{"type":268},{"text":1358,"type":14},"This feature makes it easier for users to identify the key distinctions between fabrics, ensuring a smoother and more informed decision-making process.",{"id":1360,"order":1361,"mediaContent":1362},"cm98ncfvz01btc8nk0fsmg9fq",25,{"id":1363,"media":1364,"caption":1367},"cm98ncfvz01buc8nkuxoh99zk",{"width":41,"height":41,"id":1365,"url":1366,"alt":214,"type":40},"cm98ncfu2018gc8nkrt6fdt8o","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Ffa644c3e-3dd2-4d6c-bc8b-c9e3687956b0",{"id":1368,"language":11,"value":1369,"type":25},"cm98ncfvz01bvc8nk5zw4j37r",{"type":18,"content":1370},[1371],{"type":21,"content":1372},[1373],{"text":1374,"type":14},"The fabric detail page, complete with large fabric visuals and a custom iconography system, providing users with clear, engaging information about each material.",{"id":1376,"order":1377,"textContent":1378},"cm98ncfvz01bxc8nkxvxihxx4",26,{"id":1379,"content":1380},"cm98ncfvz01byc8nkn2iem8a4",{"id":1381,"language":11,"value":1382,"type":25},"cm98ncfw001bzc8nkzxuokjq8",{"type":18,"content":1383},[1384,1389],{"type":600,"attrs":1385,"content":1386},{"level":291},[1387],{"text":1388,"type":14},"Farbic Details & Iconography",{"type":21,"content":1390},[1391,1393,1394,1395,1397,1398,1399],{"text":1392,"type":14},"To cater to users who want a deeper understanding of a fabric’s texture and qualities, we added a Fabric Detail Page that can be easily accessed from the fabrics sublayer. ",{"type":268},{"type":268},{"text":1396,"type":14},"This page displays a large, detailed image of the fabric along with all its features and specialties in an easy-to-scan layout. ",{"type":268},{"type":268},{"text":1400,"type":14},"The information is visualized using a custom icon system that reflects Vitra’s playful tone of voice, making it both informative and aligned with the brand’s identity.",{"id":1402,"order":1403,"mediaContent":1404},"cm98ncfw001c1c8nkkscr90hh",27,{"id":1405,"media":1406,"caption":1409},"cm98ncfw001c2c8nkr5wsv1fv",{"width":41,"height":41,"id":1407,"url":1408,"alt":214,"type":40},"cm98ncfud018pc8nkijg04qfh","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fc6506787-3cc0-4781-9946-c5e71e4d045e",{"id":1410,"language":11,"value":1411,"type":25},"cm98ncfw001c3c8nkh7ghecir",{"type":18,"content":1412},[1413],{"type":21,"content":1414},[1415],{"text":1416,"type":14},"The mobile version of the configurator, designed with horizontal scrolling to maintain space for product visualization while ensuring a seamless user experience.",{"id":1418,"order":1419,"textContent":1420},"cm98ncfw001c5c8nk9ydpl60r",28,{"id":1421,"content":1422},"cm98ncfw001c6c8nkx81t0n2l",{"id":1423,"language":11,"value":1424,"type":25},"cm98ncfw001c7c8nkjxu25y9y",{"type":18,"content":1425},[1426,1431],{"type":600,"attrs":1427,"content":1428},{"level":291},[1429],{"text":1430,"type":14},"Mobile adjustements",{"type":21,"content":1432},[1433,1435,1436,1437],{"text":1434,"type":14},"To ensure the configurator worked just as well on mobile as it did on desktop, we made several adjustments tailored for the different devices. One key decision was to implement horizontal scrolling for navigation and configuration options, which freed up more space for product visualization and made the configurator more intuitive to use on smartphones. ",{"type":268},{"type":268},{"text":1438,"type":14},"Throughout these adjustments, we maintained a focus on delivering a consistent experience across both mobile and desktop platforms, ensuring a seamless transition between devices.",{"id":1440,"order":1441,"mediaContent":1442},"cm98ncfw101c9c8nk1hgxnb7a",29,{"id":1443,"media":1444,"caption":1448},"cm98ncfw101cac8nkujn62fdp",{"width":41,"height":41,"id":1445,"url":1446,"alt":1447,"type":40},"cm98ncfue018qc8nka1c4n44h","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F36cf3577-e8b2-4b88-b3f1-699545d9d8b3","Vitra Order Fabric Samples",{"id":1449,"language":11,"value":1450,"type":25},"cm98ncfw101cbc8nkbxnt5jyc",{"type":18,"content":1451},[1452],{"type":21,"content":1453},[1454],{"text":1455,"type":14},"The chat assistant, integrated into the fabric selection process, playfully engages users when they reach key decision points, offering help right when it’s needed.",{"id":1457,"order":1458,"textContent":1459},"cm98ncfw101cdc8nkn15pukvl",30,{"id":1460,"content":1461},"cm98ncfw101cec8nkwzxqp4zd",{"id":1462,"language":11,"value":1463,"type":25},"cm98ncfw101cfc8nka2ylcbsu",{"type":18,"content":1464},[1465,1470],{"type":600,"attrs":1466,"content":1467},{"level":291},[1468],{"text":1469,"type":14},"Integration of a Chat Assistant",{"type":21,"content":1471},[1472,1474,1475,1476],{"text":1473,"type":14},"To reduce drop-offs at key moments in the user journey, we integrated a chat assistant that appears when users reach the end of browsing materials or using the compare tool. ",{"type":268},{"type":268},{"text":1477,"type":14},"At this stage, users are often most likely to disengage, so the chat assistant playfully opens up, offering help and guidance to keep them engaged and moving forward in the configuration process.",{"id":1479,"order":1480,"mediaContent":1481},"cm98ncfw101chc8nkk0i68pxh",31,{"id":1482,"media":1483,"caption":1487},"cm98ncfw101cic8nklkxi8f3d",{"width":41,"height":41,"id":1484,"url":1485,"alt":1486,"type":40},"cm98ncfue018rc8nkt6erayti","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fb313ec79-314d-4e24-872d-351a0a6526ab","Vitra 3D Recommendations",{"id":1488,"language":11,"value":1489,"type":25},"cm98ncfw101cjc8nkxk6l7pzv",{"type":18,"content":1490},[1491],{"type":21,"content":1492},[1493],{"text":1494,"type":14},"The 3D recommendations feature, offering users preset configurations as starting points, making the customization process less overwhelming and more intuitive.",{"id":1496,"order":1497,"textContent":1498},"cm98ncfw201clc8nkg2ch58pv",32,{"id":1499,"content":1500},"cm98ncfw201cmc8nke4r7kie1",{"id":1501,"language":11,"value":1502,"type":25},"cm98ncfw201cnc8nkpds96eec",{"type":18,"content":1503},[1504,1509],{"type":600,"attrs":1505,"content":1506},{"level":291},[1507],{"text":1508,"type":14},"Reccomendations \u002F Presets",{"type":21,"content":1510},[1511,1513,1514,1515,1517,1518,1519],{"text":1512,"type":14},"A key learning from other configurator projects is that users often feel overwhelmed when starting from a blank slate. They may not have a clear idea of exactly what they want, which can make the process intimidating. To address this, we introduced recommendations—preset configurations that users can browse and choose as a starting point. ",{"type":268},{"type":268},{"text":1516,"type":14},"This allows them to select something they already like and make minor adjustments to fit their needs perfectly.",{"type":268},{"type":268},{"text":1520,"type":14},"This UX pattern can also be seen on Nike's product detail pages, where users typically select a sneaker color they already prefer and then make small tweaks, like adding a signature, to make it uniquely theirs.",{"id":1522,"order":1523,"mediaContent":1524},"cm98ncfw201cpc8nklw3ht2ad",33,{"id":1525,"media":1526,"caption":1530},"cm98ncfw201cqc8nk6unkxrmu",{"width":41,"height":41,"id":1527,"url":1528,"alt":1529,"type":40},"cm98ncfug018tc8nkos3rudpn","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F1c1be0e1-c9cf-4eaf-bdd7-af30d225eae0","Vitra Saved Configurations",{"id":1531,"language":11,"value":1532,"type":25},"cm98ncfw201crc8nkdk0yvbv8",{"type":18,"content":1533},[1534],{"type":21,"content":1535},[1536],{"text":1537,"type":14},"The saved configurations feature, allowing users to save, compare, and share their favorite designs with ease for later access.",{"id":1539,"order":1540,"textContent":1541},"cm98ncfw201ctc8nkh0979ice",34,{"id":1542,"content":1543},"cm98ncfw301cuc8nk94f81qw1",{"id":1544,"language":11,"value":1545,"type":25},"cm98ncfw301cvc8nkz6upjp7w",{"type":18,"content":1546},[1547,1552],{"type":600,"attrs":1548,"content":1549},{"level":291},[1550],{"text":1551,"type":14},"Saved configurations",{"type":21,"content":1553},[1554,1556,1557,1558],{"text":1555,"type":14},"We included a wishlist feature that allows users to save different configurations, giving them the ability to compare options, share the list with friends, partners, or family members, or simply return to it later. ",{"type":268},{"type":268},{"text":1559,"type":14},"This feature enhances flexibility, enabling users to explore multiple configurations without feeling pressured to make an immediate decision, while also making it easy to gather feedback from others.",{"id":1561,"order":1562,"mediaContent":1563},"cm98ncfw301cxc8nk3kynfer4",35,{"id":1564,"media":1565,"caption":1569},"cm98ncfw301cyc8nklisqokao",{"width":41,"height":41,"id":1566,"url":1567,"alt":1568,"type":40},"cm98ncfuf018sc8nkz085g5fg","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F7cae161c-4983-4d14-ab1a-92921ed80e1d","Vitra Acessibility",{"id":1570,"language":11,"value":1571,"type":25},"cm98ncfw301czc8nkwvipmxkz",{"type":18,"content":1572},[1573],{"type":21,"content":1574},[1575],{"text":1576,"type":14},"The dynamic module designed to house key tools, ensuring accessibility by offering multiple ways to interact with the configurator and its features.",{"id":1578,"order":1579,"textContent":1580},"cm98ncfw301d1c8nk5ummfpji",36,{"id":1581,"content":1582},"cm98ncfw301d2c8nkpfe73lye",{"id":1583,"language":11,"value":1584,"type":25},"cm98ncfw301d3c8nkjpnz83kt",{"type":18,"content":1585},[1586,1591],{"type":600,"attrs":1587,"content":1588},{"level":291},[1589],{"text":1590,"type":14},"Acessibility",{"type":21,"content":1592},[1593,1595,1596,1597],{"text":1594,"type":14},"To ensure the configurator is accessible to all users, we incorporated several accessibility best practices. This includes providing multiple interaction options for the 3D model, allowing users to interact in a way that suits their preferences and needs. ",{"type":268},{"type":268},{"text":1598,"type":14},"By focusing on inclusivity, we made sure the configurator is usable for a broad range of users, regardless of their abilities or device limitations.",{"id":1600,"order":1601,"mediaContent":1602},"cm98ncfw401d5c8nkd96yggjm",37,{"id":1603,"media":1604,"caption":1607},"cm98ncfw401d6c8nkzoth9sff",{"width":41,"height":41,"id":1605,"url":1606,"alt":214,"type":67},"cm98ncfts018dc8nki1469n0d","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F4ba5ad94-81ed-4781-aa81-0f2f4164b6c1",{"id":1608,"language":11,"value":1609,"type":25},"cm98ncfw401d7c8nkdsk6tqkj",{"type":18,"content":1610},[1611],{"type":21,"content":1612},[1613],{"text":1614,"type":14},"The streamlined checkout animation, providing visual feedback when adding items to the cart while allowing users to continue customizing or start a new configuration.",{"id":1616,"order":1617,"textContent":1618},"cm98ncfw401d9c8nkhmiehcww",38,{"id":1619,"content":1620},"cm98ncfw401dac8nkro3ibqu6",{"id":1621,"language":11,"value":1622,"type":25},"cm98ncfw401dbc8nkvfsuaup5",{"type":18,"content":1623},[1624,1629],{"type":600,"attrs":1625,"content":1626},{"level":291},[1627],{"text":1628,"type":14},"Checkout",{"type":21,"content":1630},[1631,1633,1634,1635],{"text":1632,"type":14},"The checkout process presented a unique challenge: we needed to provide users with visual feedback that their item had been successfully added to the cart, while also allowing them the option to continue with the current configuration, add another configuration, or design a second chair.",{"type":268},{"type":268},{"text":1636,"type":14},"Initially, we solved this with a dialog box, but after further refinement, we replaced it with a playful animation that streamlined the process, eliminating the need for extra steps while keeping the experience smooth and engaging.",{"id":1638,"order":1639,"mediaContent":1640},"cm98ncfw401ddc8nkpk5nilin",39,{"id":1641,"media":1642,"caption":1646},"cm98ncfw401dec8nkqiq9btpz",{"width":41,"height":41,"id":1643,"url":1644,"alt":1645,"type":67},"cm98ncfsm0189c8nk99d0ucpm","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fbfbb83c0-2fed-4fdf-85c3-ff302fe3c649","Vitra 3D How to use ",{"id":1647,"language":11,"value":1648,"type":25},"cm98ncfw501dfc8nkqv670shf",{"type":18,"content":1649},[1650],{"type":21,"content":1651},[1652],{"text":1653,"type":14},"The \"How to Use\" section, featuring 3D animations and clear explanations to help users understand product functionality in an engaging way.",{"id":1655,"order":1656,"textContent":1657},"cm98ncfw501dhc8nkj01dujmo",40,{"id":1658,"content":1659},"cm98ncfw501dic8nkj9suk97h",{"id":1660,"language":11,"value":1661,"type":25},"cm98ncfw501djc8nkuc93vw08",{"type":18,"content":1662},[1663,1668],{"type":600,"attrs":1664,"content":1665},{"level":291},[1666],{"text":1667,"type":14},"How to use (3D)",{"type":21,"content":1669},[1670,1672,1673,1674],{"text":1671,"type":14},"Charlotte and I worked full-time on the project for the duration of four months. The project was supervised by Creative Director Daan Klaaver and Associate Creative Director Jerrie Bührmann. Karla Vincheva handled the project management.",{"type":268},{"type":268},{"text":1675,"type":14},"We worked in two-week sprints, with bi-weekly meetings with the client and weekly internal check-ins with the team.",{"id":1677,"order":1678,"mediaContent":1679},"cm98ncfw501dlc8nkdjdxydhj",41,{"id":1680,"media":1681,"caption":1685},"cm98ncfw501dmc8nkqatyc9k9",{"width":41,"height":41,"id":1682,"url":1683,"alt":1684,"type":40},"cm98ncfuc018oc8nknoecv067","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Fe6baa1bc-9684-4ada-81bb-5e07ce4415fc","Vitra Configurator Mobile Screens",{"id":1686,"language":11,"value":1687,"type":25},"cm98ncfw501dnc8nkas9r4bkf",{"type":18,"content":1688},[1689],{"type":21,"content":1690},[1691],{"text":1692,"type":14},"A showcase of all mobile screens, designed cohesively to provide a consistent and seamless user experience across devices.",{"id":1694,"order":1695,"textContent":1696},"cm98ncfw501dpc8nkodzplxxn",42,{"id":1697,"content":1698},"cm98ncfw501dqc8nkme1ly0pn",{"id":1699,"language":11,"value":1700,"type":25},"cm98ncfw501drc8nk6c64q74a",{"type":18,"content":1701},[1702],{"type":600,"attrs":1703,"content":1704},{"level":291},[1705],{"text":1706,"type":14},"Summarized",{"id":1708,"order":1709,"mediaContent":1710},"cm98ncfw601dtc8nknj6tykel",43,{"id":1711,"media":1712,"caption":7},"cm98ncfw601duc8nkpbhdyn7k",{"width":41,"height":41,"id":1713,"url":1714,"alt":1715,"type":40},"cm98ncfty018ec8nk35ek3330","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002F1291ce25-5fb4-40ae-9a7e-92cb3b7258ba","Vitra Platform Numbers",{"id":1717,"order":1718,"textContent":1719},"cm98ncfw601dvc8nkvbq3uolb",44,{"id":1720,"content":1721},"cm98ncfw601dwc8nktys8w5fm",{"id":1722,"language":11,"value":1723,"type":25},"cm98ncfw601dxc8nkke802jcb",{"type":18,"content":1724},[1725],{"type":21,"content":1726},[1727,1729,1730,1731,1733,1734,1735,1737,1738,1739],{"text":1728,"type":14},"Through extensive research, thoughtful design, and a deep understanding of Vitra’s brand and user needs, we created a configurator that not only enhances the customer experience but also lays the groundwork for the future of Vitra’s e-commerce platform. ",{"type":268},{"type":268},{"text":1732,"type":14},"The result is a playful, elegant, and functional tool that helps users seamlessly configure products and explore their options with ease and confidence.",{"type":268},{"type":268},{"text":1736,"type":14},"If you’d like to learn more about the project or how we approached the design challenges, feel free to contact me. ",{"type":268},{"type":268},{"text":1740,"type":14},"I am happy to connect.",[1742],{"id":1743,"name":389,"role":1744,"description":1745,"profilePicture":1749},"785472b0-0c9f-47e8-8637-e30558d924e7","Author",{"id":1746,"language":11,"value":1747,"type":14},"cm9ibgjep00fm3fbteayttwqm",{"text":1748},"Thank you for reading this article. If you’d like to learn more about this project or explore ways to collaborate, I’d be happy to connect. Just reach out, and let’s start a conversation.",{"width":41,"height":41,"id":1750,"url":1751,"alt":1752,"type":40},"cm9ibgjep00fo3fbtj4erbupd","https:\u002F\u002Fcms.soehne.co\u002Fsoehne\u002Faf3b8691-9c2e-49df-bf79-f3de0aaad730","Jonas Auernhammer Designer",{"article":581,"preview":1754,"slug":86},["Reactive",62]]