{"id":815,"date":"2026-03-27T14:13:03","date_gmt":"2026-03-27T14:13:03","guid":{"rendered":"https:\/\/patterns.digital\/?post_type=work&#038;p=815"},"modified":"2026-03-30T12:37:46","modified_gmt":"2026-03-30T12:37:46","slug":"redenlab","status":"publish","type":"work","link":"https:\/\/patterns.digital\/it\/selezionati\/redenlab\/","title":{"rendered":"Redenlab"},"content":{"rendered":"<figure class=\"wp-block-video\"><video height=\"1080\" style=\"aspect-ratio: 1920 \/ 1080;\" width=\"1920\" autoplay muted src=\"https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/redenlab-logo.mp4\" playsinline><\/video><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Introduzione<\/h2>\n\n\n\n<p>Redenlab needed a powerful digital platform to manage complex clinical trial data while maintaining a consistent visual identity. The goal was to create a system that could scale across multiple neurological conditions, display multi-phase trial data, manage an expanding library of scientific publications, and maintain a cohesive design\u2014without sacrificing usability for non-technical users.<\/p>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"686\" style=\"aspect-ratio: 1280 \/ 686;\" width=\"1280\" autoplay muted src=\"https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/hero-1.mp4\" playsinline><\/video><\/figure>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Challenges &amp; Solutions<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">1. Data Architecture &amp; Content Management<\/h3>\n\n\n\n<p>Managing clinical trial pipelines across 59 neurological conditions, each with five phases, required a custom-built content architecture. We designed a flexible content system with seven custom post types (Indications, Pipeline Summaries, Publications, Partners, People, Solutions, Stories), making it easy for the research team to update information\u2014much like writing a blog post\u2014while keeping everything structured and reliable. The pipeline summary system tracks publications with auto-extracted metadata from DOI and PubMed, ensuring real-time accuracy.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1684\" src=\"https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-scaled.jpg\" alt=\"\" class=\"wp-image-832\" srcset=\"https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-scaled.jpg 2560w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-300x197.jpg 300w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-1024x673.jpg 1024w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-768x505.jpg 768w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-1536x1010.jpg 1536w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-2048x1347.jpg 2048w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/publications-1-18x12.jpg 18w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">2. Data Visualization &amp; Interactive Pipeline Table<\/h3>\n\n\n\n<p>Researchers needed an efficient way to compare trial progress across all conditions. We created an interactive, searchable, and sortable pipeline table that displays live data for all 59 conditions. The table is fully responsive, with sticky headers and real-time filtering, transforming what would traditionally be a static spreadsheet into a dynamic research tool that works seamlessly on any device.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">3. Design Consistency &amp; Visual Identity<\/h3>\n\n\n\n<p>Redenlab\u2019s platform needed to reflect their strong visual identity while maintaining a flexible design system. We built a token-based design system with 240 CSS variables to standardize colors, typography, spacing, and radii. From animated feature cards to duotone image effects, this ensured pixel-perfect consistency while still allowing room for creative flexibility. We also delivered a web-based style guide, enabling the client\u2019s IT team to extend the brand seamlessly across other digital products.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1707\" src=\"https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-scaled.png\" alt=\"\" class=\"wp-image-829\" srcset=\"https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-scaled.png 2560w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-300x200.png 300w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-1024x683.png 1024w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-768x512.png 768w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-1536x1024.png 1536w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-2048x1365.png 2048w, https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/design-system-18x12.png 18w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">4. Performance &amp; Animation Optimization<\/h3>\n\n\n\n<p>The platform features scroll-triggered animations, parallax effects, animated counters, and video backgrounds\u2014powered by a self-hosted GSAP framework. Every animation respects the user\u2019s accessibility preferences, with motion reduced when necessary. Asset loading is optimized: pipeline CSS loads only when needed, and animations trigger on scroll events, ensuring the platform runs smoothly and achieves optimal page load performance (LCP scores).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">5. Content Autonomy &amp; Editorial Workflow<\/h3>\n\n\n\n<p>Instead of locking content into a visual builder, we created a hybrid system. Bricks Builder controls the layout and templates, while Gutenberg handles the editorial content. This separation allows the research team to publish news, update publications, and manage team profiles without the risk of breaking the design system\u2014ensuring their focus stays on science, not web development.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">6. Discoverability &amp; Research Access<\/h3>\n\n\n\n<p>We implemented a powerful search feature with global site search modal, grouping results across nine content types, and allowing for easy keyboard navigation and instant filtering. Additionally, a publication tag search with autocomplete enables researchers to filter the expanding library by topic. A unified content feed combines news, events, and publications, making it easier to discover relevant research\u2014all in real-time and client-side for a smooth experience.<\/p>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"720\" style=\"aspect-ratio: 1120 \/ 720;\" width=\"1120\" autoplay muted src=\"https:\/\/patterns.digital\/wp-content\/uploads\/2026\/03\/CleanShot-2026-03-27-at-14.59.10.mp4\" playsinline><\/video><\/figure>\n\n\n\n<div style=\"height:48px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n\n<iframe loading=\"lazy\" src=\"https:\/\/www.linkedin.com\/embed\/feed\/update\/urn:li:ugcPost:7441961240207237121\" height=\"718\" width=\"504\" frameborder=\"0\" allowfullscreen=\"\" title=\"Embedded post\"><\/iframe>\n\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h2 class=\"wp-block-heading\">Conclusioni<\/h2>\n\n\n\n<p>The Redenlab platform is a prime example of how a well-thought-out content architecture and a robust design system can transform complex scientific data into an accessible, engaging user experience. With seven custom content types, a 240-variable design token system, interactive data visualizations, and a detailed style guide for cross-product brand consistency, the platform is built to scale alongside Redenlab\u2019s expanding research portfolio.<\/p>\n\n\n\n<p>What started as a website project has evolved into a full digital infrastructure for a neuroscience research company\u2014empowering their team to manage clinical data independently while ensuring the visual precision their stakeholders expect.<\/p>\n<\/div>\n<\/div>\n\n\n\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>Redenlab is a neuroscience research company specialising in digital speech biomarkers \u2014 objective measurement of communication abilities for clinical trials across 59 neurological conditions<\/p>","protected":false},"featured_media":821,"template":"","class_list":["post-815","work","type-work","status-publish","has-post-thumbnail","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/patterns.digital\/it\/wp-json\/wp\/v2\/work\/815","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/patterns.digital\/it\/wp-json\/wp\/v2\/work"}],"about":[{"href":"https:\/\/patterns.digital\/it\/wp-json\/wp\/v2\/types\/work"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/patterns.digital\/it\/wp-json\/wp\/v2\/media\/821"}],"wp:attachment":[{"href":"https:\/\/patterns.digital\/it\/wp-json\/wp\/v2\/media?parent=815"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}