01
Read the brief as a decision system
Start from operator pressure, clinical safeguards, information hierarchy, and the business stakes of rollout instead of jumping straight into visual styling.
Reusable websiteMySkinCode workflow skill
Clinical product storytelling for UI decks
MySkinCode Clinical UI Workflow
This site packages the reusable process we created for turning MySkinCode product concepts into presentation decks that feel clinically credible, visually coherent, and operationally realistic.
Focus
Operator dashboards, iPad treatment panels, and clinical workflow concepts.
Output
Deck structure, visual system, risk framing, and reusable intake templates.
Use case
Product, clinical, executive, and investor reviews around new workflow surfaces.
What this website captures
A reusable method for building MySkinCode decks as decision tools rather than decorative mockup collections.
Translate a brief into product pressure, clinical safeguards, interaction logic, and rollout stakes.
Keep roadmap, dependencies, and risk comparison inside the main story rather than hiding them at the end.
Write presenter notes only after the visual and operational narrative has stabilized.
Audience fit
Works for product teams, clinic leadership, engineering scoping, and investor-facing deck variants.
Publishing-ready
Built as a shareable public route inside the current MySkinCode project so it can be published on the configured domains.
Workflow
A five-step method for credible clinical UI decks
The workflow is intentionally sequential. It starts with decision logic, then moves through structure, visual coherence, operational realism, and only finally the speaking layer.
02
Lock the deck spine before building pages
Define the full narrative arc up front so the presentation moves from context to architecture, flow, governance, roadmap, and open decisions.
03
Apply one visual language across the whole deck
Keep the tone premium, clinical, and calm. The system should feel trustworthy for tablets, expert review, and high-stakes workflow discussions.
04
Add credibility layers beyond UI mockups
Roadmap, dependencies, risk framing, traceability, and operator responsibility are part of the product story, not optional appendix material.
05
Generate notes only after the story is stable
Presenter notes should reinforce transitions, explain why the workflow is safe, and help product or clinical stakeholders present the deck with confidence.
Default deck spine
The website mirrors the recommended presentation architecture
Instead of prescribing isolated slides, the skill groups the deck into narrative blocks that move from screen purpose to system architecture and then to rollout discipline.
Context and pressure
Explain why the screen exists, who uses it, and what must be decided under clinical or operational pressure.
Architecture and modules
Show how information hierarchy, layout zones, and functional modules support fast comprehension on tablet surfaces.
Decision and safety flow
Make alerts, override rationale, auditability, and confirmation logic explicit rather than implied.
Rollout and risk
Document staged implementation, dependencies, risk comparison, and unresolved product questions before broad deployment.
Visual system
A premium clinical dark mode translated into a public website
The workflow’s identity relies on calm dark surfaces, restrained accent usage, and editorial typography. That same system now frames the website so the process and its output feel aligned.
Background 1
#0F172A
Background 2
#0B1020
Accent teal
#4FD1C5
Accent gold
#D6B36A
Visual rules carried into the site
Calm over flashy
The design avoids beauty-marketing gloss and avoids speculative sci-fi cues. It reads as trustworthy decision support.
Editorial structure over dashboard mimicry
Sections use clear bands, modular cards, and controlled hierarchy instead of pretending to be a live product interface.
Accent discipline
Teal signals guidance and structure, while gold marks emphasis and sequencing. Neither color is used as decoration alone.
What the skill produces
Reusable assets for future MySkinCode deck work
The underlying skill package is more than documentation. It packages content structure, design rules, and domain-specific caution points so the next deck starts with a proven operating model.
Reusable slide spine
A default structure for 10–12 slide MySkinCode clinical UX/UI decks that can be compressed or expanded by audience.
Dark clinical style system
A repeatable visual language with dark navy surfaces, teal guidance accents, gold emphasis cues, and disciplined typography.
Operational credibility rules
Built-in guidance for operator responsibility, expert override traceability, calibration-card capture standards, and staged rollout realism.
Reusable project-brief template
A structured intake format that captures audience, workflow pressure, safety requirements, slide needs, assets, and delivery constraints.
Brief template
A reusable intake model for future website or deck requests
The project brief template helps teams describe the screen, the audience, the clinical controls, and the required slide topics before design work starts.
Recommended use
Start every new MySkinCode clinical UX/UI request with this structure, then decide whether the output should become a deck, a web page, or an iteration of an existing presentation.
Quick start download
Prefer a ready-to-fill file? Choose Polish or English, then download the starter brief in Markdown and use it as the intake sheet for new MySkinCode deck or website requests.
Selected download: English brief template
Core brief fields
1
Product concept and intended screen or workflow
2
Audience, presentation goal, and delivery context
3
Clinical safeguards, override rules, and audit requirements
4
UX/UI expectations such as iPad use, dark mode, or touch targets
5
Required slide topics including roadmap, risk, MVP scope, or open decisions
6
Assets, branding rules, note language, and delivery constraints
Downloadable starter brief
Give new stakeholders a clean way to kick off a MySkinCode request
This downloadable brief template turns the workflow into an immediate starting artifact. Teams can fill it in, circulate it internally, and return with the right product, clinical, and delivery constraints already captured.
Included in the template
The file is delivered as editable Markdown so it can be copied into Docs, Notion, email, or product tickets.
It includes sections for product concept, audience, workflow context, clinical safeguards, UX/UI expectations, required topics, assets, notes, and delivery constraints.
Download language: English