BIOSCIAI
The digital home of BioSciAI, a University of Alberta startup engineering an AI-powered, point-of-care device designed to identify fungal pathogens from a patient sample in under an hour. A credible, investor-ready platform with a custom 3D animated hero, CMS-managed research, and the polish a deep-tech startup needs to win partners and funding.
BioSciAI is a University of Alberta startup with genuinely world-class science: an AI-powered, point-of-care device designed to identify fungal pathogens, including the deadly, multidrug-resistant C. auris, from a patient sample in under an hour, where conventional lab methods take days. Founded by two PhD researchers and backed by peer-reviewed publications and an Alberta Innovates grant, they needed a website as advanced as the technology behind it. The audience is not walk-in customers. It is investors, hospital partners, grant committees, and top research talent, and the site had to earn credibility with every one of them at a glance.
We built a clean, editorial-scientific site that reads like a lab instrument crossed with a science magazine, then gave it a signature centerpiece: a custom-built 3D animation of a living fungal cell that drifts behind the hero. The entire platform runs on a headless CMS, so the founders can publish new research and team updates themselves without ever touching code.
Custom Three.js 3D hero animation a procedurally generated, biologically faithful budding fungal cell that floats behind the headline, built from scratch in WebGL rather than pulled from a stock library
Storyblok headless CMS fifteen content types powering research, publications, team, and partners, each with build-safe fallback content so the live site can never break
Five-page investor-ready platform Home, Technology, Research, Team, and Contact, architected to build credibility with investors, hospital partners, and grant committees
Mobile Experience
The full editorial-scientific design and the 3D cell hero carry across to mobile, performance-tuned so the WebGL never blocks the page load.
The Technology Story
A striking editorial technology page, "Why are we still using 20th-century methods for a 21st-century threat?", walks partners from clinical sample to species call.
Research and Credibility
Peer-reviewed publications, a 97% top accuracy figure, and Alberta Innovates funding are all surfaced to establish scientific authority.
Custom 3D Cell Animation
A bespoke Three.js WebGL scene renders a translucent, budding fungal cell with a glowing nucleus and mitochondria drifting across the hero. It fades and pauses on scroll, respects reduced-motion, and defers its own setup so it never slows the page down.
Founder-Managed Content
A Storyblok headless CMS lets the founders publish new papers, team members, and partners on their own. Every section ships with built-in fallback content, so the live site is impossible to break.
Built to Win Investors
Peer-reviewed publications, species-level accuracy tables, an explainable-AI showcase, and partner and funding logos are woven throughout to establish the scientific and institutional credibility a deep-tech raise depends on.
The centerpiece is a custom 3D animation written from scratch in Three.js. Rather than drop in a stock effect, we procedurally generated a biologically faithful budding yeast cell: a translucent teal cell wall with a noise-mapped organic surface, an emissive nucleus, a vacuole, and glowing mitochondria, lit with a filmic rig and drifting along a slow, organic path. It is deferred until after load and paused whenever it scrolls off-screen, so a heavy WebGL scene never costs a millisecond of perceived performance.
Around it sits a static Astro build wired to a Storyblok headless CMS across fifteen content types, from publications and pathogen accuracy tables to founders and advisors. Type pairs Inter with Noto Serif italic and JetBrains Mono for a precise, instrument-readout feel, and the whole site is engineered for accessibility and speed: reduced-motion support throughout, lazy-loaded imagery, structured data, and a build-safe content layer that keeps the site standing even if the CMS is empty.
EXPLORE MORE PROJECTS
Phoenix Fence
Western Canada's leading fence manufacturer, supplier and installer since 1981. A complete rebuild that consolidated 119 legacy pages into 36, with a mega menu spanning every fence system, a 183-document spec library, and a custom estimate engine that routes every lead to the right branch.
Read Case Study
TKA Custom Printing
One of our most detailed designs yet: a fully custom e-commerce platform for a 3D printing company based in Edmonton, with a hero that prints itself into place, generated layer-line textures, scroll animations that build like a 3D print, a 105-colour library, secure Helcim checkout, and a fundraising engine that sends 20% of every order to a local school or club.
Read Case Study
Green Oasis Services
A CMS-powered platform for one of Alberta's most trusted lawn care and vegetation management companies, serving residential, commercial, and industrial clients province-wide.
Read Case StudyWant Results Like These?
Get a free consultation to discuss your project. No pressure, no sales pitch, just an honest conversation about what you need and how we can help.