Kastle Video Pages
Overview
Kastle Systems is a managed building security company with multiple verticals. One of their verticals is video surveillance. Kastle Systems is a managed building security company with multiple verticals. One of their verticals is video surveillance. The existing video-surveillance experience lacked the depth, clarity, and visual polish needed to support prospects and the sales team. We redesigned the KastleVideo experience to make product information easier to understand, create a stronger sales destination, and increase qualified traffic and lead generation.
Duration
September 2024 - November 2024
Tools
Figma
WordPress
Adobe Creative Suite
Challenge
Our Video Surveillance sales team didn’t have a dedicated, up-to-date destination to direct clients interested in KastleVideo. The existing site was outdated, misaligned with current branding, and struggled to engage visitors—resulting in low page traffic and minimal lead conversion.
Role
Lead UX/UI Designer
Team
Kelsey Blackburn - SEO
Goal
Create an experience that the Video Sales team could confidently use to drive potential business, while also serving as an informative destination for site visitors to learn more about Kastle’s video products. Success would be measured by an increase in both page visits and qualified leads generated through sales team referrals.
Research
Research Goal
The research goal was to determine how to present detailed product information without sacrificing clarity, scanability, or ease of use.
Copy + SEO
My colleague, Kelsey Blackburn, researched competitor SEO practices and interviewed stakeholders to identify the information that would best serve both prospective customers and the sales team.
Design + Competitive Analysis
I reviewed current digital-design patterns to modernize the experience while remaining consistent with Kastle’s brand guidelines.
After learning more about the industry, I wanted to take a closer look at Kastle’s competitors and how they’re showcasing their products. Through my market research, I identified some top direct and indirect competitors within the industry: Verkada, Rhombus, and Latch. I evaluated the strengths and weaknesses of each to see how Kastle could fill in any gaps moving forward.
Strengths
User Interaction + Movement
Each product has its own detailed page, which helps users focus on one item at a time without distraction.
Weaknesses
Unclear Links to External Pages
Potential Overuse or Misuse of Motion
Strengths
Clear and Prominent CTA (Call to Action)
Detailed Product Information
Weaknesses
CTA Visibility May Not Be Persistent
Over-Interactive Design Risks
Strengths
Products Are the Main Focus
Effective Use of a Strong Accent Color
Weaknesses
Lacks a Clear Value Proposition or Customer Benefit
Missed Opportunity for Emotional or Storytelling Content
Define
With a clearer understanding of stakeholder needs and the competitive landscape, I began exploring potential solutions to the challenges we aimed to address. Leveraging insights from the competitive analysis and new messaging provided by my colleague Kelsey, I was able to further clarify the problem space and use those learnings to guide my brainstorming process.
| Insights | Needs | HMW |
|---|---|---|
| Competitors use motion and interaction to make technical products easier to understand. | Create engagement without adding visual noise. | How might we use purposeful motion to explain product value and encourage deeper exploration? |
| Visitors want detailed product information when evaluating security solutions. | Understand product capabilities without scanning dense pages. | How might we reveal technical detail progressively without cluttering the interface? |
| Visitors often struggle to find information that matches their property or business needs. | Move between overview and detailed product content predictably. | How might we create a consistent information architecture across all KastleVideo pages? |
User Flow
To provide customers and prospects with more comprehensive information about KastleVideo—without creating an endless scroll on the homepage—we expanded the content into four distinct pages. The before-and-after user flow below illustrates the new structure and organization of these pages.
Before
After
Brainstorming
Using the revised user flow, I created exploratory sketches to test layout and content ideas before moving into high-fidelity design.
High-Fidelity Wireframes
Final Design
Outcome
After launching the new KastleVideo pages, we received positive feedback from the video sales team. They felt more confident directing prospects to the updated pages, noting that the content was more informative and easier to navigate. Following launch, organic page visits increased 28%, and 10 qualified leads were attributed to the redesigned pages.
2021 Design
The 2021 design relied primarily on static imagery. In the redesign, we introduced looping product and interface clips on key pages to explain functionality more clearly and create a more dynamic experience.
KastleVideo Overview
The 2021 design relied solely on static images, resulting in a flat and unengaging user experience. In the updated design, we incorporated video GIFs throughout key pages to better illustrate concepts and increase user engagement.
KastleVideo Cameras
To help visitors better understand our products without overwhelming the page, we aimed to present more information in a clean, organized way. I designed an expandable section for our camera products that displays a brief overview by default. When clicked, it reveals more detailed information, allowing users to explore at their own pace without cluttering the overall layout.
KastleVideo VideoGuarding
We wanted to effectively showcase the capabilities of Kastle Videoguarding, something that static images alone couldn’t fully communicate. While video was a more effective solution, embedding them vertically would have made the page unnecessarily long. To solve this, I designed the section to mirror the expandable format used in the camera descriptions. It displays a brief overview by default, and when clicked, it expands to reveal a video—allowing users to dive deeper without overwhelming the page layout.
KastleVideo User Experience
A key feature of KastleVideo is its mobile app, which allows users to access video footage on the go. Since this was highlighted on the user experience page, I wanted to demonstrate how smooth and intuitive the mobile experience is. I designed a section featuring a looping video that showcases a user seamlessly navigating the app to search for a video event, helping visitors visualize the functionality in action.