PillSnap

Snap a pic of a pill and identify it.

Comment

Inspiration

PillSnap was inspired by a simple but stressful situation. Sometimes people find a pill outside its original bottle. It may be in a bag, on a table, or mixed with other medication. In those moments, uncertainty creates pressure. People want answers quickly, but they also need accurate information.

This showed us the importance of clarity and trust. A pill identifier should not feel experimental or confusing. It should feel calm and reliable, similar to a pharmacy resource. Our goal was to reduce uncertainty while clearly reminding users that professional medical advice is still necessary.

What it does

PillSnap helps users identify a pill by entering the imprint printed on it. The imprint is required because it is the most reliable identifier. Users can also add color, shape, and optional photos to narrow results.

The app returns structured information such as the drug name, strength, drug class, and common uses. Results are divided into exact matches and potential matches. Exact matches align with the imprint and appearance. Potential matches share the imprint but differ in color or shape. This separation helps users understand when to double check.

A visible disclaimer explains that the tool is for informational use only. This reduces overconfidence and encourages consultation with a pharmacist or physician when needed.

How we built it

We built PillSnap using Next.js 14 for both the frontend and backend. The application uses API routes to process user input and communicate with a verified pharmaceutical data source. Instead of storing our own drug database, we rely on an authoritative external provider to maintain accuracy and up to date records.

The user interface was styled with Tailwind CSS to create a clean and readable layout. Subtle animations were added using Framer Motion to guide attention during loading and result display. These animations are simple and controlled so they support usability rather than distract from information.

The app is deployable on platforms such as Vercel. Environment variables are used to manage configuration securely.

Challenges we ran into

One major challenge was handling imprint overlap. Some pills share the same imprint but differ in color or shape. If we displayed results without distinction, users might assume all matches are identical. To reduce this risk, we separated results into exact and potential matches with clear labels.

Another challenge was maintaining trust through design. Medical tools must feel stable and professional. Small design choices such as spacing, color contrast, and typography affect perception. We revised the interface multiple times to create a calm, healthcare focused appearance.

Integrating external data also required careful formatting. Data structures can vary, and inconsistencies could confuse users. We standardized responses in the backend before presenting them.

Accomplishments that we're proud of

We are proud that PillSnap feels simple while handling complex data behind the scenes. The identification flow is direct and easy to follow. Users can quickly understand what is known and what may require further confirmation.

We are also proud of the clear safety messaging. The visible disclaimer and structured result categories reinforce responsible use. This balance between accessibility and caution strengthens user trust.

Finally, we are proud of building a full stack medical style application that integrates verified data, responsive design, and smooth interaction.

What we learned

We learned that accuracy alone does not create trust. Presentation and structure strongly influence how information is interpreted. Clear categories and labeling reduce confusion and support better decision making.

We also improved our understanding of backend API design, secure configuration, and frontend state management. Connecting to an external data source showed us the importance of consistent formatting and error handling.

This project also highlighted human factors. When people feel uncertain, they may skim results or focus only on the first match. Designing for clarity helps reduce rushed decisions and improves confidence.

What's next for PillSnap

Next, we plan to improve image based identification. Photo uploads could be enhanced with computer vision tools to better compare pill appearance. This would increase confidence when imprint information is unclear.

We also want to expand educational content. Adding clear explanations about drug classes and safe storage could make the app more informative beyond identification.

Finally, we aim to continue refining accessibility and usability. Improving mobile performance, adding language support, and strengthening error feedback would make PillSnap more inclusive and dependable for a wider audience.

Built With

Share this project:

Updates