App design description for development

team
Minimum viable Milestones:

1. Milestone - A UI with easy navigation on browser/mobile with Admin/User features

a. Example template -
https://themeforest.net/item/medux-medical-react-dashboard/41061766
b. Features:
i. Admin ability to view datapoints and manage users, etc.
1. Admin has a dashboard listing things a web app would want to
know, like:
a. total signed up users graph over time
b. Total labs results entered (A unique user uploading a lab
PDF, or CSV adding a unique ‘collection date’ to their
record = +1 to this overall counter)
c. How many unique logins in last 30/90/180/365 days
d. Average lab dates uploaded per user
e. How many new lab result entries in last 30/90/180/365
days
f. Admin ability to view which users are most active, and
initiate chat contact with their username.

ii. Messaging within the app. Encrypted Sending messages to users is only
allowed to by admin at least for the MVP. Ability for admin to send and
schedule send a 1:1 message to all users, seen by the recipient as
coming from the admin or as coming from another user (to enable
advertising messages coming from a user sponsor, while keeping the
admin in control of sending mass messages to prevent sponsor abuse).

iii. Ability for admin to modularly add jpg/gif advertisements (manually) to

user visible screens (enabling future advertising)

2. Milestone - User Entry Functionality

a. The users have their data already stored in either custom excel sheets or
proprietary lab results PDFs.
i. The goal is to make it very easy for the user to migrate this data into the
application. In a perfect world, they could just upload their CSV or PDF
into our app from their device, and our backend (GenAI?) could load it
into our crud screen for them to validate and finalize anything missed
b. CSV Upload
 i. A typical users excel/CSV will look like this:
BioMarker Unit 1/1/2020 Date2

Testosterone pg/Ml 420

ii. On desktop, copy and pasting the CSV/excel table into AI Perplexity
seems to parse well. Example:
iii. Example CSV
1. https://docs.google.com/spreadsheets/d/1YjSIqxeWp6W5Yjb-ufv8
E8kf3S74NN5Z/edit?usp=drivesdk&ouid=1012212119979188362
57&rtpof=true&sd=true
iv.
 v.

c. PDF
i. Example PDFs
ii. PDF of labwork can be uploaded to an AI API and converted at >75%
accuracy to populate the user CRUD entry so they can then only
add/correct missed data
iii. (It is possible to copy/paste PDF test results into Perplexity AI and asking
it to format it for CSV, it gets >75%.
iv. Example using AI Perplexity app
v.
 vi.

d. User database crud

i. (unsure what tool to use here)
ii. Some easy UI ability for non technical users to view all of their stored
database data and edit any errors (could be on graphing screen or
another screen per developer judgement)
iii. This UI will replace the manual entry forms below if it easily allows users
to add new datapoints as well
 e. (These custom entry forms only exist to show the data validation requirements,
they won't be used for actual user data entry)
i. Form option: User Manual Entry Option
1. Medication Entry something like https://playcode.io/1974152
2. Lab Result Entry something like:https://playcode.io/1974167
3. Physical Markers something like: https://playcode.io/1974156

3. Milestone - Ability to visualize / customize graph, nice user experience

a. This feature is the primary benefit of the application, so it will determine user
adoption for the MVP. Ability to continue to improve it in the future will be key,
based on user feedback of most desired features.
b. User Dashboard Page (Default Page after login)
c. Users can only view their own data - Admin has ability to view any users data
d. I created a js Fiddle that is like the functionality we want
i. (I used genAI to write it, so it doesn’t look great but shows the idea)
ii. https://jsfiddle.net/hawupzsr/16/
iii. If there is a framework that allows users to create/customize their own
charts based on the underlying data, that would be great. If not, we can
structure the above which allows toggle on/off of items over the same x
axis
iv. The database metrics that will be graphed are
1. BioMarker Lab Results
2. Supplement/medication dose

†********* End MVP Milestones Description *********

Existing similar example - Only use this example for ideas on technical implementation related
to lab results, but this example is not how the data in our application is to be visualized.
https://github.com/NoTranslationLayer/biomarkerdash?tab=readme-ov-file

Example Open Source Tracking App for rough example of supplement Stack / Medication Stack
Manual entry options
https://github.com/simonoppowa/OpenNutriTracker?tab=readme-ov-file

Project Scope and Objectives

● Build a Progressive Web Application
○ App ability to eventually support thousands of users, but the initial pilot
will be under 100 users.
○ Experience supported on desktop and mobile (android/apple) via web
browser. Mobile can be view only, desktop will be full-feature.
○ A user-friendly web application that allows easy data entry, error
correction, and trend viewing for health/fitness metrics and
medications/supplements the user is taking. Metrics such as blood labs,
blood sugar, blood pressure, and custom metrics.

User and Admin Flows

Explain user flow with a diagram

● Home Page will initially be plain, as the company is not operating publicly at
launch.

● Please offer the ability to create and edit a hidden future signup page allowing
the owner to draft and get feedback from users via hidden url

● Signup will initially be controlled, so whatever mechanism makes this easy for the
admin. It could be a third field of a code that the admin has the ability to change,
so if a new-signup doesn’t have the correct code they are denied. Or unique one
time use signup URLs, whatever is easiest to prevent un-invited sign-up

● After user Login

○ Acceptance of terms and conditions

● Profile Creation
○ Users will not be asked personally identifiable information (PII), as the
platform will want to protect users identity in case of some future data
 hack, the health information should be unidentifiable. For this reason
names, will not be collected.
○ Users would need only an email address to sign-up (our initial platform
will be private link only limiting the user sign ups to a controlled limit)
○ Profile creation page will ask for Email and desired username, suggesting
that both the email and username support their anonymity
○ Preference between Metric and US Standard metric tracking such as
Kg/Lbs

● User Dashboard Page (Default Page after login)

● Users can only view their own data - Admin has ability to view any users
data
● the main screen after login will view their dashboard of past metrics on a
graph (able to toggle on/off metrics by deselecting, and saving preferred
views of selected metrics with a custom name).
● There should be an “upload lab results” button at the top of the page.
● something like this (chart.js or d3 etc)

○ If possible, allow order of metrics to be drag/drop rearranged

○
● (Skip for minimum viable product, will be in v2) AI Analytics
○ Implement a 'Generate Insights' feature on the View page that
allows users to interact with an AI (specifically Claude from
Anthropic) about their health data. This feature should:
○ Collect currently displayed metrics, their data points, and dates.
○ Include user's other health information (age, weight, sex, etc.).
○ Send this data to Claude with a prompt like 'Based on these health
metrics for a patient, do you have any insights for the patient?'
○ Allow for follow-up questions from the user (e.g., 'How is my blood
pressure?'), with the app automatically including relevant context
from the user's lab work and health information in each
subsequent prompt to Claude.
 ○ Display Claude's responses to the user in a conversational
interface.
○ This feature enables users to get AI-generated insights about their
health data and engage in a dialogue about their lab work and
health metrics."
○ Then display the result for the user in a dialogue box
○ This is an experimental feature I’ll collect feedback from users on
to improve in the future

● Data Entry Page - “Upload Lab Results”

● On the Upload Lab Results page, there will be a file upload and
instructions as follows
○ “Upload your LabCorps, Quest, or other official lab result pdf or
your CSV of past records using our TEMPLATE (Upload Google
Sheet Template) here and our system will extract your lab results
to your profile. *Our character recognition model ignores all
Personally Identifiable Information (PII) and looks for information
related to your lab, such as collection date, sex, age, fasted, and
results.
○ Additionally, add a spreadsheet like data entry field for
medications and supplements. Example is the Medication Sheet in
this File
■ “Please enter any medications / Supplements, dose,
frequency, why you are taking each, these are notes for
you to look back over in time that will be saved to your
graph log.”- our model will work to add these to your
database for your records as well.

■ Also, pre-populate a table entry with the users previous

entries and metrics to allow them to scan their list for
changes instead of starting each entry from scratch

○ Once the file and free text boxs are ingested, present the user with
an easy way to view their data and check for errors (also to edit
past data entries in case they catch an error in any of their
historical data)

● Once the user validates the data, the View page should be returned. The
view page should always allow the user to edit a value should they see an
error when reviewing their graph of data.
 Explain admin use flow with a diagram
● Admin Logs into a page
○ A private chat/messenger ability allowing the admin to communicate with
users within the platform within the webapp
■ A running feedback chat with each user, every contact from the
user stored within a single thread for that user so all context
remains
■ When a user receives a chat message, they should receive an
email notification of a message in their inbox per normal forum
process
○ An ability for users to request and upvote features to be added, and
admin ability to view these
○ Admin has a dashboard listing
■ total signed up users graph over time
■ Total labs results entered (A unique user uploading a lab PDF, or
CSV adding a unique ‘collection date’ to their record = +1 to this
overall counter)
■ How many unique logins in last 30/90/180/365 days
■ Average lab dates uploaded per user
■ How many new lab result entries in last 30/90/180/365 days
■ Admin ability to view which users are most active, and initiate chat
contact with their username.
○ Admin has easy ability to add additional medications/fields for users to
track either by updating an easily formatted config file or in UI
○

Input and Output Examples

Detail example inputs (labwork PDFs, personal excel docs as CSV)
● First-Time Upload Template

● Data to extract from PDFs:

○ In a future version, instead of users manually entering labs, they can
upload their lab PDFs (Example PDFs) and some AI like
https://aws.amazon.com/textract/ocr/ can do 90% of the entry for them

PWA Page Structure

● Sign up / marketing public page
○ MVP
■ Purpose, this will be a standard page that pitches the value of the
product, states the pricing, etc.
■ Ability to enter email address into interest-list

● login page for pilot users - no open registration ability initially

 ○ Just username / password

● User Pages
○ Historical Graph View of their past request
■ Purpose is to allow users a BI type dashboard to explore their results on a
graph. Ability to toggle on/off metrics, and save unique views (selected
metrics). All metrics displayed on a single graph as shown in image.
■ [Question] Is this following idea possible? What’s the LOE?
● The graph should have functionality to highlight correlations, i.e. if
several datapoints are trending together over different collection
periods, an ability to highlight this would be ideal.
● Admin Pages
○ Admin Dashboard with metrics described above
○ Admin View Page, ability to view the entries of any user
○ Admin action page, ability to restrict/block/delete users

Data Management
Data will be stored in NoSQL database
● Users will have access only to their own data
● Admin will have the ability to view each users data as if they were the user
● Data will be stored enabling future

Project Deliverables and Milestones

1. Project Setup and Basic Infrastructure

● Milestone 1.1: Set up the development environment.
● Milestone 1.2: Create the basic structure of the progressive web app.
● Milestone 1.3: Implement responsive design for desktop and mobile
(Android/Apple) via Google Chrome Web Browser.
2. User Authentication and Profile Management
● Milestone 2.1: Develop signup and login functionality with admin control
● Milestone 2.2: Create profile creation and editing features. (Profile will be email,
ability to reset password, DisplayName) - Admin will eventually need a way to
give permissions like assigning one user as a “coach” and then other users would
have the ability to give the coach view access into their data. This can be a future
feature if too complex for the MVP.
● Milestone 2.3: Add terms and conditions acceptance.
3. Data Entry and Milestones
● Milestone 3.1: Develop "Upload Lab Results" functionality.
● Milestone 3.2: Implement CRUD for users to edit their
Lab-Result/medications/supplements and additional health information, store
within the database. (also allowing admin to edit globally in the database as
needed
4. Data Visualization
● Milestone 4.1: Create a dashboard for users (to view their data only) and admin
(able to view as any user or all users aggregate) to view historical health metrics
with ability to toggle on and off certain metrics.
● Milestone 4.2: Add unit conversion system (if one user entered bodyweight as kg
and another enters as lb, depending on admin preference to view as either, they
will be converted to show)
● Milestone 4.3: Create ability for users to save custom ‘views’ (example, user can
toggle on a chosen number of metrics and save with a customer name to be able
to return to this toggle view in the future)
5. AI Analytics Integration
● Milestone 5.1: Implement the "Generate Insights" feature for the dashboard
screen, using Claude AI. (This is an idea, the prompt would be “looking at my
currently shown health markers, what insights do you see? <the prompt would
include the nosql dashboard data that is shown on the users currently selected
‘view’
● Milestone 5.2: Develop context-aware follow-up question functionality.
● Milestone 5.3: Create a conversational interface for AI interactions.
6. Admin Features
● Milestone 6.1: Develop an admin dashboard with user statistics.
● Milestone 6.2: Implement admin ability to view individual user data.
● Milestone 6.3: Create in-app chat functionality for admin-user communication.
7. Data Security and Privacy
● Milestone 7.1: Enable a feature that would allow a user to share a point in time
specific dashboard view view a public url, allowing them to paste it into a doctors
appointment notes website (if possible)
● Milestone 7.2: Ensure secure data storage and access controls.
8. Testing and Optimization
● Milestone 8.1: Conduct thorough testing of all features on desktop/iphone/android
● Milestone 8.2: Optimize performance
9. Documentation and Deployment
● Milestone 9.1: Create user and admin documentation.
● Milestone 9.2: Prepare for initial deployment with under 100 users.
10. Post-Launch Monitoring and Iteration
● Milestone 10.1: Set up analytics for user engagement and feature usage.
● Milestone 10.2: Plan for feedback collection and feature refinement.
11. Cost Analysis
● List an estimated cost per user & database entries to estimate monthly site
operating costs based on # of users and # of database records