Terra App: Building Resilient Communities Through InnovationTerra App: Building Resilient Communities Through Innovation
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Alice's avatar
Alice D.
pro
• 11h
Terra: Civilian-First Mutual Aid
terraapp.figma.site
Concept Terra is a community resilience platform that operates across two temporal phases:
- Before (Calm): Functions as a reciprocal local marketplace. Neighbors trade land-clearing, tool loans, or transport in exchange for communal meals, firewood, or future favors: building a trusted social network before a disaster strikes.
- During (Crisis): The interface transforms instantly. Non-essential features suspend, the community log closes, and a prominent red "Call 112" banner pins itself to every view. Forms strip down to four critical utilities: Medical, Food, Transport, and Shelter.
Built for local resilience with global scalability, the interface features full dual-language support in both Portuguese and English.
The Design Architecture Terra uses a unified navigation and screen structure that completely shifts its emotional and functional register between two states:
Calm Mode: Earthy greens, warm palettes, and soft transparent cards. The map uses light imagery with amber/green markers.
Crisis Mode: Radical shift to a deep red-black gradient and cool, high-contrast text. Visual noise is aggressively eliminated.
The Three-State Node & Privacy Architecture A "Node" is a request or offer with a localized radius. To guarantee user safety, privacy is hardcoded into the platform architecture across three distinct viewer states:
Your Node: Full visibility over volunteer profiles, requests, and management tools.
Unjoined Node: The viewer sees the poster's profile, but other participants are blurred to prevent data scraping.
Joined Node (Accepted): Once explicitly accepted by the owner, mutual profiles unblur, direct group messaging opens, and exact contact details securely unlock.
The Commitment Flow & QR Verification To foster real-world accountability, Terra replaces arbitrary "join" buttons with a minimum viable trust ceremony:
The Flow: A volunteer requests to help → A native confirmation sheet logs their commitment → The poster reviews and taps "Accept" → Communication and contact details unlock simultaneously.
Verification: Upon task completion, the poster scans the helper's custom QR Code. This safely increments a "vouched counter" on their profile, building a permanent web diagram of real-world community links.
Resilient Utility: Offline Sync & Safety Panel Designed to survive severe weather infrastructure collapses, Terra integrates advanced offline mechanics:
The Offline Sync Vault: If cellular towers fail, all outgoing posts, logs, and messages queue locally while the last cached map tiles remain fully interactive. The second a signal (edge cell or satellite) is detected, the vault transmits automatically.
The Safety Panel: Accessed via a full-screen blur layout on the profile view. Users must hold a large central shield button for 5 seconds (visualized by a filling clockwise progress ring) to prevent accidental triggers, instantly broadcasting their safety status to emergency contacts.
The Community Log Mechanics Community Log acts as a social space during peacetime and a strict cognitive filter during emergencies. In Calm Mode, it is fully active, sharing local stories and photography to build neighborhood trust. In Crisis Mode, the feed is aggressively locked down. By eliminating social media distractions when adrenaline is high, the system forces users to focus entirely on immediate survival and coordination. Once the danger passes, the Log reopens as a permanent, verified record of how the community held together.
Live link: terraapp.figma.site X post: https://x.com/webdesign_alice/status/2067324291369320746?s=46&t=1ZFswUtJzT6BPLQaoOweGw Community post: https://www.figma.com/community/file/1649153881381466072/terra-app
Terra proves that design matters now more than ever. It doesn't wait for an emergency; it weaves resilience straight into peacetime. Pushing the boundaries of Figma’s next-gen ecosystem, this project transitions from high-fidelity UX craft directly into code. By crafting this entire system by hand in Figma Design with the explicit intent to feed these frames and layouts straight into Figma Make, Terra models a real, achievable infrastructure, ensuring a life-saving neighborhood network is alive and ready the exact second the alert fires.
configmakeathonFigma
Boluwatife's avatar
Boluwatife Delight
• 4h
This feels super well thought out nice balance, clean structure, and the visuals communicate clearly. Really strong execution.
Isabel's avatar
Contra logo
Isabel Feuerstein
pro
• 10h
this is so important, great work!
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started