Blame
|
1 | # Graphic Developer (UI/HMI) - Job Description & Qualification Tasks |
||||||
| 2 | ||||||||
| 3 | **Primary Responsibility:** To design and deploy high-quality, intuitive Human-Machine Interface (HMI) graphics that provide building operators with effective visualization, monitoring, and control of the Building Automation System (BAS). |
|||||||
| 4 | ||||||||
| 5 | **Prerequisites:** |
|||||||
| 6 | - Completion of Field Specialist role with supervisor sign-off |
|||||||
| 7 | - Completion of Bridge Training modules |
|||||||
| 8 | - Minimum 18-24 months experience as Field Specialist |
|||||||
| 9 | - OSHA 40-Hour Construction Safety Certification (maintained) |
|||||||
| 10 | ||||||||
| 11 | **Estimated Time in Role Before Promotion Eligibility:** 24-36 months |
|||||||
| 12 | ||||||||
|
13 | **Next Possible Roles:** [[training-structure/roles/senior-field-operations-coordinator]](Dispatch) |
||||||
|
14 | |||||||
| 15 | --- |
|||||||
| 16 | ||||||||
| 17 | ## Assessment Methods |
|||||||
| 18 | - Practical demonstrations with supervisor observation and sign-off on each key task |
|||||||
| 19 | - Design review by senior developers and Project Managers |
|||||||
| 20 | - User acceptance testing with building operators and clients |
|||||||
| 21 | - Quality control checklist verification (100% compliance required) |
|||||||
| 22 | - Written exam on HMI design principles and data linking (80% passing score) |
|||||||
| 23 | - Client satisfaction scores on graphic usability and aesthetics |
|||||||
| 24 | - Portfolio of completed graphics with before/after examples and user feedback |
|||||||
| 25 | ||||||||
| 26 | ----------------------------------------------------------------------- |
|||||||
| 27 | **Key Tasks for Qualification** |
|||||||
| 28 | ||||||||
| 29 | - 1. **Graphic Design & Visualization:** Design a comprehensive system schematic graphic for a central plant (Boilers, Chillers, Pumps) using the approved graphic library. |
|||||||
| 30 | - 2. **Graphic Design & Visualization:** Create at least three custom 3D-style floor plan graphics, placing equipment symbols accurately on the layout. |
|||||||
| 31 | - 3. **Data Linking & Interactivity:** Successfully link all live data points (Analog, Binary, Multi-state) from the controller network to their corresponding visual elements on the graphic. |
|||||||
| 32 | - 4. **Data Linking & Interactivity:** Implement secure, interactive elements (e.g., setpoint changes, mode overrides) ensuring appropriate user permissions are enforced. |
|||||||
| 33 | - 5. **User Experience (UX):** Design a custom dashboard graphic that aggregates key performance indicators (KPIs) like energy consumption and system efficiency trends. |
|||||||
| 34 | - 6. **User Experience (UX):** Ensure all graphics are designed to be responsive, viewing correctly on both desktop monitors and mobile tablets/phones. |
|||||||
| 35 | - 7. **Quality Control:** Conduct a formal quality check, verifying that all links function, graphics are visually consistent, and adhere to client branding guidelines. |
|||||||
| 36 | ----------------------------------------------------------------------- |
|||||||
| 37 | ||||||||
| 38 | --- |
|||||||
| 39 | ||||||||
| 40 | ## Required Training Course List |
|||||||
| 41 | ||||||||
| 42 | 1. **BAS Graphic Development Platform Training:** Mastery of the graphic toolset (Vendor-Specific, e.g., Niagara AX/N4). |
|||||||
| 43 | ||||||||
| 44 | 2. **Central Plant Schematic Design:** Principles of fluid dynamics visualization and standardized graphic library usage. |
|||||||
| 45 | ||||||||
| 46 | 3. **Floor Plan Design and Spatial Visualization:** Techniques for creating accurate and aesthetic 2D/3D floor layouts. |
|||||||
| 47 | ||||||||
| 48 | 4. **BAS Data Point Linking and Tagging:** Procedures for connecting control network points to HMI elements. |
|||||||
| 49 | ||||||||
| 50 | 5. **Interactive Element Implementation:** Securely configuring control points (setpoints, overrides) and user permission management. |
|||||||
| 51 | ||||||||
| 52 | 6. **Dashboard Design and KPI Visualization:** Designing effective data aggregation and trending displays. |
|||||||
| 53 | ||||||||
| 54 | 7. **Responsive Graphic Design:** Ensuring optimal viewing and functionality across desktop, tablet, and mobile interfaces. |
|||||||
| 55 | ||||||||
| 56 | 8. **Graphic Quality Control and Branding Compliance:** Formal verification checklist and adherence to client standards. |
|||||||
| 57 | ||||||||
| 58 | 9. **User Interface (UI) and User Experience (UX) Principles:** Best practices for intuitive navigation and operator workflows. |
|||||||
| 59 | ||||||||
| 60 | --- |
|||||||
| 61 | ||||||||
| 62 | ## Optional/Advanced Training |
|||||||
| 63 | - Advanced graphic design software (Adobe Illustrator, Photoshop) |
|||||||
| 64 | - Web-based HMI development (HTML5, CSS, JavaScript) |
|||||||
| 65 | - Data visualization best practices and chart selection |
|||||||
| 66 | - Color theory and accessibility compliance (WCAG standards) |
|||||||
| 67 | - Animation and dynamic visualization techniques |
|||||||
| 68 | - Custom widget and component development |
|||||||
| 69 | - Building information modeling (BIM) integration |
|||||||
| 70 | - Virtual reality (VR) or augmented reality (AR) HMI concepts |
|||||||
| 71 | ||||||||
| 72 | --- |
|||||||
| 73 | ||||||||
| 74 | ## Cross-Training Opportunities |
|||||||
| 75 | - Shadow Programmers to understand control logic and data availability |
|||||||
| 76 | - Shadow Network Specialists to understand data communication and latency issues |
|||||||
| 77 | - Attend operator training sessions to observe end-user interactions |
|||||||
| 78 | - Work with Project Managers on graphic scope estimation and timelines |
|||||||
| 79 | - Collaborate with Field Specialists to understand system layout and equipment placement |
|||||||
| 80 | - Review Service Fusion workflows for tracking graphic development milestones |
|||||||
| 81 | - Participate in client design review meetings |
|||||||
| 82 | ||||||||
| 83 | --- |
|||||||
| 84 | ||||||||
| 85 | ## Qualification Checklist |
|||||||
| 86 | ||||||||
| 87 | Before advancing to Senior Field Operations Coordinator, the Graphic Developer must demonstrate: |
|||||||
| 88 | ||||||||
| 89 | - [ ] Design and deploy graphics for 10+ complete BAS projects |
|||||||
| 90 | - [ ] Create 5+ central plant schematics with full data linking |
|||||||
| 91 | - [ ] Develop 15+ custom floor plan graphics meeting client specifications |
|||||||
| 92 | - [ ] Link 500+ data points correctly with zero linking errors |
|||||||
| 93 | - [ ] Implement secure interactive controls for 10+ projects |
|||||||
| 94 | - [ ] Design 5+ custom dashboards incorporating energy and performance KPIs |
|||||||
| 95 | - [ ] Ensure all graphics pass quality control checklist (100% compliance) for 10 projects |
|||||||
| 96 | - [ ] Pass written exam on HMI design principles (80%+) |
|||||||
| 97 | - [ ] Achieve client satisfaction rating of 4.5/5.0 or higher on graphic usability |
|||||||
| 98 | - [ ] Obtain at least one manufacturer graphics certification |
|||||||
| 99 | - [ ] Mentor Field Specialists on basic HMI navigation and data point concepts |
|||||||
| 100 | - [ ] Receive supervisor sign-off on all 7 key qualification tasks |
|||||||
| 101 | ||||||||
| 102 | --- |
|||||||
| 103 | ||||||||
| 104 | ## Timeline Expectations |
|||||||
| 105 | **Typical Duration:** 24-36 months |
|||||||
| 106 | - Months 1-6: Learning graphic development platform, creating basic schematics under supervision |
|||||||
| 107 | - Months 7-12: Developing floor plans and dashboards independently |
|||||||
| 108 | - Months 13-18: Advanced data linking, interactive elements, responsive design |
|||||||
| 109 | - Months 19-30: Complex visualizations, client customization, pursuing certifications |
|||||||
| 110 | - Months 31-36: Mentoring others, design review responsibilities, preparing for dispatch coordinator role |
|||||||
| 111 | ||||||||
| 112 | **Note:** Progression depends on demonstrated design aptitude, client feedback, attention to detail, certification achievement, and company need for dispatch coordinator capacity. |
|||||||
| 113 | ||||||||
| 114 | ## Recommended Videos |
|||||||
| 115 | ||||||||
| 116 | - [HVAC Graphics Design - Tips & Tricks](https://www.youtube.com/watch?v=Fj-0nU3tS9o) |
|||||||
| 117 | - [Niagara 4: Creating a Simple Graphic (PX)](https://www.youtube.com/watch?v=kYv_I-m46Fk) |
|||||||
| 118 | - [How To Build a Basic VAV Graphic (Niagara 4)](https://www.youtube.com/watch?v=Yp69GgU2m1w) |
|||||||
