AI-Powered Dashboard
HIGHLIGHTS
Led visual and interaction design for high-fidelity wireframes of a new military dashboard featuring AI chat capabilities.
Guided the team from design brief to low- and high-fidelity prototypes under a tight deadline, enabling presentation of the product concept to executive-level military leadership.
Created a prototype that generated enthusiasm and secured buy-in for a tool designed to help military personnel worldwide communicate more efficiently and effectively.
Collaborated closely with an agile, cross-functional team of engineers and project managers, continuously iterating based on real-time feedback.
Visualized realistic user flows that helped engineering teams identify and address implementation challenges early in the development process.
Due to the classified nature of this work, some content has been redacted or recreated to respect confidentiality agreements and security protocols.
CONTEXT
Military users are often required to intake and digest several sources of information to create communications.
How can we take advantage of the replicability of these processes and also make it easier using advancements in AI?
GOAL
Create a dashboard that enables military users to track and organize their communications, enabling them to quickly build off of prior work. Integrate an AI-powred Chat Assistant that guides users through new developing new communications.
APPROACH
I applied the Nielsen Norman Group’s design thinking framework to guide wireframe development.
Given the agile nature of the project, I iterated the wireframes continuously based on ongoing feedback from our cross-functional team.
This allowed us to refine the concept in real time, identify implementation challenges early, and ensure the design remained grounded in technical and organizational realities
ACTIVITIES
I empathized with stakeholders to understand their goals, constraints, and success criteria for the prototypes.
UNDERSTAND
-
Is there a style guide?
What is the expected timeline?
What are the main goals you want to achieve with this UI design?
Which devices & versions should be supported? (mobile, tablets, desktops).
-
When would a user encounter this product in their life? During what task?
This helps anchor the experience in a concrete moment and allows me to design outward from a critical use case.
Have any existing products come up in conversation during concept development?
Clients don’t always name specific sources of inspiration, but products often get mentioned informally. I listen for those cues to better understand expectations and mental models.
Should the wireframe focus narrowly on a specific moment in the user journey, or zoom out to show a broader context?
This helps anchor the experience in a concrete moment and allows me to design outward from a critical use case.
We created a user flow that I would use for the next stage of prototype development.
User Flow created in Figma’s FigJam
Ideate and create low fidelity sketches using placeholders for graphics. Hone the sequence of events and blocking in important interactions.
EXPLORE
Low-Fidelity Prototype
I blocked in key elements and interactions, then refined them iteratively based on feedback.
High-Fidelity Prototype
Once the foundational structure was in place, I moved on to detailing, such as establishing a color palette and selecting imagery with appropriate licenses.
To respect confidentiality agreements and security protocols, diagrams and prototypes on this page are recreations that illustrate the general design concepts, not the actual products of the project.
OUTCOMES
