デザインと開発
5月. 2026
Pearl Dental Care
Pearl Dental Care は患者向け歯科クリニック体験を full stack で構築しました。マーケページ（動的 services、blog、About、Contact、legal）、認証フロー、予約、リード取得——Patient Welcome / Care Contact フォーム——すべて Fastify REST API に接続。
フロントは Next.js App Router、TypeScript、SCSS modules、Motion。落ち着いた clinical narrative、trust blocks、専門医カルーセル、登録・予約への明確な導線。API は Prisma/PostgreSQL、Zod、bcrypt、lead logs、appointment endpoints、health route——Docker と split deploy。
Production も証明の一部：CORS、HTTPS base URL 正規化、partitioned session cookies で Railway の frontend/API がドメイン跨ぎで連携——静的 mockup ではなく deploy 可能なクリニック製品。
Hero——「Get ready for your best ever Dental Experience!」の upbeat 見出し。 airy layout、clinician 写真、控えめ UI でまず reassurance。
Patient welcome——「We're welcoming new patients…」ブロック。phone-first フォームと calm reassurance。marketing leads は Pearl API へ。
Why choose Smile——split hero、clinic 写真、reassurance copy、shields 付き perk 行、Book an appointment CTA。
Welcome video section——「We're Welcoming new patients…」見出し、中央 Press-play blurb。calm pacing と culture glimpses——typical な不安への empathy。（ページセクション screenshot、動画 asset ではない。）
Meet our specialists——clinician snapshots のカルーセル、warm portraits、credential blurbs、approachable な reassurance。
Game changer——「Dental Website that's gonna shake the game rules up」fold。luminous copy が curiosity を誘い、Learn More が About storyline へ。
Register——Create an account フォームと inline validation。signup は Pearl API へ——httpOnly JWT cookies で session。
Contact——Get in touch は booking urgency を中心に。appointment scaffold と map が anxious な来訪者を reassure。