Cybersecurity Capability Overview
The UI excels in its clear, concise messaging and well-structured information hierarchy that supports quick understanding of complex cybersecurity services. However, the predominantly dark color scheme with light text may reduce readability for some users, and the dense text blocks could benefit from more visual breaks or interactive elements to improve engagement.
Public
Design Score
Polish Opportunities
Design Perspectives
0To Review
Recommended Fixes by Impact
0Total
Fixes by Category
4
Color & Contrast4
Content Readability & Clarity3
Visual Consistency, Imagery & Media1
Navigation & Structure2
Conversion & Actions3
Tone, Friendliness & Delight4
Accessibility & Input Ergonomics4
Efficiency & Cognitive Load4
Flow & States Completeness2
Strategic DesignRecommended Fixes by Impact
0Critical
2Major
22Moderate
8Minor
Lack of clear navigation active state or page highlight
Major
Orientation Missing (Environment/Role/Location)
The Problem
The top navigation bar does not visibly indicate the current page or active section. The breadcrumb exists, but the main nav menu items lack active state highlighting, making it unclear where the user is within the site.
Why it Matters
Users cannot easily determine their current location within the site, which can cause confusion and reduce confidence in navigation.
How to Fix
Add a distinctive active or highlighted state in the top navigation menu for the current page or section. Ensure the breadcrumb also has clickable links consistent with nav context.
Issue Highlights
Overconfident Speed Claims Risk Credibility
Major
Tone, Friendliness & Delight
The Problem
Phrases like 'attacks move in minutes. we’re faster.' and 'isolate threats globally in under 15 minutes' make strong performance claims without visible disclaimers or evidence.
Why it Matters
Overpromising speed and effectiveness can reduce trust if customers experience slower response times or issues not covered by the text.
How to Fix
Soften claims with language indicating best effort or typical outcomes, or add disclaimers and evidence links to support claims.
Issue Highlights
Low contrast of small gray body text below headline
Moderate
Color & Contrast
The Problem
The body text below the headline uses small gray text on a navy background, resulting in low contrast that likely fails WCAG AA for normal text.
Why it Matters
This makes reading longer descriptions difficult for users with visual impairments or in low lighting, reducing comprehension and accessibility.
How to Fix
Use a lighter grayscale shade closer to white or increase the font weight to improve contrast and meet WCAG AA standards.
Issue Highlights
Secondary text blocks and their headers misaligned across columns
Moderate
Visual Consistency, Imagery & Media
The Problem
The sections titled "THE CHALLENGE & SOLUTION" and "THE PLATFORM IP" on the left and "WHAT'S INCLUDED IN THIS CAPABILITY" on the right have text blocks that do not align uniformly with each other horizontally. This affects the readability and breaks visual harmony.
Why it Matters
Misalignment causes the interface to appear less polished and increases cognitive load by making it harder for users to scan and compare information across columns quickly.
How to Fix
Adjust the horizontal padding or margin of these text blocks to align their left edges consistently. Use a grid system or alignment guides to ensure uniform column starting points.
Issue Highlights
Primary CTA 'Book a demo' is undersized and lacks visual emphasis
Moderate
Conversion & Actions
The Problem
The primary CTA button labeled 'Book a demo' is small in size and uses a relatively low-contrast orange color on a dark blue background, which reduces its visibility and immediate impact.
Why it Matters
Users may overlook or hesitate to click the primary CTA due to its low prominence, reducing conversion rates for demo requests.
How to Fix
Increase the button size, use a higher contrast color combination, and add whitespace around to make the CTA stand out more prominently on the page.
Issue Highlights
Low contrast of small gray navigation breadcrumb text
Moderate
Color & Contrast
The Problem
The small breadcrumb text 'HOME > CAPABILITIES > SOC / MDR' uses a gray color on a dark blue background which appears to have low contrast, likely below WCAG AA for normal text.
Why it Matters
Users with low vision or color blindness may struggle to read this navigation aid, hindering their ability to understand their location within the site.
How to Fix
Increase the contrast by using a lighter or whiter text color or darkening the background behind this breadcrumb text to meet at least 4.5:1 contrast ratio.
Issue Highlights
Low contrast of small gray footer copyright text
Moderate
Color & Contrast
The Problem
The copyright text at the bottom left footer is small and light gray on a dark background, causing insufficient contrast and readability issues.
Why it Matters
Poor contrast here can prevent users from reading important legal information or copyright details.
How to Fix
Increase the text color brightness or use a slightly larger and bolder font to improve contrast against the dark background.
Issue Highlights
Low contrast of small gray footer navigation links
Moderate
Color & Contrast
The Problem
The footer navigation links under PLATFORM, CAPABILITIES, INDUSTRIES, and COMPANY are small and gray, resulting in low contrast on the dark background, likely below WCAG AA.
Why it Matters
Users with low vision or color deficiency may have difficulty distinguishing navigation links, impeding site usability and navigation.
How to Fix
Increase the brightness of the text color, add underline or bold to links, or lighten the background behind these links to improve contrast.
Issue Highlights
Weak hierarchy for capability features list
Moderate
Content Readability & Clarity
The Problem
The section listing capabilities ('CONTINUOUS MONITORING', 'DETECTION & TRIAGE', etc.) uses all caps and similar font weights with minimal size or color contrast, making it hard to visually separate headings from subtext and scan the content quickly.
Why it Matters
Users may struggle to quickly grasp and differentiate between various capabilities, reducing comprehension and engagement.
How to Fix
Increase font size or weight contrast between headings and descriptions, add spacing or use a different color or style to establish clear visual groupings and hierarchy.
Issue Highlights
Right-hand metrics block aligned differently from main left heading block
Moderate
Visual Consistency, Imagery & Media
The Problem
The vertical metrics block on the top right (showing 24/7, <15 MIN, 99.98%, IT+OT) is positioned far right and does not line up horizontally with the main headline block on the left, visually disconnecting the sections.
Why it Matters
Inconsistent horizontal alignment can create fragmented reading flow and a less cohesive visual hierarchy, leading to increased user effort to relate the information.
How to Fix
Bring the metrics block leftward so it aligns along a common vertical grid line with the left headline or create a clear dividing line to separate areas distinctly.
Issue Highlights
Small tap targets for 'Explore HexaSOC' and 'Explore HexaView' links
Moderate
Accessibility & Input Ergonomics
The Problem
'Explore HexaSOC' and 'Explore HexaView' buttons appear small with thin border outlines, likely sized below the recommended minimum touch target area (48x48dp).
Why it Matters
Small tap targets increase difficulty for users to accurately tap, especially on touchscreens, leading to potential user frustration and input errors.
How to Fix
Increase the size of these buttons to meet or exceed minimum recommended touch sizes and add sufficient padding around text to enhance tappability.
Issue Highlights
Small 'Book a demo' button on top and bottom
Moderate
Accessibility & Input Ergonomics
The Problem
'Book a demo' call-to-action buttons on the page appear relatively small with limited vertical and horizontal padding, possibly below comfortable touch target dimensions.
Why it Matters
Small buttons force users to precisely tap a small area, which can hinder usability on touch devices, especially for users with motor impairments.
How to Fix
Increase padding around the text inside these buttons to create a larger tap area, helping users easily activate the button.
Issue Highlights
Multiple call-to-action buttons with similar intent
Moderate
Efficiency & Cognitive Load
The Problem
The page features multiple 'Book a demo' buttons and additional 'Explore HexaSOC' and 'Explore HexaView' buttons that could lead to fragmented user journeys and extra steps.
Why it Matters
Having many calls-to-action with overlapping purposes can increase user decision time, causing hesitation and greater cognitive load.
How to Fix
Consolidate primary actions by prioritizing a single, clear call-to-action or visually distinguishing them to clarify their different outcomes.
Issue Highlights
Primary call to action placement and clarity
Moderate
Flow & States Completeness
The Problem
The 'Book a demo' button is present but visually separated from the main headline, and there is no indication of what happens after clicking it, which might confuse users about the next step.
Why it Matters
Users may hesitate or be uncertain about how to proceed, potentially causing drop-off before engagement.
How to Fix
Position the call to action closer to the main content or headline, and add a brief indication or tooltip about what booking a demo entails.
Issue Highlights
Body text under headings appears too small
Moderate
Content Readability & Clarity
The Problem
Smaller body text paragraphs under headings (e.g. under 'ATTACKERS MOVE IN MINUTES. WE'RE FASTER.' and 'HEXASOC + HEXAVIEW') appear small and may be difficult to read comfortably, especially on large screens or for users with weaker vision.
Why it Matters
Small text size reduces readability, increases user fatigue, and risks users missing important service details.
How to Fix
Increase the font size of body text to at least 16px or equivalent relative size for improved legibility.
Issue Highlights
Dense footer navigation with small font size and multiple links
Moderate
Navigation & Structure
The Problem
The footer contains four columns of dense text links in small font sizes, which can be overwhelming and difficult to scan or tap, especially on smaller screens or for users with reduced dexterity.
Why it Matters
Cluttered navigation can impede users from quickly finding relevant links, increasing cognitive load and frustration.
How to Fix
Group similar links into fewer categories or collapsible sections and increase spacing and font size for better readability and tap targets.
Issue Highlights
Close spacing between 'Explore HexaSOC' and 'Explore HexaView' links
Moderate
Accessibility & Input Ergonomics
The Problem
'Explore HexaSOC' and 'Explore HexaView' buttons are spaced closely horizontally, likely less than recommended minimum 8-10 pixels gap, which may cause accidental taps on the wrong target.
Why it Matters
Insufficient spacing between touch targets increases the chance of users tapping the wrong control, reducing usability and causing frustration.
How to Fix
Increase horizontal spacing between these two clickable elements to provide a clear separation and reduce risk of erroneous taps.
Issue Highlights
Too many capability and feature links competing at once
Moderate
Efficiency & Cognitive Load
The Problem
The right side list under 'IN THIS CAPABILITY' and the multiple detailed explanations below create many simultaneous decisions without clear prioritization.
Why it Matters
Users may feel overwhelmed deciding what to explore next, risking frustration or abandonment due to scattered attention.
How to Fix
Use progressive disclosure or group related features under expandable sections to reduce the number of choices visible initially.
Issue Highlights
Primary CTA 'Book a demo' Button Lacks Prominence
Moderate
Strategic Design
The Problem
The 'Book a demo' button is relatively small and placed in a position with much whitespace around it, causing it to be visually easy to overlook especially compared to the text-heavy left side.
Why it Matters
Users seeking to take immediate action might struggle to quickly identify the primary conversion opportunity, potentially lowering conversion rates.
How to Fix
Increase the button size, position it closer to the headline or key stats, and possibly use a more contrasting color or design to draw immediate attention.
Issue Highlights
Lacks Trust Signals Near 'Book a demo' Button
Moderate
Tone, Friendliness & Delight
The Problem
The prominent 'Book a demo' button near the top and mid of the page lacks nearby trust signals or reassurances regarding data privacy or no obligation.
Why it Matters
Users may hesitate to engage with demo requests without clear trust signals about what happens with their data or what to expect.
How to Fix
Add short privacy reassurance or no-obligation text near the button to increase user confidence in clicking.
Issue Highlights
Dense text blocks without visual hierarchy
Moderate
Efficiency & Cognitive Load
The Problem
Several text paragraphs and lists are densely packed with small fonts and minimal spacing, contributing to visual clutter and difficulty scanning content.
Why it Matters
Users might struggle to quickly find key information, increasing mental effort and reducing engagement.
How to Fix
Improve spacing, use bullet points or icons, and enhance headings' prominence to create clearer visual grouping.
Issue Highlights
Lack of visible interactive elements for detailed exploration
Moderate
Flow & States Completeness
The Problem
Aside from the few call to action buttons, there are multiple informational sections and features described that do not have corresponding interactive controls to explore or learn more about them.
Why it Matters
Users interested in specific features or sections might feel stuck or unable to obtain deeper information directly from this screen.
How to Fix
Add clear links or buttons associated with each feature or section to encourage user engagement and exploration.
Issue Highlights
Lack of Strong Visual Differentiation for Key Value Proposition
Moderate
Strategic Design
The Problem
The headline and key stats are clearly visible but the overall visual hierarchy is subdued with similar fonts and colors blending into the dark background, leading to a lack of a memorable visual anchor or differentiation.
Why it Matters
Users may not quickly grasp the unique selling points or feel a strong impression of the product's distinct advantages, reducing engagement and recall.
How to Fix
Introduce stronger visual and color contrast for key messages, use distinctive typography or icons for statistics, and add a memorable graphic or visual element tied to the core offering.
Issue Highlights
Absence of indication for loading, error, or success states
Moderate
Flow & States Completeness
The Problem
The screen shows a fully loaded informational page but does not provide any visible cues or placeholders for what happens during loading, errors, or after form submission (e.g., demo booking).
Why it Matters
Users may be disoriented in case of slow loading or errors without any feedback, increasing frustration and abandonment risks.
How to Fix
Incorporate design and messaging for loading animations, error alerts, and success confirmations especially tied to the 'Book a demo' and exploration actions.
Issue Highlights
Button label 'Book a demo' lacks emphasis
Minor
Content Readability & Clarity
The Problem
The call-to-action button text 'Book a demo' is small and does not strongly stand out compared to surrounding text or background, limiting its visual prominence.
Why it Matters
Poor emphasis on the CTA can reduce user clicks and conversion rates.
How to Fix
Increase font size, weight, or contrast of button text to ensure it stands out clearly from the background and surrounding elements.
Issue Highlights
Vague CTA label 'Book a demo' lacks differentiation or supporting CTAs
Minor
Conversion & Actions
The Problem
The CTA 'Book a demo' is the sole call to action and uses generic wording without additional supporting CTAs or alternative actions to guide users with different intents.
Why it Matters
Some users may look for more tailored options or secondary CTAs such as 'Contact us' or 'Learn more' which could improve engagement for various user needs.
How to Fix
Add alternative CTAs or supporting links that provide pathways for users who want more information before commitment, and consider making the CTA label more descriptive such as 'Schedule a live demo'.
Issue Highlights
Breadcrumb path lacks prominence and clarity
Minor
Content Readability & Clarity
The Problem
The breadcrumb navigation text 'HOME > CAPABILITIES > SOC / MDR' is quite small and low contrast, making it less visible and harder to use as a navigation reference.
Why it Matters
Users may not recognize their location within the site hierarchy easily, impacting navigation and user orientation.
How to Fix
Increase font size and contrast and consider clearer separators for improved visibility and clarity.
Issue Highlights
Button style inconsistent in top call-to-action versus footer
Minor
Visual Consistency, Imagery & Media
The Problem
The 'Book a demo' button in the hero area uses an orange filled style with rounded edges, but the same button in the footer uses a minimal outlined style, causing inconsistency in call-to-action presentation.
Why it Matters
Consistent button styling helps users recognize clickable actions and maintains a professional visual identity.
How to Fix
Use a consistent button style for all key calls-to-action, either all filled or all outlined, with uniform shapes and colors.
Issue Highlights
Small 'Client Login' button top right
Minor
Accessibility & Input Ergonomics
The Problem
'Client Login' button in the top right corner is small, with tight horizontal and vertical padding less than recommended for touch targets.
Why it Matters
Smaller tap targets increase difficulty for users to activate the control, especially on mobile or touch devices.
How to Fix
Expand the button padding or size to at least 44x44 pixels recommended for touch targets.
Issue Highlights
Multiple call to actions with no clear hierarchy
Minor
Flow & States Completeness
The Problem
There are multiple 'Book a demo' buttons visible on the screen, including one at top-right and two in content sections, but no clear indication which should be prioritized or what the difference is between them.
Why it Matters
Users may be confused about the correct action to take or perceive the interface as cluttered, reducing conversion likelihood.
How to Fix
Consolidate call to actions or clearly define their purpose and hierarchy in the design.
Issue Highlights
Serious Topic but Visual Tone Too Generic and Cool
Minor
Tone, Friendliness & Delight
The Problem
The cool blue gradient tone and minimalist style may underplay the emotional impact of cybersecurity urgency and threat detection.
Why it Matters
Visual tone influences user trust and emotional connection; a more urgent or humanized tone could better resonate with users facing security risks.
How to Fix
Incorporate warmer accent colors, subtle warnings, or human-centered imagery to enhance emotional fit without sacrificing professionalism.
Issue Highlights
Users must remember service acronyms and terminology without immediate explanations
Minor
Efficiency & Cognitive Load
The Problem
Terms like 'SOC', 'MDR', 'HexaSOC', and 'HexaView' appear frequently but lack immediate contextual help or definitions near their mention.
Why it Matters
New users unfamiliar with these acronyms might need to recall prior knowledge or navigate elsewhere, increasing cognitive load.
How to Fix
Add tooltip explanations or brief defining text inline or on hover for specialized terminology.
Issue Highlights