Biopharma Web Design for Clinical Stage Biotech

Skin disease-focused clinical-stage biopharmaceutical gets a website makeover.

Website project overview



Website Design

There’s fast. Then there’s biopharma startup fast.

As a biopharma founder, you move quickly, ping-ponging from task to task, putting out fires in your quest to bring a new breakthrough therapy to market.

But for Nick France, the founder of Dermelix, fast took on a new meaning. He moved so quickly that within to weeks we manifested his vision and launched an initial website landing page. All so Dermelix – with a novel antenatal protein replacement therapy to treat Netherton Syndrome which affects ~100 babies worldwide a year – would have a website for World Rare Diseases Day.

Then he vanished – off to found another startup – replaced by a new CEO who’d flesh out the rest of the five-page starter site over the ensuing 10 weeks.

Web Design

“If you don’t have a website, you don’t exist.”

That’s what Nick said in our kickoff meeting.

And all he had at that time was a logo and a pitch deck. So, the clear and obvious challenge was to get a website up and running really fast. And within a few days, a landing page was created and launched. 

After that fire was extinguished, we had time to dig into the science and pull out what made Dermelix unique to potential investors. Dermelix is focused on delivering innovative treatments to patients suffering from rare genetic skin diseases with no currently available corrective treatments.

But what made Dermelix unique is they had an ethical charter and integrated patient access and advocacy from the very beginning. So, unlike other biopharmas, it was important to explain the science in a way that both scientists and patients could understand.

Any scientist can make an accurate website – but nobody wants to stay on it very long. A designer can create a website that’s beautiful, compelling and persuasive.

Web Design

Dermelix needed their new website to accomplish two objectives:

First and foremost, site visitors need to know they’re in the right place. And since Dermelix is focused on Netherton Syndrome, the primary image is one of perspiration. This isn’t by accident. In a nanosecond, anyone can see the perspiration on the skin in the main image of the website.

But what’s the secret to making complex scientific information easy to understand? It all has to do with breaking content into chunks. 

If the home page of your bitoech website has paragraph after paragraph of text about your science, you’re going to come across more like a research paper than a website. Everyone of us spends countless hours online, so we tend to tune out sites that are dense with text. This is known as cognitive overload.

By breaking up the text on the Dermelix website into headlines, sub-headlines and graphics, information is easier to scan. And it’s by carefully balancing the font sizes and weights and white space that the site visitor is presented with a more attractive and graceful presentation of your message.

biopharma web design SNAtm graphic on a tablet

And then there’s the beauty of science.

For a pharmaceutical company to truly stand out, it needs to show the inner beauty of its novel science. In this case, the close up of skin perspiring, combined with a gentle gradient and faint hexagon pattern show a thoughtful combination of science and art.

And throughout the site, the hexagon motif is repeated or slightly varied to reinforce the shape of the Dermelix logo – a very subtle way to creatively reinforce its brand. 

Stellar designs websites for biopharma startups seeking their first round of funding. Learn more about how we can help you express the beauty of your novel science with a quick landing page or website.

Need help with your biopharma web design project?

Sweat is Sweet

Skin diseases look like rashes. Nobody wants to look at rashes, especially baby rashes. So, instead of showing rashes, the decision was to show perspiration which isn’t gross. 

Figure out a way to make your science less gross and more cool.

Tiny is Huge

You’ve seen them. They’re quite common. Their job is to arrest attention as soon as possible. A few animated numbers can crystallize your message in a nanosecond. When they’re in a huge font size they have a big impact, even if the statistical amount is very small.

Every biotech should be able to distill their science to a few impactful numbers. Are you?

Icon Row

Your site visitors are smart, but they’re in a hurry. A row of icons with a sentence of clarification text and a link below is a super efficient way to guide your site visitors to the information they’re seeking.

Don’t confuse being brief with ‘dumbing down’ content.

Shape Harmony

The shape of your logo is important. One way to reinforce your brand is by repeating its shape – in this case a hexagon – throughout your site. By using the shape in a variety of ways, you can create a playful and memorable visual harmony.

Use your logo’s shape as a visual motif to make your brand distinct and less generic.

Nitty Gritty

Real photos of real people and real places. If you are at the stage where you’re looking to hire employees, it’s a must to show your culture. And with smartphones, it’s pretty easy to do. You just have to overcome your fear of being a “real” photographer.

Overcome your inner wallflower and start grabbing pics that show off your biotech’s culture.

Child Spokesmodels

Children and puppies are tremendously engaging. In this case, we have a rare skin disease that affects children. By using pics of children, it expresses your commitment to the patients you serve and creates an emotional response in site visitors.

Don’t be afraid to get attention by using pics of people instead of your science 

biopharma website pipeline chart for clinical stage CNS
Hexa Pipeline

Pipelines summarize the stage of your asset development. Instead of a bar chart with long skinny rectangles, how about using a different shape? Or using your brand colors by overlapping shapes?

Shape is a simple way to reinforce your brand and stand out in order to trigger an inquiry.

Hexa Graphics

Most graphics scientists come up with are clunky. Here, Dermelix’s scientific data is simply converted into hexagonal shapes using the websites color palette. The result is crisp, precise and thematic – two words that are awesome when they’re associated with your brand.

The right shape can separate you in the market.

Color Changer

What is your brand’s primary color? If it’s muted or dull, you might want to think about adding some punch. Bright colors enliven a dumpy brand and can makes your biotech more attractive to investors and employees. 

Think about it: a livelier brand palette can add a jolt of positivity to your brand.