MITRE: SCOUT - Security & Compliance Orchestration Unified Toolkit
MITRE: SCOUT - Security & Compliance Orchestration Unified Toolkit
MITRE: SCOUT - Security & Compliance Orchestration Unified Toolkit
Expediting internal workflows by centralizing security and compliance tools
Expediting internal workflows by centralizing security and compliance tools
Expediting internal workflows by centralizing security and compliance tools
Role
Role
Role
Sole UI/UX Designer
Sole UI/UX Designer
Duration
Duration
Duration
Feb - Apr '26
Feb - Apr '26
Context
Context
Fourteen students were chosen to work under the supervision of Dylan Gao (MITRE) through University of Maryland's App Development Club. The team comprised a project lead, 2 tech leads, a project manager, and 9 engineers, while I served as the UI/UX designer.
Fourteen students were chosen to work under the supervision of Dylan Gao (MITRE) through University of Maryland's App Development Club. The team comprised a project lead, 2 tech leads, a project manager, and 9 engineers, while I served as the UI/UX designer.
Problem
Problem
Cybersecurity professionals need to adhere to multiple security frameworks, each maintained independently. Without a centralized tool, teams must manually cross-reference frameworks, often missing critical updates which leads to compliance gaps and audit failures.
Cybersecurity professionals need to adhere to multiple security frameworks, each maintained independently. Without a centralized tool, teams must manually cross-reference frameworks, often missing critical updates which leads to compliance gaps and audit failures.
Solution
Solution
We produced a web application that aggregates cybersecurity frameworks, maps equivalent policies, and enables teams to build and export RACI matrices with update notifications in a single searchable platform abbreviated as SCOUT.
We produced a web application that aggregates cybersecurity frameworks, maps equivalent policies, and enables teams to build and export RACI matrices with update notifications in a single searchable platform abbreviated as SCOUT.
Scope
Scope
UI/UX
Web Design
Prototyping
Tools
Tools
Figma
Figma Make
FigJam
Impact
Impact
$84.3M IT budget …
$84.3M IT budget …
$84.3M IT budget …
that SCOUT is built to support
that SCOUT is built to support
10,374 employees …
across divisions whom benefit from centralized compliance tracking
across divisions whom benefit from centralized compliance tracking
Scalable infrastructure …
Scalable infrastructure …
Scalable infrastructure …
supporting concurrent framework tracking and policy alignment org-wide
supporting concurrent framework tracking and policy alignment org-wide
*Sources:
*Sources: MITRE FY2024 IRS Form 990 (Parts IX and I)
(Parts IX and I)
Research
Tasks Assigned
Tasks Assigned
Build a web interface that scrapes major regulatory bodies and alerts when new guidelines or laws are published
Create a data cross-walking tool mapping related policies across different frameworks
Create a tool to generate RACI chart and timeframe
Establish a centralized hub or search that uses frameworks to help users identify/export cybersecurity guidance
Build a web interface that scrapes major regulatory bodies and alerts when new guidelines or laws are published
Create a data cross-walking tool mapping related policies across different frameworks
Create a tool to generate RACI chart and timeframe
Establish a centralized hub or search that uses frameworks to help users identify/export cybersecurity guidance
Cross-Framework Mapping
Cross-Framework Mapping
Potential Benefit
Potential Benefit
Cost/Time reduction: need to comply with multiple frameworks; allows auditing of 1 policy to check policies in other frameworks
Cost/Time reduction: need to comply with multiple frameworks; allows auditing of 1 policy to check policies in other frameworks
MITRE-specific scaling: ties together MITRE ATT&CK and MITRE DEF3ND functions, listing potential threats and corresponding defenses to specific policies; include suggestion of tools from MITRE operations in their Center for Threat-Informed Defense for threat detection/defense
MITRE-specific scaling: ties together MITRE ATT&CK and MITRE DEF3ND functions, listing potential threats and corresponding defenses to specific policies; include suggestion of tools from MITRE operations in their Center for Threat-Informed Defense for threat detection/defense
Userflow
Userflow
Questions Asked
Questions Asked
Log-in screen: no need; would go through MITRE's established security system/log-in process
Log-in screen: no need; would go through MITRE's established security system/log-in process
Scope: would be an internal tool, although scope seemed plausible to develop into a business-to-business type of service
Scope: would be an internal tool, although scope seemed plausible to develop into a business-to-business type of service
Design
Design
Style Guide
Style Guide
Website
Website
Color Palette
Color Palette
Primary
Hex: #0A2438
RGB: 10, 36, 56
CMYK: 82%, 36%, 0%, 78%
Primary
Hex: #0A2438
RGB: 10, 36, 56
CMYK: 82%, 36%, 0%, 78%
Secondary
Hex: #375770
RGB: 55, 87, 112
CMYK: 51%, 22%, 0%, 56%
Secondary
Hex: #375770
RGB: 55, 87, 112
CMYK: 51%, 22%, 0%, 56%
Secondary
Hex: #E5E5E5
RGB: 229, 229, 229
CMYK: 0%, 0%, 0%, 10%
Secondary
Hex: #E5E5E5
RGB: 229, 229, 229
CMYK: 0%, 0%, 0%, 10%
Neutral
Hex: #FFFFFF
RGB: 225, 225, 225
CMYK: 0%, 0%, 0%, 0%
Neutral
Hex: #FFFFFF
RGB: 225, 225, 225
CMYK: 0%, 0%, 0%, 0%
Neutral
Hex: #000000
RGB: 0, 0, 0
CMYK: 0%, 0%, 0%, 100%
Neutral
Hex: #000000
RGB: 0, 0, 0
CMYK: 0%, 0%, 0%, 100%
Accent
Hex: #9F2D00
RGB: 159, 45, 0
CMYK: 0%, 72%, 100%, 38%
Accent
Hex: #9F2D00
RGB: 159, 45, 0
CMYK: 0%, 72%, 100%, 38%
Contrast Ratios
Contrast Ratios
Neutral-Light on Neutral-Dark
21
Neutral-Light on Neutral-Dark
21
Neutral-Light on Neutral-Dark
21
Neutral-Light on Primary
15.88
Neutral-Light on Primary
15.88
Neutral-Light on Primary
15.88
Neutral-Light on Secondary-Dark
7.61
Neutral-Light on Secondary-Dark
7.61
Neutral-Light on Secondary-Dark
7.61
Neutral-Dark on Secondary-Light
16.67
Neutral-Dark on Secondary-Light
16.67
Neutral-Dark on Secondary-Light
16.67
Neutral-Dark on Neutral-Light
21
Neutral-Dark on Neutral-Light
21
Neutral-Dark on Neutral-Light
21
Neutral-Light on Accent
7.37
Neutral-Light on Accent
7.37
Neutral-Light on Accent
7.37
Wireframes
Wireframes
Database Search Page
Database Search Page
Single Policy Page
Single Policy Page
Alerts Page
Alerts Page
Matrix Page
Matrix Page
Landing Page
Landing Page
Cyber-security Policy Database
Cyber-security Policy Database
First priority, most engineering-heavy
First priority, most engineering-heavy
Issue Encountered
Issue Encountered
Very data-heavy; time-consuming to manually input different data for multiple policy cards
Very data-heavy; time-consuming to manually input different data for multiple policy cards
Figma Make
Figma Make
Used to generate dummy data
Provided additional layouts/iterations
Used to generate dummy data
Provided additional layouts/iterations
AI Prompt
AI Prompt
"Make a browsing page for a web application in a database centralizing cybersecurity policies from multiple frameworks, allowing users to filter and sort results based on the framework the policy was found in."
"Make a browsing page for a web application in a database centralizing cybersecurity policies from multiple frameworks, allowing users to filter and sort results based on the framework the policy was found in."
Manual Changes
Manual Changes
Resizing: designed with 1440 px width; imported Make frame had 1099 px width
Resizing: designed with 1440 px width; imported Make frame had 1099 px width
Layout inconsistencies: first and last rows of grid set to height of 271.29 Fill while other rows set to 244.38 Fill and body texts didn't fill width of frame within each policy card; paired with frame resizing, easier to redesign entire grid but keep dummy data
Layout inconsistencies: first and last rows of grid set to height of 271.29 Fill while other rows set to 244.38 Fill and body texts didn't fill width of frame within each policy card; paired with frame resizing, easier to redesign entire grid but keep dummy data
Minor adjustments: header content and spacing, font, colors used, additional navigation
Minor adjustments: header content and spacing, font, colors used, additional navigation
Completed Database Flow
Completed Database Flow
RACI Matrix
RACI Matrix
Goal
Goal
Edit and export functions for a Responsible, Accountable, Consulted, and Informed Chart
Edit and export functions for a Responsible, Accountable, Consulted, and Informed Chart
Completed Matrix Flow
Completed Matrix Flow
Alerts Page
Alerts Page
Goal
Goal
List of updates in chronological order, with current week's under "New Updates" and earlier updates listed below. Repurposed the policy cards from the database.
List of updates in chronological order, with current week's under "New Updates" and earlier updates listed below. Repurposed the policy cards from the database.
Completed Page with Edge Case
Completed Page with Edge Case
Landing Page
Landing Page
Issue Encountered
Issue Encountered
Struggled with how to present website with 2 major, distinct functions; little to no related inspiration online
Struggled with how to present website with 2 major, distinct functions; little to no related inspiration online
Figma Make Prompt
Figma Make Prompt
"Add a landing page that allows the user to navigate to the cybersecurity policy database as well as a RACI matrix for the company."
"Add a landing page that allows the user to navigate to the cybersecurity policy database as well as a RACI matrix for the company."
Thoughts
Wanted similar design to MITRE's website, with images and bold headings
Iteration
Final Design
Thoughts
Wanted similar design to MITRE's website, with images and bold headings
Final Design
Iteration
Thoughts
Wanted similar design to MITRE's website, with images and bold headings
Final Design
Iteration
Reflection
Restrictions
Restrictions
Many cyber-security frameworks are placed behind security clearance restrictions which students do not have access to. Because of this, our data was limited to open access sources which were manually scraped.
Many cyber-security frameworks are placed behind security clearance restrictions which students do not have access to. Because of this, our data was limited to open access sources which were manually scraped.
Developments
Developments
The website can be further developed at the company with higher clearance, exploring policy scraping automation. Connecting the updates page with email alerts could help with implementing the toolkit into worker routines.
The website can be further developed at the company with higher clearance, exploring policy scraping automation. Connecting the updates page with email alerts could help with implementing the toolkit into worker routines.