Freelance UX consulting · BTC, San Juan PR
Forty years of protecting Puerto Rico.
BTC designs, installs and maintains security systems for businesses, schools, hospitals and homes. I audited their site, benchmarked the industry, and redesigned it mobile-first, so it works like an app and earns trust in seconds.
Before and after
Drag the handle
Same company, same phone. Scroll inside the screen to compare the whole page.
The client
Who BTC is
Founded in 1984 by Angel E. San Miguel. A local integrator that designs, installs, services and certifies security and communications systems. Not a monitoring subscription, a team that builds the system and keeps it running.
The audit
What a first-time visitor sees
I went through every page on desktop and mobile. The company is solid. The site doesn't show it.
- 1No way to act without scrolling
Call and email sit in a small top bar that scrolls away. There's no sticky call or quote button.
- 2The hero is blank
On a phone the slider renders as an empty white block. The first thing you see is nothing.
- 3No Spanish in sight
Nothing on screen offers Spanish, and the site's language link points to "#". In Puerto Rico that's the main audience.
- 4Ten services, zero descriptions
Icons and labels only. You tap into each one to learn what it is.
- 5Pinch-zoom is turned off
maximum-scale=1 blocks zoom, so small text stays small for low-vision users.
- 6A CTA that loops
"Like what you see?..." sends you to the contact page, where the form has no labels.
- 7Signals of an inactive site
Further down: 2016 news, a 2014 copyright, a fax line. Visitors start wondering if they're still open.
No reviews, no client sectors, no photos of real installs. "5MM" and "CFSE" are never explained.
No quote path, no hours, "we'll reply as soon as possible." The careers upload links to about:blank.
A desktop layout squeezed down. Tiny tap targets, no thumb-zone actions, zoom disabled.
Empty alt text on every service image. Bold text used as headings. Logos labeled "Print."
Interlogix shut down in 2019. Stanley Healthcare is now Securitas Healthcare. The brand wall is out of date.
Outdated plugins, mixed HTTP and HTTPS, a redirect loop on About, and third-party links that didn't belong. Flagged to the owner first.
Benchmark
What the best security sites do
I studied a global commercial integrator (Convergint) and a consumer leader (SimpliSafe). Different customers, same lessons.
Strategy
Two people land on this site
The old site only talked to one of them, badly. The redesign gives each a clear path from the first screen.
Facility manager or homeowner
"Can these people protect my building, and what will it cost?"
- Understand options without jargon
- See proof they're real and current
- Get a quote without a phone tag
School, clinic or business already on BTC
"My cameras are down" or "my fire inspection certificate is due."
- Reach a person fast in an emergency
- Request repairs or maintenance
- Renew inspection certificates
The redesign
A website that behaves like an app
Not a desktop site shrunk down. Tabs, sheets and thumb-zone actions, so it feels native the moment it opens. Try it.
- Thumb zoneQuote, call and the tabs live at the bottom, where your thumb already is.
- BilingualTap ES / EN in the corner. Every screen switches, including the quote flow.
- "What are you protecting?"Pick a sector and the services re-sort for it.
- Guided quoteFour short steps with real labels and inline errors. WhatsApp is a contact option, because that's how PR does business.
- Emergencies go to a personIn Support, choose Emergency and the form disappears. You get one big Call button.
Key flows
The quote, step by step
The old path was a form with no labels. The new one asks one easy question per screen and shows progress the whole way.
Support for current clients, in Spanish
Desktop
Responsive, not just smaller
Same system, same components. On a big screen the hero splits, the industries become tabs, and the quote opens as a side panel instead of a sheet.
≤ 599Tabs + sheets, 1 column, sticky action bar600 – 10232-column services, sheet becomes a centered dialog≥ 1024Split hero, industry tabs, quote in a side panelDesign system
Small, strict, easy to hand off
A small business doesn't need a giant library. It needs a few components that never break. Every color pair passes WCAG AA.
brand#D42024 · BTC red from the logo · 5.2:1 with whiteink#14203F · BTC navy, deepened · 16:1 on whiteselected#E9ECF3 · chosen chips and cardsok#15803D · success, Call · 5.0:1alert#A3161B · errors, emergency, always with an iconcanvas#F4F5F8 · app backgroundBTC red stays the brand and drives every primary action. Selection uses navy, so a chosen option never looks like an error.
Accessibility
Removed maximum-scale, so people can pinch to zoom again.
Primary actions are 48px tall and chips are 40px with space around them. The old service icons were about 22px.
Every field has a visible label and an error in words, not just red.
The page switches lang="es" and lang="en", so screen readers pronounce it right.
Same company. Finally looks like it.
Forty years of trust deserves a site you can use with one thumb, in your own language.
Proposed redesign delivered to BTC's owner, October 2026. "Before" screenshots are of the live site. The logo mark is a refresh of BTC's red mark, pending owner sign-off.