Project: NEXTDC
Project: NEXTDC
#UX #UI #B2B #TECH #DATA CENTRE
Redesigning the NEXTDC website meant crafting a digital presence that reflected its stature as a data centre engineering and design leader.
Our challenge was to align their online experience with their industry expertise and premium brand. The results were impactful with an 82% increase in conversions and a marked rise in user engagement, demonstrating the power of a thoughtful, expertly executed digital transformation.
Role:
UX/UI designer
Key Deliverables:
UX Research and discovery, competitor analysis, analytic analysis, creating user personas, card sorting, sitemap creation, low-fidelity wireframing and high-fidelity UI.
Date & Duration:
2022/2023 - 5 months from start to go live
Tools used:
XD, Illustrator, Photoshop, InDesign, Mural, Google Analytics & Hotjar
Teammates:
Project Manager, Creative Director, Content Writer and Developer
The Challenge
As a renowned leader in data centre engineering and design, NEXTDC’s website did not reflect this. The website was complex, difficult-to-find content and had disconnected journeys for the user. Our challenge was to align their online experience with their industry expertise and premium brand.
The Goal
Our overall primary goals for the first phase of the website were:
Streamline and improve the information architecture for an intuitive user experience
Modernise the designs to a premium standard
Improve reporting and visibility of marketing efforts to enable a continual test and learn environment
Migrate the existing site to a more advanced CMS
How does the NEXTDC experience stack up to others in market in right now?
Equinix
Observations:
Strengths: Expandable predictive search, clear sticky breadcrumbs for easy navigation, and a sticky call-to-action button enhance usability while engaging videos add some visual appeal (though buried).
Weaknesses: Poor use of above-the-fold space, overly long line lengths, text-heavy design with insufficient imagery, small fonts, and accessibility issues with contrast and legibility.
Areas for Improvement: Add dropdown indicators, micro-interactions, and animations to increase engagement, address broken partner logos, and incorporate more visually engaging elements to balance the heavy text.
Macquarie Data Centres
Observations:
Strengths: Engaging video featuring a former prime minister builds trust, a mega menu with descriptions and visible secondary navigation simplifies exploration, and well-structured content hierarchy makes information easy to digest.
Weaknesses: The burger menu on scroll adds unnecessary complexity, data diagrams are too small to interpret effectively, and forms fail to follow best practices, creating usability challenges for users.
Areas for Improvement: Simplify navigation by removing redundant menus, redesign diagrams for readability, and optimize forms by using clear labels, single-column layouts, and task-specific action buttons for better user experience.
Fujitsu Data Centre
Observations:
Strengths: Distinct branded imagery, engaging video with dynamic overlays and drone footage, and excellent use of imagery to break up text, complemented by an accessible, user-friendly sticky accessibility menu.
Weaknesses: Long, cumbersome forms hinder conversions, and videos redirecting users off the landing page disrupt the user experience.
Areas for Improvement: Simplify forms to improve completion rates and ensure videos play inline to maintain user engagement on the landing page.
Competitor sitemap review
Observations:
Commonly used labels under "About Us" include sections like Overview, Why, Sustainability, Leadership, Newsroom, Events, Partner Program, Careers, Investors, Blog, Contact Us, and Security.
Key themes include showcasing leadership through global keynote presentations, promoting social responsibility initiatives such as community building and economic diversification, and highlighting services like the Equinix Messaging Gateway, which allows direct company connections but is currently under-promoted on the website.
Exploring Data to Reveal Hidden Patterns
Conducting a thorough analysis of the website's current analytics is essential to establish benchmarks for redesign efforts and identify areas for improvement.
Key Insights:
Desktop remains the dominant device for accessing the site, but mobile traffic is significant and should not be overlooked.
Users are primarily drawn to colocation and data centre services, as well as career opportunities, indicating the need to emphasise these areas.
Users are drawn to concise, visual content (e.g., benefits sections and stats) but avoid large text blocks, suggesting a need for better text segmentation and layout.
Carousels perform effectively on both mobile and desktop platforms, supporting their continued use.
Takeaway: Conducting the first phase of the discovery has highlighted the importance for visually engaging content to capture user attention and stand out from competitors. Optimised forms and intuitive navigation is important to enhance user conversion and allow users to freely navigate the site.
Key Insights: Both users prioritise trust and credibility, with a focus on certifications, awards, and thought leadership content to validate NEXTDC's reliability. While The Visionary Leader seeks high-level insights to guide decisions, The Strategic Implementer dives into more detailed technical content.
Streamlining Navigation: Building an Intuitive Sitemap
Given the complexity and disconnected user journeys of the previous site, designing an intuitive navigation structure was a top priority. To create an effective sitemap, we utilised insights from Google Analytics, Hotjar heatmaps, common labelling and structuring from competitors and a card-sorting exercise with a few stakeholders and clients. An intensive in-person workshop facilitated open discussions among stakeholders and team members, enabling us to identify key issues and collaboratively refine the site's structure.
Data-Driven Decisions Behind the Structure
Data Centres now lead the navigation due to their popularity, with locations ordered by user engagement rather than geography.
Ecosystems have been segmented by user type for tailored content, while Interconnectivity has been separated to emphasise its significance.
Resources and About Us sections have been streamlined and consolidated to reduce clicks.
Contact Us has been moved to a prominent position to enhance visibility and engagement.
Designing Flexible Templates for Seamless Content Migration
During phase 1 of the design phase, our main objective was to develop five adaptable templates that would support the seamless migration of the entire website to a new platform. We focused on creating clear and scannable content by incorporating intuitive headings, subheadings, iconography, and concise body copy, enabling users to quickly find the information they need.
Streamlining a Centralised Data Centre Overview
A key aspect of this process was designing a section that provided a comprehensive overview of all the data centres. By addressing user pain points identified through Hotjar recordings, we eliminated the need for back-and-forth navigation, streamlining the user experience and enhancing browsing efficiency.
Elevating Brand Identity with a Modern Touch
Our goal with the UI was to maintain the core brand identity while elevating and modernizing the overall visual experience. We had the creative freedom to enhance key elements, including colour schemes, iconography, videos, and animations.
To establish a distinctive and premium brand presence, we opted for a dark theme, setting the website apart from competitors and evoking a sense of sophistication and grandeur (though check out my exploration of light mixed with dark theme, dark theme and light theme ). The integration of videos, animations, and interactive elements played a pivotal role in creating an engaging experience, ensuring that the content was both visually captivating and easy to read.
The stakeholder feedback on the redesigned has been highly positive. The website now reflects the brand’s premium image while supporting growth with a robust digital marketing function. The business can track performance across activities and leverage real-time engagement insights to improve lead generation through personalised user journeys. Six months after launch, key results include:
82% increase in conversions
50% improvement in page performance
+42% increase in session duration
20% improvement in page views
34% increase in average engaged time
What Went Well
Designs backed by data and rationale:
This project reminded me how important it is to always rationalise designs backed by data and best practices along the way, which will help gain understanding and approval from important stakeholders.
What Could Be Improved
Time constraints required prioritization, but limitations arose:
From the outset, I recognised the time constraints associated with the first phase of the project. This necessitated careful prioritisation and milestone achievement. However, the absence of user interviews, validation of information architecture with users, and usability testing posed certain limitations.
Say hello!
I am always keen to collaborate, to make new connections or just a good old chinwag.