OEE Performance Matrix<\/title>\n<\/head>\n<body>\n\n<div id=\"oee-comparison-widget\">\n <style>\n \/* Font Awesome Icons (embedded SVG as background images) *\/\n .icon-car::before {\n content: '';\n display: inline-block;\n width: 1em;\n height: 1em;\n background: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 640 512'%3E%3Cpath fill='currentColor' d='M171.3 96H224v96H111.3l30.4-75.9C146.5 104 158.2 96 171.3 96zM272 192V96h81.2c9.7 0 18.9 4.4 25 12l67.2 84H272zm256.2 1L428.2 68c-18.2-22.8-45.8-36-75-36H171.3c-39.3 0-74.6 23.9-89.1 60.3L40.6 196.4C16.8 205.8 0 228.9 0 256V368c0 17.7 14.3 32 32 32H65.3c7.6 45.4 47.1 80 94.7 80s87.1-34.6 94.7-80H385.3c7.6 45.4 47.1 80 94.7 80s87.1-34.6 94.7-80H608c17.7 0 32-14.3 32-32V320c0-65.2-48.8-119-111.8-127zM160 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96zm320 0a48 48 0 1 1 0 96 48 48 0 1 1 0-96z'\/%3E%3C\/svg%3E\") no-repeat center;\n background-size: contain;\n }\n .icon-box::before {\n content: '';\n display: inline-block;\n width: 1em;\n height: 1em;\n background: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 640 512'%3E%3Cpath fill='currentColor' d='M58.9 42.1c3-6.1 9.6-9.6 16.3-8.7L320 64 564.8 33.4c6.7-.8 13.3 2.7 16.3 8.7l41.7 83.4c9 17.9-.6 39.6-19.8 45.1L439.6 217.3c-13.9 4-28.8-1.9-36.2-14.3L320 64 236.6 203c-7.4 12.4-22.3 18.3-36.2 14.3L37.1 170.6c-19.3-5.5-28.8-27.2-19.8-45.1L58.9 42.1zM321.1 128l54.9 91.4c14.9 24.8 44.6 36.6 72.5 28.6L576 211.6v167c0 22-15 41.2-36.4 46.6l-204.1 51c-10.2 2.6-20.9 2.6-31 0l-204.1-51C79 419.7 64 400.5 64 378.5v-167L191.6 248c27.8 8 57.6-3.8 72.5-28.6L318.9 128h2.2z'\/%3E%3C\/svg%3E\") no-repeat center;\n background-size: contain;\n }\n .icon-food::before {\n content: '';\n display: inline-block;\n width: 1em;\n height: 1em;\n background: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 448 512'%3E%3Cpath fill='currentColor' d='M86.4 5.5L61.8 47.6C58 54.1 56 61.6 56 69.2V72c0 22.1 17.9 40 40 40s40-17.9 40-40V69.2c0-7.6-2-15-5.8-21.6L105.6 5.5C103.6 2.1 100 0 96 0s-7.6 2.1-9.6 5.5zm128 0L189.8 47.6c-3.8 6.5-5.8 14-5.8 21.6V72c0 22.1 17.9 40 40 40s40-17.9 40-40V69.2c0-7.6-2-15-5.8-21.6L233.6 5.5C231.6 2.1 228 0 224 0s-7.6 2.1-9.6 5.5zm128 0L317.8 47.6c-3.8 6.5-5.8 14-5.8 21.6V72c0 22.1 17.9 40 40 40s40-17.9 40-40V69.2c0-7.6-2-15-5.8-21.6L361.6 5.5C359.6 2.1 356 0 352 0s-7.6 2.1-9.6 5.5zM0 144c0-17.7 14.3-32 32-32H416c17.7 0 32 14.3 32 32s-14.3 32-32 32v192c0 53-43 96-96 96H128c-53 0-96-43-96-96V176c-17.7 0-32-14.3-32-32z'\/%3E%3C\/svg%3E\") no-repeat center;\n background-size: contain;\n }\n .icon-sliders::before {\n content: '';\n display: inline-block;\n width: 1em;\n height: 1em;\n background: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 512 512'%3E%3Cpath fill='currentColor' d='M0 416c0 17.7 14.3 32 32 32l54.7 0c12.3 28.3 40.5 48 73.3 48s61-19.7 73.3-48L480 448c17.7 0 32-14.3 32-32s-14.3-32-32-32l-246.7 0c-12.3-28.3-40.5-48-73.3-48s-61 19.7-73.3 48L32 384c-17.7 0-32 14.3-32 32zm128 0a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zM320 256a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm32-80c-32.8 0-61 19.7-73.3 48L32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l246.7 0c12.3 28.3 40.5 48 73.3 48s61-19.7 73.3-48l54.7 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-54.7 0c-12.3-28.3-40.5-48-73.3-48zM192 128a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm73.3-64C253 35.7 224.8 16 192 16s-61 19.7-73.3 48L32 64C14.3 64 0 78.3 0 96s14.3 32 32 32l86.7 0c12.3 28.3 40.5 48 73.3 48s61-19.7 73.3-48L480 128c17.7 0 32-14.3 32-32s-14.3-32-32-32L265.3 64z'\/%3E%3C\/svg%3E\") no-repeat center;\n background-size: contain;\n }\n .icon-chart::before {\n content: '';\n display: inline-block;\n width: 1em;\n height: 1em;\n background: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 512 512'%3E%3Cpath fill='currentColor' d='M32 32c17.7 0 32 14.3 32 32V400c0 8.8 7.2 16 16 16H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H80c-44.2 0-80-35.8-80-80V64C0 46.3 14.3 32 32 32zm96 144c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32v96c0 17.7-14.3 32-32 32H160c-17.7 0-32-14.3-32-32V176zm128-64c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32V272c0 17.7-14.3 32-32 32H288c-17.7 0-32-14.3-32-32V112zm128 32c0-17.7 14.3-32 32-32h32c17.7 0 32 14.3 32 32V240c0 17.7-14.3 32-32 32H416c-17.7 0-32-14.3-32-32V144z'\/%3E%3C\/svg%3E\") no-repeat center;\n background-size: contain;\n }\n\n \/* All styles are now scoped to the #oee-comparison-widget container *\/\n #oee-comparison-widget {\n --primary-bg: #0d1a35;\n --secondary-bg: #1a2a4f;\n --card-bg: rgba(26, 42, 79, 0.9);\n --border-color: rgba(77, 140, 255, 0.3);\n --shadow-color: rgba(0, 25, 78, 0.6);\n --accent-primary: #4d8cff;\n --accent-secondary: #6ebcff;\n --text-primary: #e0e7ff;\n --text-secondary: #a4c3ff;\n --success: #10b981;\n --warning: #f59e0b;\n --danger: #ef4444;\n\n background: linear-gradient(135deg, var(--primary-bg) 0%, var(--secondary-bg) 100%);\n color: var(--text-primary);\n font-family: 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;\n line-height: 1.6;\n padding: 10px;\n border-radius: 16px;\n min-height: 100vh;\n width: 100%;\n box-sizing: border-box;\n }\n\n \/* Scoped Reset *\/\n #oee-comparison-widget *,\n #oee-comparison-widget *::before,\n #oee-comparison-widget *::after {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: inherit;\n }\n\n #oee-comparison-widget .widget-container {\n max-width: 1400px;\n margin: 0 auto;\n width: 100%;\n }\n\n \/* Header *\/\n #oee-comparison-widget header {\n text-align: center;\n margin-bottom: 20px;\n padding: 15px;\n }\n\n #oee-comparison-widget h1 {\n font-size: clamp(1.8rem, 4vw, 3rem);\n font-weight: 700;\n background: linear-gradient(90deg, var(--accent-secondary), var(--accent-primary));\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n margin-bottom: 15px;\n }\n\n #oee-comparison-widget .subtitle {\n font-size: clamp(0.9rem, 2.2vw, 1.2rem);\n color: var(--text-secondary);\n max-width: 650px;\n margin: 0 auto;\n line-height: 1.5;\n }\n\n \/* Industry Tabs *\/\n #oee-comparison-widget .industry-tabs {\n display: flex;\n justify-content: center;\n gap: 8px;\n margin: 25px 0;\n flex-wrap: wrap;\n padding: 0 10px;\n }\n\n #oee-comparison-widget .industry-tab {\n padding: 12px 18px;\n background: var(--secondary-bg);\n border: 1px solid var(--border-color);\n border-radius: 25px;\n cursor: pointer;\n transition: all 0.3s ease;\n font-weight: 600;\n font-size: clamp(0.8rem, 2vw, 0.95rem);\n display: flex;\n align-items: center;\n gap: 8px;\n white-space: nowrap;\n backdrop-filter: blur(10px);\n }\n\n #oee-comparison-widget .industry-tab::before {\n font-size: 1.1em;\n }\n\n #oee-comparison-widget .industry-tab:hover {\n background: var(--card-bg);\n border-color: var(--accent-primary);\n transform: translateY(-2px);\n }\n\n #oee-comparison-widget .industry-tab.active {\n background: var(--accent-primary);\n color: #fff;\n border-color: var(--accent-primary);\n box-shadow: 0 0 20px rgba(77, 140, 255, 0.6);\n transform: translateY(-2px);\n }\n\n \/* Main Content Grid *\/\n #oee-comparison-widget .main-content {\n display: grid;\n grid-template-columns: 1fr;\n gap: 15px;\n margin-top: 20px;\n }\n\n \/* Panels *\/\n #oee-comparison-widget .panel {\n background: var(--card-bg);\n padding: 18px;\n border-radius: 15px;\n border: 1px solid var(--border-color);\n box-shadow: 0 8px 32px var(--shadow-color);\n backdrop-filter: blur(10px);\n display: flex;\n flex-direction: column;\n }\n\n #oee-comparison-widget .panel-title {\n font-size: clamp(1.1rem, 3vw, 1.4rem);\n color: var(--accent-secondary);\n margin-bottom: 18px;\n display: flex;\n align-items: center;\n gap: 10px;\n font-weight: 600;\n }\n \n #oee-comparison-widget .panel-title::before {\n font-size: 1.2em;\n width: 28px;\n text-align: center;\n }\n\n \/* Input Panel *\/\n #oee-comparison-widget .input-group {\n margin-bottom: 18px;\n }\n\n #oee-comparison-widget .input-group label {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 10px;\n color: var(--text-secondary);\n font-weight: 500;\n font-size: clamp(0.9rem, 2.5vw, 1rem);\n }\n\n #oee-comparison-widget .slider-value {\n font-weight: 700;\n color: var(--text-primary);\n font-size: clamp(0.95rem, 2.5vw, 1.1rem);\n }\n\n #oee-comparison-widget input[type=\"range\"] {\n -webkit-appearance: none;\n appearance: none;\n width: 100%;\n height: 12px;\n background: var(--secondary-bg);\n border-radius: 6px;\n outline: none;\n transition: opacity 0.2s;\n border: 1px solid var(--border-color);\n }\n\n #oee-comparison-widget input[type=\"range\"]::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 28px;\n height: 28px;\n background: var(--accent-primary);\n border-radius: 50%;\n cursor: pointer;\n border: 3px solid var(--secondary-bg);\n box-shadow: 0 0 15px rgba(77, 140, 255, 0.8);\n transition: all 0.2s ease;\n }\n\n #oee-comparison-widget input[type=\"range\"]::-webkit-slider-thumb:hover {\n transform: scale(1.1);\n box-shadow: 0 0 20px rgba(77, 140, 255, 1);\n }\n\n #oee-comparison-widget input[type=\"range\"]::-moz-range-thumb {\n width: 28px;\n height: 28px;\n background: var(--accent-primary);\n border-radius: 50%;\n cursor: pointer;\n border: 3px solid var(--secondary-bg);\n box-shadow: 0 0 15px rgba(77, 140, 255, 0.8);\n }\n\n \/* Results Panel *\/\n #oee-comparison-widget .oee-score-wrapper {\n text-align: center;\n margin-bottom: 20px;\n }\n\n #oee-comparison-widget .oee-score-label {\n font-size: clamp(1rem, 3vw, 1.2rem);\n color: var(--text-secondary);\n margin-bottom: 5px;\n }\n\n #oee-comparison-widget .oee-score-value {\n font-size: clamp(2.8rem, 12vw, 4.8rem);\n font-weight: 800;\n line-height: 1.1;\n background: linear-gradient(90deg, var(--accent-secondary), var(--accent-primary));\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n }\n\n #oee-comparison-widget .performance-status {\n text-align: center;\n font-weight: 500;\n padding: 12px;\n border-radius: 10px;\n margin-bottom: 20px;\n font-size: clamp(0.9rem, 2.5vw, 1rem);\n }\n\n #oee-comparison-widget .status-poor { \n background-color: rgba(239, 68, 68, 0.2); \n color: var(--danger);\n border: 1px solid rgba(239, 68, 68, 0.4);\n }\n #oee-comparison-widget .status-average { \n background-color: rgba(245, 158, 11, 0.2); \n color: var(--warning);\n border: 1px solid rgba(245, 158, 11, 0.4);\n }\n #oee-comparison-widget .status-good { \n background-color: rgba(16, 185, 129, 0.2); \n color: var(--success);\n border: 1px solid rgba(16, 185, 129, 0.4);\n }\n\n \/* Comparison Table - Mobile First *\/\n #oee-comparison-widget .comparison-table {\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n #oee-comparison-widget .comparison-table thead { display: none; }\n #oee-comparison-widget .comparison-table tbody,\n #oee-comparison-widget .comparison-table tr {\n display: contents;\n }\n \n #oee-comparison-widget .comparison-row {\n background: var(--secondary-bg);\n border-radius: 10px;\n border: 1px solid var(--border-color);\n padding: 15px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n \n #oee-comparison-widget .comparison-row .metric-name {\n font-size: clamp(1.1rem, 3vw, 1.3rem);\n font-weight: 700;\n color: var(--accent-secondary);\n text-align: center;\n padding-bottom: 8px;\n border-bottom: 1px solid var(--border-color);\n }\n \n #oee-comparison-widget .comparison-row .data-point {\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-size: clamp(0.9rem, 2.5vw, 1rem);\n padding: 2px 0;\n }\n \n #oee-comparison-widget .data-point .label {\n color: var(--text-secondary);\n font-weight: 500;\n }\n \n #oee-comparison-widget .data-point .value {\n font-weight: 600;\n font-size: clamp(0.95rem, 2.5vw, 1.1rem);\n }\n \n #oee-comparison-widget .data-point .user-value { color: var(--text-primary); }\n #oee-comparison-widget .data-point .industry-value { color: var(--text-secondary); }\n #oee-comparison-widget .data-point .best-value { color: var(--success); }\n\n \/* Chart Container *\/\n #oee-comparison-widget .chart-container {\n margin-top: 0;\n }\n \n #oee-comparison-widget #oeeChart {\n max-height: 280px;\n width: 100%;\n }\n \n \/* Footer *\/\n #oee-comparison-widget footer {\n text-align: center;\n padding: 20px 10px 10px;\n margin-top: 20px;\n color: var(--text-secondary);\n font-size: clamp(0.8rem, 2vw, 0.9rem);\n border-top: 1px solid var(--border-color);\n }\n\n \/* Responsive Breakpoints *\/\n @media (min-width: 480px) {\n #oee-comparison-widget {\n padding: 15px;\n }\n \n #oee-comparison-widget .panel {\n padding: 20px;\n }\n \n #oee-comparison-widget .industry-tabs {\n gap: 10px;\n }\n }\n\n @media (min-width: 768px) {\n #oee-comparison-widget {\n padding: 25px;\n }\n \n #oee-comparison-widget .main-content {\n grid-template-columns: 1fr 1.2fr;\n gap: 20px;\n }\n \n #oee-comparison-widget .chart-container {\n grid-column: 1 \/ -1;\n }\n \n #oee-comparison-widget #oeeChart {\n max-height: 320px;\n }\n \n #oee-comparison-widget .industry-tabs {\n gap: 12px;\n }\n }\n \n @media (min-width: 1024px) {\n #oee-comparison-widget .main-content {\n grid-template-columns: 1fr 1fr;\n gap: 25px;\n }\n \n #oee-comparison-widget .panel {\n padding: 25px;\n }\n \n \/* Restore table for desktop *\/\n #oee-comparison-widget .comparison-table {\n display: table;\n border-collapse: collapse;\n width: 100%;\n }\n \n #oee-comparison-widget .comparison-table thead {\n display: table-header-group;\n }\n \n #oee-comparison-widget .comparison-table thead th {\n padding: 12px 8px;\n text-align: center;\n color: var(--text-secondary);\n font-size: 0.95rem;\n font-weight: 600;\n border-bottom: 2px solid var(--border-color);\n background: var(--secondary-bg);\n }\n \n #oee-comparison-widget .comparison-table thead th:first-child {\n text-align: left;\n border-radius: 8px 0 0 0;\n }\n \n #oee-comparison-widget .comparison-table thead th:last-child {\n border-radius: 0 8px 0 0;\n }\n \n #oee-comparison-widget .comparison-table tbody {\n display: table-row-group;\n }\n \n #oee-comparison-widget .comparison-table tr {\n display: table-row;\n }\n \n #oee-comparison-widget .comparison-row {\n display: table-row;\n background: none;\n border: none;\n padding: 0;\n border-radius: 0;\n }\n \n #oee-comparison-widget .comparison-row:hover {\n background: rgba(77, 140, 255, 0.1);\n }\n \n #oee-comparison-widget .comparison-row .metric-name,\n #oee-comparison-widget .comparison-row .data-point {\n display: table-cell;\n padding: 12px 8px;\n text-align: center;\n vertical-align: middle;\n border-bottom: 1px solid var(--border-color);\n }\n \n #oee-comparison-widget .comparison-row .metric-name {\n text-align: left;\n font-weight: 500;\n font-size: 1rem;\n color: var(--text-secondary);\n border-bottom: 1px solid var(--border-color);\n }\n \n #oee-comparison-widget .data-point .label {\n display: none;\n }\n \n #oee-comparison-widget .data-point .value {\n font-size: 1.05rem;\n display: block;\n width: 100%;\n }\n \n #oee-comparison-widget #oeeChart {\n max-height: 350px;\n }\n }\n\n @media (min-width: 1200px) {\n #oee-comparison-widget .main-content {\n gap: 30px;\n }\n \n #oee-comparison-widget .panel {\n padding: 30px;\n }\n }\n <\/style>\n\n <div class=\"widget-container\">\n <header>\n <h1>OEE Performance Matrix<\/h1>\n <p class=\"subtitle\">Benchmark your Overall Equipment Effectiveness against real industry standards. Compare your manufacturing performance with industry averages and world-class facilities.<\/p>\n <\/header>\n\n <div class=\"industry-tabs\">\n <div class=\"industry-tab icon-car active\" data-industry=\"automotive\">\n Automotive Parts\n <\/div>\n <div class=\"industry-tab icon-box\" data-industry=\"packaging\">\n Packaging\n <\/div>\n <div class=\"industry-tab icon-food\" data-industry=\"food\">\n Food & Beverage\n <\/div>\n <\/div>\n\n <main class=\"main-content\">\n <div class=\"panel input-panel\">\n <h2 class=\"panel-title icon-sliders\">Your Plant’s Performance<\/h2>\n <div class=\"input-group\">\n <label for=\"availability\">\n <span>Availability (Uptime %)<\/span> \n <span id=\"availability-value\" class=\"slider-value\">85%<\/span>\n <\/label>\n <input type=\"range\" min=\"0\" max=\"100\" value=\"85\" id=\"availability\" step=\"0.1\">\n <\/div>\n <div class=\"input-group\">\n <label for=\"performance\">\n <span>Performance (Speed %)<\/span> \n <span id=\"performance-value\" class=\"slider-value\">80%<\/span>\n <\/label>\n <input type=\"range\" min=\"0\" max=\"100\" value=\"80\" id=\"performance\" step=\"0.1\">\n <\/div>\n <div class=\"input-group\">\n <label for=\"quality\">\n <span>Quality (First Pass Yield %)<\/span> \n <span id=\"quality-value\" class=\"slider-value\">95%<\/span>\n <\/label>\n <input type=\"range\" min=\"0\" max=\"100\" value=\"95\" id=\"quality\" step=\"0.1\">\n <\/div>\n <\/div>\n\n <div class=\"panel results-panel\">\n <h2 class=\"panel-title icon-chart\">Your OEE Results<\/h2>\n <div class=\"oee-score-wrapper\">\n <div class=\"oee-score-label\">Overall Equipment Effectiveness<\/div>\n <div id=\"oee-result\" class=\"oee-score-value\">64.6%<\/div>\n <\/div>\n <div id=\"performance-status\" class=\"performance-status\"><\/div>\n \n <table class=\"comparison-table\">\n <thead>\n <tr>\n <th>Metric<\/th>\n <th>Your Plant<\/th>\n <th>Industry Avg.<\/th>\n <th>World Class<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr class=\"comparison-row\">\n <td class=\"metric-name\">OEE<\/td>\n <td class=\"data-point\">\n <span class=\"label\">Your Plant<\/span>\n <span class=\"value user-value\" id=\"table-oee-user\">64.6%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">Industry Avg.<\/span>\n <span class=\"value industry-value\" id=\"table-oee-avg\">67%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">World Class<\/span>\n <span class=\"value best-value\" id=\"table-oee-best\">85%<\/span>\n <\/td>\n <\/tr>\n <tr class=\"comparison-row\">\n <td class=\"metric-name\">Availability<\/td>\n <td class=\"data-point\">\n <span class=\"label\">Your Plant<\/span>\n <span class=\"value user-value\" id=\"table-availability-user\">85.0%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">Industry Avg.<\/span>\n <span class=\"value industry-value\" id=\"table-availability-avg\">89%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">World Class<\/span>\n <span class=\"value best-value\" id=\"table-availability-best\">90%<\/span>\n <\/td>\n <\/tr>\n <tr class=\"comparison-row\">\n <td class=\"metric-name\">Performance<\/td>\n <td class=\"data-point\">\n <span class=\"label\">Your Plant<\/span>\n <span class=\"value user-value\" id=\"table-performance-user\">80.0%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">Industry Avg.<\/span>\n <span class=\"value industry-value\" id=\"table-performance-avg\">78%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">World Class<\/span>\n <span class=\"value best-value\" id=\"table-performance-best\">95%<\/span>\n <\/td>\n <\/tr>\n <tr class=\"comparison-row\">\n <td class=\"metric-name\">Quality<\/td>\n <td class=\"data-point\">\n <span class=\"label\">Your Plant<\/span>\n <span class=\"value user-value\" id=\"table-quality-user\">95.0%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">Industry Avg.<\/span>\n <span class=\"value industry-value\" id=\"table-quality-avg\">97%<\/span>\n <\/td>\n <td class=\"data-point\">\n <span class=\"label\">World Class<\/span>\n <span class=\"value best-value\" id=\"table-quality-best\">99.9%<\/span>\n <\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n \n <div class=\"panel chart-container\">\n <h2 class=\"panel-title icon-chart\">Performance Comparison Chart<\/h2>\n <canvas id=\"oeeChart\"><\/canvas>\n <\/div>\n <\/main>\n\n <footer>\n <p>© 2025 OEE Performance Matrix. Real-time benchmarking for manufacturing excellence.<\/p>\n <\/footer>\n <\/div>\n\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js@4.4.2\/dist\/chart.umd.min.js\"><\/script>\n <script>\n (function() {\n \/\/ Wait for Chart.js to load\n function waitForChart() {\n if (typeof Chart === 'undefined') {\n setTimeout(waitForChart, 100);\n return;\n }\n initializeWidget();\n }\n\n function initializeWidget() {\n const widget = document.getElementById('oee-comparison-widget');\n if (!widget) return;\n\n const availabilitySlider = widget.querySelector('#availability');\n const performanceSlider = widget.querySelector('#performance');\n const qualitySlider = widget.querySelector('#quality');\n\n const availabilityValue = widget.querySelector('#availability-value');\n const performanceValue = widget.querySelector('#performance-value');\n const qualityValue = widget.querySelector('#quality-value');\n\n const oeeResult = widget.querySelector('#oee-result');\n const performanceStatus = widget.querySelector('#performance-status');\n const industryTabs = widget.querySelectorAll('.industry-tab');\n\n \/\/ Industry-specific benchmarks based on real manufacturing data and studies\n const benchmarks = {\n automotive: { \n name: \"Automotive Parts Manufacturing\", \n oee: { avg: 58, best: 82 }, \n availability: { avg: 84, best: 90 }, \n performance: { avg: 73, best: 95 }, \n quality: { avg: 94.2, best: 99.5 },\n description: \"High precision requirements with complex supply chains\"\n },\n packaging: { \n name: \"Packaging Manufacturing\", \n oee: { avg: 71, best: 88 }, \n availability: { avg: 89, best: 94 }, \n performance: { avg: 82, best: 96 }, \n quality: { avg: 97.5, best: 99.8 },\n description: \"High-speed operations with focus on efficiency\"\n },\n food: { \n name: \"Food & Beverage Processing\", \n oee: { avg: 60, best: 79 }, \n availability: { avg: 81, best: 87 }, \n performance: { avg: 77, best: 92 }, \n quality: { avg: 96.8, best: 99.2 },\n description: \"Strict hygiene standards with batch processing constraints\"\n }\n };\n\n let currentIndustry = \"automotive\";\n let oeeChart = null;\n\n function calculateAndRender() {\n const availability = parseFloat(availabilitySlider.value);\n const performance = parseFloat(performanceSlider.value);\n const quality = parseFloat(qualitySlider.value);\n\n \/\/ Update slider displays\n availabilityValue.textContent = availability.toFixed(1) + '%';\n performanceValue.textContent = performance.toFixed(1) + '%';\n qualityValue.textContent = quality.toFixed(1) + '%';\n\n \/\/ Calculate OEE: OEE = Availability \u00d7 Performance \u00d7 Quality\n const oee = (availability \/ 100) * (performance \/ 100) * (quality \/ 100) * 100;\n oeeResult.textContent = oee.toFixed(1) + '%';\n\n const industryData = benchmarks[currentIndustry];\n\n \/\/ Update performance status with industry-specific context\n performanceStatus.classList.remove('status-poor', 'status-average', 'status-good');\n if (oee < industryData.oee.avg) {\n performanceStatus.textContent = `Below ${industryData.name} average (${industryData.oee.avg}%). ${industryData.description} - Focus on improvement opportunities.`;\n performanceStatus.classList.add('status-poor');\n } else if (oee < industryData.oee.best) {\n performanceStatus.textContent = `Above ${industryData.name} average! Good performance with potential for world-class optimization.`;\n performanceStatus.classList.add('status-average');\n } else {\n performanceStatus.textContent = `Exceptional ${industryData.name} performance! You're operating at world-class levels.`;\n performanceStatus.classList.add('status-good');\n }\n\n \/\/ Update comparison table\n widget.querySelector('#table-oee-user').textContent = oee.toFixed(1) + '%';\n widget.querySelector('#table-availability-user').textContent = availability.toFixed(1) + '%';\n widget.querySelector('#table-performance-user').textContent = performance.toFixed(1) + '%';\n widget.querySelector('#table-quality-user').textContent = quality.toFixed(1) + '%';\n\n widget.querySelector('#table-oee-avg').textContent = industryData.oee.avg + '%';\n widget.querySelector('#table-availability-avg').textContent = industryData.availability.avg + '%';\n widget.querySelector('#table-performance-avg').textContent = industryData.performance.avg + '%';\n widget.querySelector('#table-quality-avg').textContent = industryData.quality.avg + '%';\n\n widget.querySelector('#table-oee-best').textContent = industryData.oee.best + '%';\n widget.querySelector('#table-availability-best').textContent = industryData.availability.best + '%';\n widget.querySelector('#table-performance-best').textContent = industryData.performance.best + '%';\n widget.querySelector('#table-quality-best').textContent = industryData.quality.best + '%';\n\n updateChart(availability, performance, quality, industryData);\n }\n\n function updateChart(availability, performance, quality, industryData) {\n if (!oeeChart) return;\n \n oeeChart.data.datasets[0].data = [availability, performance, quality];\n oeeChart.data.datasets[1].data = [\n industryData.availability.avg, \n industryData.performance.avg, \n industryData.quality.avg\n ];\n oeeChart.data.datasets[2].data = [\n industryData.availability.best, \n industryData.performance.best, \n industryData.quality.best\n ];\n oeeChart.update('none');\n }\n\n function initChart() {\n const ctx = widget.querySelector('#oeeChart');\n if (!ctx) return;\n \n const context = ctx.getContext('2d');\n if (oeeChart) {\n oeeChart.destroy();\n }\n \n oeeChart = new Chart(context, {\n type: 'bar',\n data: {\n labels: ['Availability', 'Performance', 'Quality'],\n datasets: [\n { \n label: 'Your Plant', \n data: [85, 80, 95], \n backgroundColor: 'rgba(77, 140, 255, 0.8)', \n borderColor: 'rgba(77, 140, 255, 1)', \n borderWidth: 2,\n borderRadius: 6,\n borderSkipped: false\n },\n { \n label: 'Industry Average', \n data: [84, 73, 94.2], \n backgroundColor: 'rgba(164, 195, 255, 0.6)', \n borderColor: 'rgba(164, 195, 255, 1)', \n borderWidth: 2,\n borderRadius: 6,\n borderSkipped: false\n },\n { \n label: 'World Class', \n data: [90, 95, 99.5], \n backgroundColor: 'rgba(16, 185, 129, 0.7)', \n borderColor: 'rgba(16, 185, 129, 1)', \n borderWidth: 2,\n borderRadius: 6,\n borderSkipped: false\n }\n ]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n interaction: {\n intersect: false,\n mode: 'index'\n },\n scales: {\n y: { \n beginAtZero: true, \n max: 100,\n grid: { \n color: 'rgba(255, 255, 255, 0.1)',\n drawBorder: false\n }, \n ticks: { \n color: '#a4c3ff', \n callback: value => value + '%',\n font: { size: 11 }\n }\n },\n x: { \n grid: { display: false }, \n ticks: { \n color: '#a4c3ff',\n font: { size: 11 }\n }\n }\n },\n plugins: {\n legend: { \n position: 'top', \n labels: { \n color: '#e0e7ff',\n font: { size: 12 },\n padding: 15,\n usePointStyle: true,\n pointStyle: 'rect'\n }\n },\n tooltip: { \n backgroundColor: 'rgba(13, 26, 53, 0.95)',\n titleColor: '#e0e7ff',\n bodyColor: '#a4c3ff',\n borderColor: 'rgba(77, 140, 255, 0.5)',\n borderWidth: 1,\n cornerRadius: 8,\n callbacks: { \n label: context => `${context.dataset.label}: ${context.parsed.y.toFixed(1)}%`\n }\n }\n },\n animation: {\n duration: 750,\n easing: 'easeInOutQuart'\n }\n }\n });\n }\n\n \/\/ Industry tab switching\n industryTabs.forEach(tab => {\n tab.addEventListener('click', () => {\n industryTabs.forEach(t => t.classList.remove('active'));\n tab.classList.add('active');\n currentIndustry = tab.dataset.industry;\n calculateAndRender();\n });\n });\n\n \/\/ Slider event listeners\n [availabilitySlider, performanceSlider, qualitySlider].forEach(slider => {\n slider.addEventListener('input', calculateAndRender);\n });\n\n \/\/ Initialize chart and calculations\n initChart();\n calculateAndRender();\n }\n\n \/\/ Start the initialization process\n waitForChart();\n })();\n <\/script>\n<\/div>\n\n<\/body>\n<\/html>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Aligning OEE with Broader Operational Goals<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">To effectively align OEE with your organization\u2019s broader operational goals, follow these steps:<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>1. Define Clear Objectives<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Link OEE improvements to outcomes like cost reduction, increased throughput, and better product quality.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>2. Integrate OEE Into Strategic Planning<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Ensure OEE tracking is part of production planning and decision-making processes for resource allocation and priorities.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>3. Foster Cross-Department Collaboration<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Break down silos between production, maintenance, and quality teams to collectively address inefficiencies affecting OEE.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>4. Invest in Technology and Automation<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Leverage tools such as manufacturing execution systems (MES) and IoT devices to automate and analyze OEE data in real time.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>5. Encourage a Culture of Continuous Improvement<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Regularly review OEE data to identify bottlenecks, implement solutions, and foster a mindset of ongoing optimization.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>6. Set Realistic Benchmarks<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Use industry standards and historical performance data to set achievable OEE targets aligned with operational goals.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>7. Provide Training and Education<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Educate employees on how their daily actions impact OEE and the organization\u2019s overall success.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>8. Communicate Results and Impacts<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Share OEE performance updates regularly, emphasizing how improvements enhance efficiency and drive success.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>9. Align OEE with Proactive Maintenance<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Use OEE monitoring data to drive predictive and preventive maintenance, reducing downtime and improving reliability.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>10. Incentivize Performance Improvements<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Recognize and reward teams or individuals for achieving OEE improvements to reinforce its strategic importance.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Common Obstacles to Consistent OEE Monitoring<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Achieving consistent OEE monitoring often presents challenges for manufacturers. Issues like incomplete or inaccurate data collection, reliance on outdated systems, and a lack of standardization in metrics can hinder accurate calculations. Resistance to change and inadequate training can further prevent teams from fully embracing OEE practices. Additionally, disconnected systems and misaligned organizational goals may create silos, making it difficult to integrate and analyze performance data effectively. Resource constraints, such as limited budgets or staffing, can deprioritize OEE tracking, while a short-term focus on immediate production targets often overshadows long-term efficiency improvements. To overcome these barriers, manufacturers must invest in the right tools, foster a culture of continuous improvement, and align OEE monitoring with broader operational goals.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Final Thoughts on OEE Comparison Matrix<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Understanding your OEE relative to others provides a useful perspective. This matrix highlights performance gaps and opportunities. Regular benchmarking helps track progress toward better efficiency. The insights can guide decisions about where to allocate resources for maximum impact on production effectiveness.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What You Should Do Next <\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Explore the Shoplogix Blog<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Now that you know more about our OEE comparison matrix, why not check out our other blog posts? It’s full of useful articles, professional advice, and updates on the latest trends that can help keep your operations up-to-date. Take a look and find out more about what’s happening in your industry. <strong><a href=\"https:\/\/shoplogix.com\/blogs\/\">Read More<\/a><\/strong><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Request a Demo <\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Learn more about how our product, Smart Factory Suite, can drive productivity and overall equipment effectiveness (OEE) across your manufacturing floor. Schedule a meeting with a member of the Shoplogix team to learn more about our solutions and align them with your manufacturing data and technology needs. <strong><a href=\"https:\/\/shoplogix.com\/contact-information\/\">Request Demo<\/a><\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>The OEE Comparison Matrix helps manufacturers understand their production efficiency. This tool compares your equipment effectiveness to industry standards. It shows where your operation stands and identifies potential improvement areas. How to Use the OEE Comparison Matrix This tool is for production managers, plant supervisors, and operations teams. Adjust the sliders to match your current […]<\/p>\n","protected":false},"author":10,"featured_media":9558,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"blog_single.php","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[46],"tags":[231],"class_list":["post-9557","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-new","tag-slimme-fabriek"],"acf":[],"_links":{"self":[{"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/posts\/9557","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/comments?post=9557"}],"version-history":[{"count":0,"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/posts\/9557\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/media\/9558"}],"wp:attachment":[{"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/media?parent=9557"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/categories?post=9557"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/shoplogix.com\/fr\/wp-json\/wp\/v2\/tags?post=9557"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":9557,"date":"2025-06-19T20:08:17","date_gmt":"2025-06-19T20:08:17","guid":{"rendered":"https:\/\/shoplogix.com\/oee-comparison-matrix\/"},"modified":"2025-06-19T20:15:04","modified_gmt":"2025-06-19T20:15:04","slug":"oee-comparison-matrix","status":"publish","type":"post","link":"https:\/\/shoplogix.com\/fr\/blog\/oee-comparison-matrix\/","title":{"rendered":"Interactive OEE Comparison Matrix Tool: See How Your Manufacturing Performs"},"content":{"rendered":"\n

The OEE Comparison Matrix helps manufacturers understand their production efficiency. This tool compares your equipment effectiveness to industry standards. It shows where your operation stands and identifies potential improvement areas.<\/p>\n\n\n\n