Case Study
Gradient Cyber's website with scientific design
Deddy I
Nov 5, 2024
Hey there! Clarity is the foundation of high-impact design. If people understand what you're saying, they'll believe you can do it. Today, I’ll walk you through my redesign of a cyber security service's landing page. You'll find 8 high-impact design features at the bottom.
Let's dive in.
Before
I found 8 notable issues on Gradient Cyber's website:
1) Vague Hero Title
The headline should convey the unique value proposition.
2) Low-Contrast CTA
The main button style should stand out from the background.
3) Ineffective Hero Visual
Hero video/image should support the headline & value prop.
4) Missing Social Proof
The product's reliability & quality should be supported with social proof to reinforce user trust.
5) Long, Wide Text Blocks
Sections with high cognitive load should be broken up to help with comprehension.
6) Inconsistent Button Styles
Buttons with the same functionality should be matched so not to confuse users.
7) Low-Quality Graphic Assets
Graphics should be high-resolution to improve the perceived quality of the website.
8) Insufficient Visual Hierarchy
Page hierarchy should be clarified between the visuals, headline, & sub-headline to streamline readability.
Redesigning
Now that we understand the issues, let's get to the fun part.
After
8 features of Gradient Cyber's website that work better redesigned:
1) Compelling Title
clearly communicates the product's unique value proposition.
2) Prominent CTA
stands out against the background with adequate contrast.
3) Representative hero visual
supports the message & reinforces the product's value.
4) Credibility indicators
increase trustworthiness & user belief, leading to more conversions.
5) Skimmable text blocks
streamline the messaging & don't overload users with too much information.
6) Consistent button styles
improve user comprehension of buttons with similar functionality.
7) Simplified media presentation
reduces unnecessary noise & leads users to action by focusing on a single video.
8) Clear visual hierarchy
expedites user understanding by prioritizing between headlines & body copy.
TLDR —> 8 landing page design features that boost impact:
Compelling title
Prominent CTA
Representative hero visual
Credibility indicators
Skimmable text blocks
Consistent button styles
Simplified media presentation
Clear visual hierarchy
I hope these breakdowns are helpful.I'm here to help you see and understand effective design principles and practices. My goal is to inspire you (and your business) with the science of design. Design done different,
The Design Scientist
