Health & Fitness · Clinical Calm
Doctor Appointment App UI Design Free Download
Welltrack is a doctor appointment app design with a calm, clinical look, built for founders and designers shipping a telehealth or booking product.
Önizle
Ekranları keşfedin
Sleek'te tamamen düzenlenebilen doctor appointment mobil uygulama tasarımını önizleyin.
Doctor Appointment App hakkında
Welltrack is a doctor appointment app UI design built around a "Clinical Calm" aesthetic: a soft off-white base, deep slate text, and a trustworthy medical teal reserved for primary actions and active states. Hairline-bordered cards, circular doctor headshots, and generous whitespace give every screen the unhurried feel of a well-run clinic, with a single warm coral kept only for cancel and alert moments.
The template ships seven connected screens that form a complete booking flow: a personalized Home with search and specialty icons, a filterable Find a Doctor list, a Doctor profile with stats and reviews, a Confirm Booking screen with a visit-type toggle and fee summary, a Booking Confirmed screen with add-to-calendar, a My Appointments list with reschedule and cancel actions, and a Profile with insurance and account settings. A recurring horizontal time-slot rail, with available slots outlined in teal, the selected slot filled solid, and taken slots struck through, threads through the booking screens as the product's signature.
Use it in Sleek and make it yours: restyle the palette, edit any screen with AI by describing the change, and add the flows your product needs. Then export it to code, copy it into Figma with no plugin, or hand a prompt to an AI agent to build it for real, far faster than starting from a blank canvas.
İçindekiler
Dahil olan ekranlar
Home
A morning greeting, a search bar for doctors and conditions, a horizontal row of specialty icons, and an upcoming-appointment card showing the next video visit. The launchpad into the whole app.
Find a Doctor
A searchable, filterable list of doctor cards with circular headshots, specialty, star rating, distance, and a next-available chip. Category pills like Cardiology and Dental narrow the results.
Doctor Profile
A large headshot hero, name and credentials, a stats row for patients, experience, and rating, an about section, and a time-slot rail leading into a teal Book Appointment button.
Confirm Booking
A doctor summary, a Video Visit and In-Person toggle, the horizontal time-slot rail with struck-through taken slots, a reason-for-visit field, and an itemized fee total.
Booking Confirmed
A teal checkmark, the scheduled appointment details, an add-to-calendar row, and the clinic location with address. Reassures the patient the visit is set.
My Appointments
Tabbed Upcoming and Past Visits lists grouped by day, each card showing the doctor, visit type, status badge, and quick Join Call, Reschedule, or Cancel actions.
Profile
A member header, an insurance card with carrier and member ID, and account settings rows for medical history, saved doctors, and notifications. The patient's account hub.
Tasarım ve özellikler
Öne çıkan özellikler
- Clinical Calm aesthetic: off-white base, slate ink, one medical teal accent
- Hairline-bordered tonal cards with circular doctor avatars
- Signature horizontal time-slot rail across booking screens
- Bottom navigation with five line icons and a solid-teal active tab
- Specialty icon row and search-led home screen
- Doctor profile with patients, experience, and rating stats
- Visit-type toggle for video and in-person appointments
- Itemized fee summary and add-to-calendar confirmation
Hedef kitle
Kimler için
Kullanım alanları
Neler oluşturabilirsiniz
- Launch an MVP for a doctor appointment or telehealth product
- Mock up screens for an investor or stakeholder pitch
- Hand a consistent, complete UI off to developers
- Explore a redesign of an existing clinic booking app
Bu şablon nasıl kullanılır
- 1
Şablonu aç
Ekranlara göz atın ve fikrinize uyup uymadığını görmek için tüm tasarımı önizleyin.
- 2
Bu şablonu kullan
Tek tıkla Sleek'te tamamen düzenlenebilir kendi kopyanızı açın.
- 3
Yapay zekâ ile düzenle
Ne istediğinizi anlatarak paleti yeniden tasarlayın, düzenleri değiştirin, ekran ekleyin veya kaldırın.
- 4
Dışa aktar ve yayınla
Tasarımınızı dışa aktarın ya da geliştiricilere teslim edin, lansmana kadar geliştirmeye devam edin.
Sıkça sorulan sorular
İlgili mobil uygulama şablonları
doctor appointment uygulamanızı tasarlamaya başlayın
Sleek'te kullanın ve kendinize göre uyarlayın: paleti yeniden tasarlayın, herhangi bir ekranı yapay zekâ ile düzenleyin, ardından koda veya Figma'ya dışa aktarın.
Bu şablonu kullan