Build experiments

Cordis App

Mobile App prototype designed and built with AI Prompting and Orchestration

UX Design

UI Design

vibe code

ai orchestration

prompting

Executive Summary

Managing hypertension requires consistent data, yet most tracking methods, from paper logs to over-engineered medical software, create immediate friction for patients.

Cordis was born out of a simple necessity: to give individuals a frictionless, clear way to record daily blood pressure readings for themselves and seamlessly share those trends with their Primary Care Physicians.

My Role

UX Architect, AI Orchestrator

the pitch

Simplified Blood pressure logging mobile app

Timeline

16 hours

tech stack

Figma, Figma Make, Google Gemini, ChatGPT, Replit

impact

Accelerated 0-to-1 Development Cycle | Plain-Language Inclusive Design | Fully Functional Code Prototype

touchpoints

Digital Health (Saas/Consumer), AI-Assisted Prototyping (Vibe Coding), Inclusive Design/Accessibility

KEy Product Decisions

Data-Entry Precision vs. Universal Accessibility

Tension Point

Health applicationsutilize slider wheels, dials, or complex fields to capture data:

  • These interface patterns cause severe input friction and errors
  • Alienating older patients or users with low technological comfort or motor-skill limitations.

design decision

Prioritized a Fixed Keypad Entry Model:

  • I designed a prominent, high-contrast, dedicated numeric keypad
  • Logging a reading requires zero typing or slider dragging

the trade-off

The Interface sacrifices a trendy, minimalist aesthetic:

  • It takes up more initial screen real estate
  • Supports usability across every demographic, regardless of technical literacy
The AI-Assisted Execution Loop

step 1 > Inclusive Interaction Architecture

I began by mapping out the user flows for the tasks. The flows were architected around a single interaction goal:

Open app > Input numbers via fixed keypad > Submit > Close/Exit Application.

I minimized cognitive load by ensuring that micro-copy used plain, conversational language rather than dense medical terminology.

step 2 > Orchestrating the AI Prototyping Stack

I wanted to take my UI designs from static screens to functioning application for myself or others to use. I wanted to decrease the barriers to monitoring Hypertension in all it's stages to stave off more serious medical conditions for myself and others.

1

Visual Generation: I used Figma Make to generate screens that are the basis of my App. I uploaded a welcome screen and prompted Figma Make to create onboarding screens explaining the tasks you can achieve with this app. Take readings for your blood pressure and record them to monitor trends, and export that data to your primary care physician.

--prompt--

I need 2-3 onboarding screens for the users first visit highlighting the main tasks for this app. Also create a style guide based on this welcome screen upload to apply to any new screen created for the mobile application.
stay tuned

This project is ongoing, I will be updating the page as I make my way through development and testing. It will serve as my process journal.