ACTIVE DEFENDER
Website Design
Bradlee Ching, Web Designer & Project Manager
Kayla Sanders, Copywriter
Goal: To create a website that efficiently explains the company’s product features, reveals the need for the product, and drives the audience to schedule a personalized project demo.
Active Defender has two app products designed for school safety, Active Defender and Active Alert. Active Defender enables teachers, administrators, and law enforcement to better respond to crisis by tracking active assailants, locating medical emergencies, and more through a live map. Active Alert enables the school to easily track daily health reports.
CHALLENGES
I began by evaluating the website with little knowledge of the company’s products. I wanted to experience the website from a new viewer’s perspective. I found there was inconsistency in typography, hierarchy, and button styles. The website presented two products, Active Defender and Active Alert, but the differences between the apps’ features were unclear and left me with many questions. The copy was informative but was overly technical.
INFORMATION ARCHITECTURE
It became clear that this website was in need of more than just a redesign, so I sub-contracted a copywriter (Kayla Sanders) to rewrite the website. After learning more about the company and its products, together we created new copy and a wireframe that transformed the experience of the website. Goals:
Increase functionality and clarity of navigation
Educate the viewer through clear, organized information
Prompt the viewer to request a demo
Explain the differences between and functions of the two products—Active Defender and Active Alert
WEB DESIGN
After creating a detailed mockup, I built the website using WordPress, Divi, and custom HTML/CSS. Goals:
Maintain responsive design across devices—desktop, mobile, and tablet
Create a modern, professional aesthetic that reinforces the Active Defender brand
Make a website structure flexible enough to adapt for company growth and new products (apps)
