Claro

Inspiration

Claro was inspired by my mom and by the reality that many people are expected to navigate high-stakes documents without clear language, digital confidence, or institutional support. A medical bill, lease notice, government letter, school form, or legal warning can determine whether someone pays money, misses a deadline, loses benefits, or shows up to the wrong place at the wrong time.

In the discovery phase, I created a survey for my mom to better understand how confusing documents show up in real life: what people do first, who they ask for help, what makes them feel embarrassed, and what information they actually need in the moment. That helped me realize the product could not just be a translation tool. It needed to answer the deeper question: “What does this mean, and what should I do next?” Though I was the helper growing up, I was inspired by her answer choices when I realized how important her church community has been in helping her. I wanted to find a way to incorporate involving a trusted human especially for a non digital native.

Claro is built for people like my mom, Janeth: someone who may have limited English proficiency, low digital literacy, or limited trust in institutions, but still needs to make informed decisions quickly. The inspiration was to create something that feels simple, respectful, and useful in the exact moment someone feels overwhelmed.

What it does

Claro lets a user upload or take a photo of an important document and receive a plain-language explanation of what it means.

The app helps users understand:

what the document is about
whether it is urgent
what actions they should take next
what deadlines or dates matter
what information may need to be verified
what questions they should ask a trusted person or institution

Claro is designed to be multilingual, low-friction, and usable even in low-connectivity environments. It stores documents locally by default, keeps a record of outstanding action items, and gives users a simple way to review what they have already uploaded.

How we built it

In the discovery phase, I created a survey for my mom to better understand how people actually deal with confusing documents in their daily lives. That helped shape Claro around trust, simplicity, and action rather than just translation.

Frontend — React 18 + Vite 5 with Tailwind CSS v3 JIT and Material Symbols Outlined, chosen for fast iteration, component-based UI, and a utility-first design system that maps cleanly to Material Design 3 tokens.

Backend — None. Claro is fully client-side. The app uses an offline-first architecture with localStorage persistence and a sync queue to handle state. This was chosen to eliminate server costs and make the app usable without a connection.

AI/APIs — Anthropic Claude claude-opus-4-5 via direct browser fetch with vision API support, chosen for its multilingual reasoning and ability to extract structured JSON from bureaucratic document images in a single call.

Database — localStorage, including keys like claro_docs_v1 and claro_queue_v1, chosen to keep documents private on-device by default with zero infrastructure. This matched the app’s core trust promise to immigrant users.

Deployment — Vite static build deployable to any CDN, including Netlify, Vercel, or GitHub Pages. A pure frontend bundle needs no server to run, can scale at zero cost, and can be served as a PWA offline.

We also designed the app around a simple mental model:

[ \text{Document} \rightarrow \text{Plain-language meaning} \rightarrow \text{Urgency} \rightarrow \text{Next steps} ]

That flow became the foundation for the user experience.

Challenges we ran into

The biggest challenge was designing for users who may not trust complicated software. Claro needed to feel useful without feeling intimidating. That meant reducing the number of decisions a user has to make and avoiding overly technical language.

Another challenge was handling the uncertainty of AI outputs. Bureaucratic documents are often blurry, incomplete, or full of legal and institutional language. I had to think carefully about how the app should communicate confidence, uncertainty, and next steps without pretending to be a professional legal, medical, or financial advisor.

Offline-first design also created tradeoffs. Keeping data local protects privacy and reduces infrastructure costs, but it also means the app has to be thoughtful about sync queues, saved states, and what happens when a user loses connection halfway through a task.

The final challenge was emotional: these documents often arrive during stressful moments. The tone of the app had to be calm, clear, and empowering without being cold.

Accomplishments that we're proud of

I am proud that Claro started from a real user insight instead of a technical gimmick. The survey with my mom helped ground the product in actual behavior and showed that people often need both information and reassurance.

I am also proud of the offline-first architecture. Making Claro fully client-side keeps the app lightweight, low-cost, and accessible. That matters because the people who need this type of tool most may not have consistent internet access or may be cautious about uploading sensitive documents to unknown systems.

Another accomplishment is the action-oriented output. Claro does not just summarize a document. It helps the user understand what to do next. That shift from “translation” to “decision support” is what makes the product feel more human.

Finally, I am proud of building something that could work for both individual helpers and community-based support. Claro can support a trusted family member, but it also has room to grow into a model where libraries, refugee centers, nonprofits, and volunteers help people navigate important paperwork.

What we learned

I am super proud of myself for stepping outside of my comfort zone and finally making the switch from Chat GPT to Claude to make my PRD and do research. I also tried out Google AI Studio and Stitch for design.

Aside from the process, I learned a lot more about my mom and the everyday anxieties she faces as an aging woman with limited English and digital fluencies. A person may technically understand individual words but still not know whether a letter is serious, what deadline matters, or who they should contact. Building Claro for people like my mom taught me that the most valuable output is often not a perfect translation. It is a clear explanation paired with a small set of next steps.

I also learned that privacy has to be part of the product experience, not just a policy page. For immigrant users, sensitive documents can involve housing, healthcare, legal status, finances, or school enrollment. Keeping information local by default became a product decision and a trust decision.

Finally, I learned that AI is most powerful when it is designed around human support. Claro should not isolate people from helpers. It should make it easier for someone trusted to understand the situation, verify the output, and help the user act.

What's next for Claro

Next, Claro will expand beyond individual document understanding into a helper-supported experience.

The next version will allow users to share a document summary with someone they trust through SMS or WhatsApp using the phone’s native share sheet. A helper could review the AI explanation, confirm whether Claro got it right, and send feedback back into the app.

We also want to support two helper paths during onboarding:

Someone I trust — a family member, friend, neighbor, church member, or adult child.
Community helper — a library, refugee center, nonprofit, case worker, or trained volunteer.

Longer term, Claro could become a trusted document navigation layer for immigrant-serving organizations, libraries, schools, clinics, and legal aid groups. The vision is a tool that helps people understand the paperwork that shapes their lives and gives them the confidence to take the next step.