LUCENT
Biopharma

LUCENT Biopharma had new brand guidelines and a website that did nothing with them. They needed a site that demonstrated their expertise in the field, and the existing one demonstrated neither: the science sat at the same level as everything else, and the services behind it were hard to find at all.

Research backed that up fast. Potential clients were tired of biopharma sites that led with dense science and said little about what was actually on offer. Internally, the same problem showed up as maintenance: the pipeline table hadn't been updated in nine months, because updating it meant going through a developer.

I ran a full UX audit and wrote it up as a formal report, mapping user pain points against data-driven recommendations for how the site should work. Stakeholder interviews across science, commercial and leadership ran alongside an audit of five comparable biopharma sites: the competitor work gave me a vocabulary the sector already understands, and the interviews told me which questions each audience shows up with.

Three personas came out of it: investor, clinical partner and prospective hire, each given a defined route through the site before any visual work started.

Every build decision traced back to the same research finding: visitors want their first question answered fast, and each persona's question was different. That shaped everything from layout to iconography.

Services, employees and Insights (the blog) were consolidated into Webflow CMS collections, with a custom filter, tabs and pagination on Insights, so a visitor finds the right service or article in one step rather than scrolling a long list. The pipeline became a CMS collection too, carrying stage, indication, modality and last reviewed date, so the science team updates trial data themselves instead of raising a ticket for it.

Each service page needed its own hero, since a generic template couldn't hold what made each service distinct, so those were custom built rather than pulled from a shared component. That same logic ruled out reusable cards across the site: content varied enough page to page that forcing it into one component would have flattened exactly the differences the personas needed to see. Custom card flip animations, built in JavaScript, HTML and CSS, let services and team members reveal detail on demand without adding another page to click through.

A complex grid layout and multiple custom breakpoints, matched precisely to the graphic designer's hi-fi wireframes, kept the design coherent from investor-desk widescreens down to mobile.

Every page also got a fully separate mobile design rather than a scaled-down desktop layout, so the experience holds up regardless of screen size, in line with the research finding that a broken or awkward mobile view undermines the credibility a biopharma site depends on.

On the About Us page, a custom-coded accordion handles the team section on mobile, keeping a large team browsable without overwhelming a small screen.

Iconography was designed to carry meaning at a glance, cutting down on the dense scientific text the research flagged as a turn-off.

Conditional visibility on team photos and blog cover images meant the layout holds together whether or not that content exists yet, so an unpublished bio or missing image never leaves a visible gap. Blog post categories were colour-coded, giving Insights a visual shorthand for the kind of content on offer before a visitor reads a single headline.

Image optimisation, schema markup, and meta titles and descriptions were handled site-wide, so what a visitor finds through search matches what's actually on the page. HubSpot and Google Analytics were integrated so LUCENT Biopharma could track enquiries and traffic themselves, without depending on a developer to check.

A formal UX report was handed over, and the LUCENT Biopharma team were trained to manage the site themselves. Two client seats were migrated with a written maintenance doc, so editors can add a trial, a service or a paper without opening a support ticket.