Why Bad BAS Graphics Are Quietly Killing Your Productivity

Open a BAS graphic and you should instantly know three things:

What’s running

What’s failing

What matters

If your screen can’t answer those in five seconds, you’re not looking at a graphic, you’re looking at a time sink.

I’ve inherited sites where the programming was rock solid, but the graphics looked like a PowerPoint museum from 1998, 17 colors, spinning arrows, random clipart boilers, and values scattered like confetti. Operators stopped trusting the interface, so they stopped using it. Guess what happened next? Endless calls for simple checks, schedule changes, and “is the AHU even on?” type questions.

Bad BAS graphics don’t just offend taste. They tax attention, burn hours, and bleed money.

Let’s fix that.

The Real Cost of bad BAS graphics

1. They hide the problem

   If discharge air temp is two clicks deep, you’re already behind. Multiply that by every tech, every day, and you’re looking at dozens of lost hours a month just in navigation friction.

2. They break team flow

   New techs shouldn’t need a scavenger hunt to find mixed-air temperature or damper position. Every extra click is a micro-context switch that shatters focus and slows troubleshooting.

3. They destroy trust

   When screens look dated or chaotic, operators assume the data is untrustworthy. When they stop trusting graphics, they stop using the BAS. Then your team becomes the human interface, answering calls the system should answer itself.

4. They invite errors

   Inconsistent units, unlabeled setpoints, and “mystery” colors lead to bad decisions—like disabling safeties or forcing equipment on all weekend because an operator misread the UI.

   
   

Symptoms Your Graphics Are Hurting You

• You need three or more clicks to see the top five points for a piece of equipment.

• Operators keep calling the controls team for “quick checks.”

• Alarms get ignored because the alarm indicator looks like every other icon.

• Trend history lives in a separate tab and nobody opens it.

• Mobile usability is a joke, pinch/zoom till your thumbs cramp.

• You regularly hear, “This number seems wrong.” (Translation: no trust.)

  
  

The Operator-First Design Rule

If it doesn’t help an operator decide and act within five seconds, it doesn’t belong on the main screen.

Design for the end user in the chair, not the engineer who wrote the logic. That means ruthless clarity, consistent patterns, and the right data in the right place.

A Simple Case Study: Same Logic, New Graphics, Fewer Calls

At one site, logic was fine but the UI was chaos. We ran a two-day sprint:

1. Screenshotted the top 10 offenders.

   
   

2. White boarded the critical five points per device

   1. status

   2. command

   3. safeties

   4. setpoint

   5. measured

      
      

3. Built a clean header card for each device type.

   
   

4. Color-standardized: blue = cooling, red = heating, yellow = caution/alarm.

   
   

5. Added tiny sparkline trends for temperature and pressure right on the faceplate.

   
   

6. Result within 30 days: operator calls dropped by 60%. Not a single line of logic changed, only the graphics.

   
   

The Five-Second Glance Test (Use This Every Time)

When a new graphic opens, can a first-time user answer:

• Is it running? (clear status/command)

• Is it healthy? (safeties, alarms, high-value limits)

• Is it on target? (setpoint vs actual with visible delta)

• What changed recently? (mini trend sparkline)

• Where do I go next? (obvious drill-downs)

  
  

If not, redesign.

Anti-Patterns to Delete Today

• Photorealistic equipment (pretty, but slow and noisy).

• Animated arrows everywhere (one clear flow arrow beats ten spinners).

• Rainbow color palettes (stick to 6–8 UI colors max).

• Unlabeled numbers (always include units and context).

• “Mystery boxes” containers with no headers or function.

• Data three clicks deep that belongs on the top-level screen.

• Screens that try to do everything (home ≠ detail ≠ configuration).

  
  

Your Baseline Visual System (Copy This)

Colors (keep it consistent)

• Cooling: Blue

• Heating: Red

• Fans/General ON: Green (solid)

• Off/Auto: Gray

• Alarm/Fault: Yellow for caution, flashing red only for immediate action

• Manual/Override: Purple or orange - pick one and use it everywhere

Accessibility tip: Use icon + color + label so color-blind users aren’t penalized.

Typography

• One family, two weights (Regular/Bold).

• Big values (actuals/setpoints) 18–24px desktop; labels 12–14px.

• All values include units (°F, °C, %, in.w.c., kW).

  
  

Layout

• Top bar: equipment name + run/stop + alarm indicator + occupancy.

• Left column: air/water path (supply → return) with major components in flow order.

• Right column: key metrics & setpoints in grouped “cards.”

• Footer: last update timestamp + quick links (Trends, Schedules, Alarms).

  
  

Iconography

• Use one icon set. Don’t mix vendors.

• Label every icon on hover and (ideally) below on mobile.

  
  

What Goes on the Home vs Detail Screens

Home (Overview)

• Status/command, alarms, occupancy

• Setpoint vs actual (with Δ)

• Key safeties (freezestat, smoke, high-static)

• 12–24h sparkline trends (supply air temp, zone temp, static, valve/damper position)

• Clear drill-down buttons: Trends, Schedules, Alarms, Components

  
  

Detail

• Component-level points (e.g., AHU coils, VFD, filter ΔP)

• Maintenance info (filter status, hours run)

• Advanced trends with range bands

• Notes/links (O&M, submittals, SOPs)

  
  

Standard Point Sets by Equipment (Starter Pack)

AHU (VAV)

• SAT (°F), RAT (°F), MAT (°F) with 24h sparklines

• Supply Fan CMD/STATUS, VFD speed (%), Static (in.w.c.)

• Cooling Valve %, Heating Valve %, Economizer %

• Freezestat, Smoke, Filter ΔP (in.w.c.)

  
  

VAV Box

• Zone Temp (°F), Setpoint (°F), Δ (°F)

• Damper %, Reheat CMD/STATUS

• Flow (CFM), Min/Max CFM

  
  

Chilled Water Plant

• CHWS/CHWR (°F), ΔT (°F), kW/ton

• Chiller CMD/STATUS, Pump CMD/STATUS

• Tower fan CMD/STATUS, CW temp

  
  

Boiler Plant

• Supply temp (°F), Return temp (°F)

• Boiler enable, Flame status, Lockouts

• Pump CMD/STATUS

  
  

Make these templates, not one-offs. A tech should recognize a VAV at any site in your portfolio within seconds.

Live Data That Actually Helps

• Setpoint vs Actual: Show both, always.

• Δ (Delta): The difference tells you if control is working.

• Mini trends: 12–24h sparklines expose drift and hunting without leaving the page.

• Last updated: Timestamp on every card, no one trusts “stale live data.”

  
  

Alarm Design That Drives Action

• Prioritize (Critical > Warning > Info).

• Group (by equipment, not time).

• Explain (“High static: 2.2 in.w.c. > 1.8 setpoint for 10 min”).

• Link (click takes you to the exact component).

• Don’t scream forever: auto-snooze informational alarms after acknowledgment.

  
  

Mobile-First Reality Check

• One column, stack cards, no tiny tap targets.

• Show status, alarms, setpoint vs actual, and one sparkline; hide the rest behind “More.”

• Use sticky “Run/Stop” and “Back” buttons.

• Test on the phone your operators actually carry.

  
  

Build a Graphics Style Guide in One Afternoon

1. Pick your palette (8 colors max) and document meanings.

   
   

2. Choose typography (one family, two weights).

   
   

3. Create faceplates for AHU, VAV, chiller, boiler as reusable components.

   
   

4. Define point labels + units (no exceptions).

   
   

5. Write acceptance criteria (see below).

   
   

6. Publish a 2-page PDF and pin it in your BAS and internal wiki.

   
   

Acceptance Criteria (Copy/Paste)

•  Passes Five-Second Glance Test

•  All values labeled with units

•  Setpoint + Actual + Δ visible for top five points

•  Alarm state visible and unmistakable

•  Trends (12–24h) on primary values

•  Mobile view tested and readable

•  Timestamp shows last data update

•  Navigation to Trends/Schedules/Alarms in one tap

•  Colors/icons match the style guide

  
  

One-Week Rescue Plan (Sprint Format)

Day 1 – Audit Screenshot top 20 screens. Time how long it takes to find each device’s top five points. Prioritize the worst offenders.

Day 2 – Template Lock your style guide. Build AHU + VAV faceplates and one plant template.

Day 3 – Rebuild Convert the top five AHUs and ten VAVs. Bake in sparklines and clear alarm badges.

Day 4 – Operator Review Sit with operators. Watch them drive. Fix friction immediately.

Day 5 – Rollout Standardize naming, tags, and units. Document “how to read this screen” notes. Publish and train.

Pro Tip: Use Micro-Trends Everywhere

Tiny sparklines next to key values stop wild goose chases. No one wants to open a full trend for every question. Put a 24h line next to SAT, static, and zone temp and you’ll catch 80% of issues at a glance.

ROI Snapshot (Simple Math You Can Share)

• Before: 30 operators × 5 minutes/hour lost to clunky UI × 6 active hours/day × 20 days = 300 hours/month

• After (60% reduction): 120 hours/month saved

• At $50/hr fully burdened, that’s $6,000/month reclaimed, $72,000/year, from cleaner graphics alone. And that’s before faster troubleshooting and fewer callouts.

  
  

Governance: Don’t Slide Back

• Quarterly graphics review (pick 5 random screens and grade them).

• Change control: any new screen must pass the acceptance checklist.

• Owner: one person owns the style guide and approves exceptions.

• Training: 30-minute onboarding for new techs/operators on “how to read our screens.”

Recommended Gear

Sceptre 34-Inch Curved Ultrawide Monitor (3440 x 1440)

Buy it: 

34 Inch

32 Inch

Best for: A single, clean canvas where you can view AHU graphics, alarms, and trends side-by-side.

What it is: A color-accurate IPS ultrawide with USB-C (power + video) and great text clarity, ideal for BAS graphics.

How to use it:

• One-cable USB-C to your laptop; enable display scaling at 100–125%.

• Snap windows: Graphic (left), Trends (right-top), Alarms (right-bottom).

• Save the layout as your default workspace.

  
  

Field drill:

Run a live troubleshooting session with the three-pane layout and time the fix vs. your old setup.

Pro tip:

Mount it on a VESA arm to keep the curve centered at eye level and reduce glare.

Elgato Stream Deck MK.2 (15-Key)

Buy it: Black | White

Best for: One-tap macros that launch Niagara views, open Trends, paste canned notes, and switch workspaces, faster graphics + fewer clicks.

What it is: A programmable macro pad. Each key shows a custom icon and can trigger multi-step actions, URLs, scripts, or keyboard shortcuts.

How to use it:

• Map keys to: AHU, VAV, Alarms, Schedules, Plant, “Last 24h Trends.”

• Create a “Respond to Alarm” multi-action: open equipment view → open trend → open ticket form.

• Auto-switch profiles per app (Niagara, Grafana, browser).

  
  

Field drill:

Time a live alarm triage with and without the Deck. Keep the layout that wins by ≥30%.

Pro tip:

Use color-coded icons to match your style guide (blue=cooling, red=heating, yellow=alarm) so operators learn it instantly.

Recommended Books

High Performance HMI Handbook

Written by: Hollifield, Habibi, et al.

Buy it: Hardcover | Kindle

Best for: Turning noisy BAS screens into high-performance, operator-first HMIs.

What you’ll get: Proven principles (situational awareness, alarm discipline, grayscale palettes), examples, and governance to standardize your graphics across sites.

How to use this week (45–60 min):

Day 1: Read the overview + principles. List your top 5 “violations.”

Day 2–3: Rebuild one AHU faceplate using grayscale + clear deltas.

Day 4–5: Peer review with an operator; log friction and fix.

Field drill:

Audit 3 screens with the Five-Second Test. If a new user can’t find status, safeties, and SP vs Actual in 5s, redesign.

Pro tip:

Publish a 2-page style guide from Chapter takeaways and require it in your commissioning checklist.

Final Thoughts

Your BAS graphics are the front door to your system. bad BAS graphics shut that door; great graphics invite people in and guide them straight to the problem. Clean up the interface and you’ll eliminate half the headaches you think are “controls problems.” They’re not. They’re clarity problems.

Fix the graphics. Reclaim your time. Earn back trust.