Overview
Dell partnered with HUGE | ATL to design, develop, and deploy 6 SecureWorks websites, beginning with the US and UK, then moving to Japan, Germany, Australia, and France.
Atlanta's UX resources were stretched thin at the time, so they asked if I could help out with the US site redesign. After doing some discovery work, we identified complexity within the navigation, information hierarchy issues, and a lack of user-centric thinking. We also developed a modular template strategy designed to be flexible and scale overtime across international markets.
Our template system enabled Secureworks to cast a wider net around their target audiences. All of the page templates were built within Sitecore, a web content management system. Sitecore's personalization features enabled dynamic content personalization Secureworks could use throughout the sites experience. Data collected from each users session would be used to elevate content relevant users in various markets. Our overarching goal was to lay a solid foundation Secureworks could utilize to develop user-centric conversion techniques with minimal effort. The design process consisted of a continues deliverable approach between the designers and the development team. This simply meant components would be developed at the end of each design sprint. Those components would be QA'd, then delivered at the end of each development sprint. The timeline to get everything ready before launch was pretty short. This staggered design/development strategy helped insure we were delivering the highest quality product as possible in the time given.
Website
www.secureworks.com
Project Date
2015
Project Type
Site Redesign
My Contributions
User Research
Strategy
Wireframes
Design
Prototypes
Challenges
We begin with a series of stakeholder interviews. Our goal was to fully understand all of the business issues surrounding the business needs, learn the organizational and creative drivers pushing the project, and grasp the overall expectations and success metrics for the engagement. By doing a content and experience audit, It was clear Secureworks expertise surpassed many of the other competitors in the industry. They offered a broad range of services, provide in-depth industry analysis, and valuable insights from thought leaders. While the audit uncovered a wealth of valuable content, it also brought forward two key problem areas.
Navigation & Information Hierarchy
The complexity of their navigation made it very hard for customers to do business online. Customers would then have to overcome multiple barriers to learn how smart Secureworks' experts are. Text overload throughout the site created a flat, burdensome content journey. Reducing some of that complexity helped
optimize the experience.
User-centric Thinking
Secureworks needed to adjust their overall marketing tactics, lead-gen strategy, and site content to be more user focused. A more user-centric approach would help the business learn how to better target their customers within specific markets and those varying needs. For example, lead-gen should be seen as an opportunity to build lasting relationships with customers, not just a form that collects names and numbers. Introducing Sitecore and it's capabilities helped the client better understand they could speak to multiple targeted audiences at once.
Additional Challenges
Our third challenge was designing within Sitecore's functionality. We recommended Secureworks invest in a content management system to improve the content personalization across all 6 sites. Sitecore is a .Net based WCMS offering dynamic content personalization and multiple testing options. It’s flexible architecture allows for iterative development, and has persona driven content capabilities. While Sitecore was a perfect solution for our clients needs, its out of the box functionality had some design limitations. We had to keep these restrictions in mind when creating components to avoid extra dev work.
Goals
We were challenged with creating a modern web experience that would accelerate the buying cycle and bring forward existing insights & expertise. To do that we needed to achieve the following goals:
- Accelerate the buying cycle by delivering the right content to the right person at the right time.
- Elevate visibility of the Dell Secureworks brand as a security leader in the industry.
- Integrate with a number of technologies to provide greater data insights and metrics.
- Deliver a responsive design that adapts to the user’s devices.
- Ensure our foundation scales with the platform for future expansion of Secureworks' international websites.
“Customers seem to be more intrigued by content that drives home education and leads with insights.”
“Connect your expertise, talent, and services to solutions that drive leads and help your customers succeed.”
Discovery
During discovery we conducted stakeholder interviews, gathered requirements, reviewed existing materials, then did a tech assessment of SecureWorks' environment. We also analyzed existing research provided by Secureworks. This included brand and positioning materials, competitive audits, audience segmentation data, and device usage metrics. Once we had a better understanding of Secureworks' pain points and technical limitations, we identified 3 key experience drivers that would address both business and user's unmet needs.
Rethink Lead-gen
Rethink lead-gen beyond the form. Lead-gen is more than names or phone numbers, it’s an opportunity to start a conversation. Secureworks needed to diversify their strategy in this area to create more business opportunities. I helped provide best practice recommendations for optimizing their forms. We removed steps and inputs, consolidated form fields, auto-filled whenever possible, and streamlined the brand messaging to be more user friendly.
“Through our new experience, we create a dynamic relationship that builds mutual business values.”
User-centric Design
Secureworks needed to deliver simplified user-centric experiences that focus on the individual. If they truly want to target multiple audiences, it was critical they make therir content more dynamic. Sitecore's Experience Database (or xDB) collects all customer interactions, connecting them to create a comprehensive, unified view of the individual customer. Sitecore also offers training classes to help businesses begin the personalization journey.
Secureworks would start by establishing the key business value indexes, then relate those to an engagement value score. Monitoring analytics around this score will create a clearer picture of site's visitors and conversion behavior patterns. Those patterns (aka personas) can then be matured and capitalized on.
Reward
Lastly, We recommended SecureWorks create a two-way value exchange. There were too many barriers preventing them from building relationships or providing lasting value. We recommended SecureWorks avoid hiding content behind required forms. Making content more accessible to users helped them see the value of Secureworks' services earlier in the decision making process.
Strategy
Updating the site navigation and overall information hierarchy was going to be a challenge. Our goal was to re-envision a navigation that would be intuitive, drove leads, and aligned with Secureworks' goals. We knew the bigger lift for this redesign was going to be closing the gap between Secureworks and their users. A user-centric approach was critical for simplifying the overall site experience. It was important that the experience meet the diverse needs of global users too. From our findings in discovery, we decided a modular approach would best for the following reasons:
Modularity
Modularity is perfect for iterative development, A/B testing, and persona driven content. Delivering the right content to the right person at the right time was crucial for conversion. A modular approach makes it possible to deliver content tailored to each user based on their activity. It also helps the business anticipate what their users need before they even ask for it.
Flexibility
The true potential of a modular system lives within it's flexibility. Flexibility is a win for both the business and the user. Sitecore's behavioral pattern tracking features create unique personas for all site traffic. By utilizing a modular design system, Secureworks now has the ability to promote content specific to those personas. For example, when a user shows interest in a specific type of content, the site knows to promote content specific to the user. Flexibility looks a little bit different on the business side. Secureworks has the tools to test various sale strategies in multiple markets around the world unanimously.
Modular Components for the Business
At the business level, modular components give greater control and flexibility. This will enable Secureworks to plan, prioritize, and manage the complexity. Each box represents a component or type of content generated by Secureworks.
Modular Components for Users
Modular components provide a high-level of customization specific to each user's needs. The boxes above represent a component or content unique to each persona created by Sitecore.
Scalability
A design system means nothing if it doesn't stand the test of time. A modular system combined with Sitecore's personalization creates a smarter experience that learns from user activity and gets better the more it's used. We knew at the beginning this site needed to accommodate user's needs at a global level. With our new system, Secureworks can now manage their current international experiences with ease. Modularity will also make it a lot easier to expand to other markets as business grows.
Navigation
We discovered a lot of user's pain points circled back to the complexity of the previous navigation. Users had to go 5 levels deep in most cases before they could find content specific to their needs. Once we had a better understanding of Secureworks capabilities and services, we could start creating simpler user journeys.
Design
During Phase 1 of the design process, I helped with the sitemap and navigation experience. In Phase 2 we developed the flexible template system that would help streamline content authoring. Phase 3 was pretty much an extension of Phase 2. Once we had most of our global components designed, we could then go back and focus on redesigning the form experience, and more complex modules.
Our process consisted of a continuous delivery approach. With a continues delivery approach, team's workflows overlapped instead of waterfalled. Simply put, iterative design and development would be done throughout each phase of the design process. This would allow us to QA test components earlier in the development phases, ultimately insuring our final deliverables were as true as possible to the designs. This also prevented us from just "throwing work over the fence", then hoping for the best results.
Phase 1: Navigation
Creating The Site Map
To address some of the existing navigation's complexity, we needed to significantly condenses Secureworks offerings by making them digestible to an average user. To do that, we conducted a card sorting workshop with the client.
The point of the card sorting exercise was to leave with a quick, concise description of each of their services. We asked the client to keep these 4 goals in mind when rethinking the Navigation. Simplify, Consolidate, Elevate, and Innovate. We then used our findings from the workshop to brainstorm alternate ways to categorize their services.
The original navigation utilized a mega-dropdown with 7 primary links, 22 Sub-categories, and 103 navigation items listed within those sub-categories. After reviewing our workshop findings and some internal discussions, we were able to consolidate the navigation down to 5 primary links. We also reduced the max number of sub-navigation links to 6, then removed the remaining 103 tertiary nav items. Replacing the mega-dropdown with a simpler sub-nav created a more focused user journey.
A Simpler Navigation Experience
When rethinking the sitemap our primary goal was to eliminate it's complexity. We carried over that same thinking to the navigation's UI. A mobile first strategy is usually the best approach when solving more complex UI problems in my opinion. It forced us to focus on what was most important to the user.
Now, when a user first interacts with the navigation, they will see Secureworks' key focus areas front and center. Once the user selects a focus area, we then bring forward the key topics or services within that focus area. Users can now spend less time looking for the content they need and more time digesting it. Once we finalized our mobile experience, we applied the same methodology to the desktop navigation.
Phase 2: Templates & Components
Now that we have a clear vision of the user's journey, we can move forward with creating a template system. The template system was designed to streamline content authoring without creating a flat browsing experience. So, starting with the homepage, we created templates that could hold a verity of components depending on their level in the navigation and the type of content that would live on the page.
Global Components
In order for us to create a template system, we needed a few components to start with. These Global Components were designed to live on multiple pages (or Templates) and should generally be positioned in the same place throughout the site's experience.
For example, global components would be things like, the Main Navigation, Footer, Back to top CTA, Social Share CTA, Page Hero's, etc.
We also created a few components that could live anywhere on a template enabling Secureworks to get basic messaging across to users. Components that could handle rich text and imagery for example.
Templates
We ended up creating 5 unique templates for the site. 1 for the homepage, 1 for Overview Pages, 1 for Sub-category Pages, and 2 unique templates for basic content pages. Basic content pages basically consisted of rich text, images, and a few global components. The main differentiator between the 2 basic content pages was the layout. One was tailored for blogs and articles, while the other utilized a layout similar to the rest of the site. The flexibility of this system made it easy for Secureworks to promote, hide, and update content as they pleased. We knew this flexibility could potentially be overwhelming when it came time to add new pages, so we put some rules in place around what components could live on certain templates. Our template system played a huge part in our overall modular strategy, and was extremely valuable when paired with Sitecore's Experience Database.
Phase 3: Additional Components
At this point of the project we tackled a majority of global components and template pages. Our next step was to address some of the more specialty components unique to specific page or more complex functionality wise. The client had also requested we provide an annotated pdf. outlining all of the templates and components created.
Specialty Components
Most of the specialty components consisted of various types of lead-gen form flows. Other specialty components had multiple design states, more complex functionality, or only lived on a specific page. We saved the forms for last to help our client better understand our updated lead-gen strategy. It's a pretty well known fact in the industry that nobody likes forms. The content strategy team was working with Secureworks on coming up with new ways to build relationships, but before that could happen, there was going to be a transitional period requiring Secureworks to rely heavily on data collected from forms. We were able to rethink Secureworks' existing forms by consolidated fields whenever necessary, limiting the number of required inputs, and introduced actionable feedback when applicable.
