Team Crossfire
Web design for Team Crossfire, a startup competing in the XPRIZE Wildfire competition, showcasing their innovative use of UAS, AI, and fire protection engineering to build sustainable wildfire detection and suppression solutions.
Role
Web Designer
Date
October 2024 (1 Month)
Organization
xFoundry
Scope of work
Website Design
Brand Design & Identity
Wireframing & Layout Design
Copywriting
High-Fidelity Prototyping
Website Development
00 Summary
The competition
Team Crossfire is competing in the four-year, $11 million XPRIZE Wildfire competition, which challenges innovators to develop advanced solutions for rapid wildfire detection, characterization, and response- helping communities safely coexist with beneficial wildfires. If successful, xFoundry plans to continue the venture beyond the competition, with testing in California, Maryland and eventual deployment across the United States.
TASK
Design and create high-fidelity prototypes for a website that effectively communicates Team Crossfire’s mission, their role in the XPRIZE competition, and what they are all about. This site will serve multiple audiences- researchers, partners, sponsors, and the general public through a design that is informative, visually impactful, and easy to navigate.
gOALS
Build a clear and compelling layout that showcases the team’s innovation and unique position in the competition.
Use visual storytelling to highlight the urgency of the wildfire crisis and the importance of Crossfire’s solution.
Design intuitive user flows and calls to action that encourage collaboration, engagement, and support for the team.
UNDERSTANDING THE PROBLEM
Analyzing the Old Website
A team with winning potential
The original site lacked a clear message. It didn’t highlight what made Crossfire unique, particularly, its affiliation with UMD, home to the top-ranked Fire Protection Engineering program in the U.S. This detail is critical: UMD’s access to specialized labs, faculty, and interdisciplinary innovation gives Crossfire a unique edge.
I reframed the messaging to position Crossfire as a strong competitor: a university-based team with real, research-backed potential to lead the future of wildfire protection.
Clarifying a Complex Solution
I focused on breaking down Team Crossfire's solution into a digestible, high-impact narrative.
“Autonomously detect a wildfire.
Assess its risk.
Suppress it- all within 10 minutes.”
This narrative painted the picture fast, making it the perfect hero message for the website. Before diving into technical partners or competition details, this messaging served as the perfect hook to get people on board with Crossfire's mission.
SITEMAP + INFORMATION ARCHITECTURE
Sitemap strategy
The sitemap outlined the purpose of the website and what key pages needed to be designed.
The primary audience for this website was potential partners and investors, the goal being to gain more support and resources for Team Crossfire's overall mission.
visual identity
Grounding the Site in Reality with Photography
It's easy for people to feel desensitized from the true destruction and concern that wildfires have on our environment. To bring visitors closer to the problem, I incorporated high-impact, full-width wildfire photography as much as possible.
Extending xFoundry's Brand
A VISUAL IDENTITY THAT TELLS A STORY
While staying consistent with xFoundry’s brand guidelines (typography, color palettes, tone), I introduced distinct visual elements that reflected Crossfire’s identity:
These choices came together to help illustrate the overall theme and story of Team Crossfire, supporting the user's journey while reading through the website.
final product
Landing Page
SETTING the story
The landing page begins the website experience with a bold introduction that communicates the core mission.
Introduces UMD's Fire Protection Engineering program to highlight Crossfire's 'secret weapon'.
The Wildfire Crisis
Addressing the problem
This page contextualizes the need for innovation and urgency of the problem using data visualization emulating fire.
About Page
Providing the Solution through “Crossfire”
"About Page" Hero with an informational video in the background.
Outlining Crossfire's Solution
Call to Action
Encouraging users to navigate to the "Get Involved page"- a centralized hub for researchers, sponsors, and the public to engage with the project.
final THOUGHTS
This fast-paced design project challenged me to apply visual storytelling in the format of a landing page and small-scale website. Owning the process from low- to high-fidelity design gave me significant influence over the overall layout, messaging hierarchy, and visual direction. It was a valuable opportunity to practice end-to-end design within a short timeframe- from structuring content to building out a full prototype.
& more…
If I had more time, I would have invested further in user research and competitive analysis to better understand how other XPRIZE teams are presenting themselves. This would have informed a stronger, more strategic approach to positioning Team Crossfire and maximizing the website’s impact in both the competition and outreach efforts.
