Lapis — UX/UI Design
Designing the digital experience that turns a loved one's heartbeat into a wearable piece of jewelry.
A mobile app for emotional intimacy — guiding users through heartbeat capture, bracelet customization, and 3D print order in a single, seamless flow.
Project Brief
Translating a biometric thesis into an intuitive, emotionally resonant mobile experience.
Design a mobile app that makes capturing a loved one's heartbeat and converting it into a 3D-printed bracelet feel intimate and meaningful — not clinical or technical.
Emotional-first design: every screen decision was tested against the question "does this feel warm, not sterile?" The dark theme, wave motifs, and soft pill buttons were all intentional responses to that brief.
A high-fidelity prototype covering the full user flow — from first open to print confirmation — with two distinct paths for recording your own or a loved one's heartbeat.
MA Human Experience Design thesis, Brunel University London. Companion to Case Study 1 (HF Research), which validated the emotional and neuroscientific foundations for Lapis.
A heartbeat is abstract — the app needed to make users feel their loved one's biology was being faithfully translated, without exposing any technical complexity underneath.
Recording a loved one's heartbeat is an emotionally charged act. A confusing flow or technical error in that moment could break the entire experience. Simplicity was a UX requirement, not a preference.
Research & Affinity Mapping
Synthesizing insights from interviews, literature, and naturalistic data into design directions.
Physical touch carries emotional weight that visual or digital formats cannot replicate. The bracelet must be felt to fulfill its purpose.
People regulate emotional states through physical objects tied to absent people — a behavior pattern that predates and justifies the Lapis concept.
The felt sense of connection — not just communication — is what people seek. Lapis needed to translate that feeling into material form.
Why people keep objects from the past, what makes an object feel like a person, and how proximity to objects activates memory and emotional regulation.
Competitive analysis revealed a gap: existing biometric wearables track health but carry no emotional or memorial purpose. Lapis fills that gap.
Oxytocin release through touch, PPG capture via smartphone camera, and parametric modeling of HRV data provided the technical scaffolding for the concept.
Vision & Inspiration
Two parallel directions: the digital aesthetics of the app interface, and the material language of the physical bracelet.
Dark, immersive interfaces where biometric data becomes something beautiful rather than clinical. Referencing health apps that make invisible body data visible and meaningful — the visual language of data streaming from a living system, bioluminescent gradients, and quiet darkness that makes light feel significant.
Parametric jewelry, computational material structures, and biomorphic 3D printing. The bracelet needed to look like it came from a biological process — organic lattices, wave-derived textures, and forms that carry the fingerprint of a heartbeat's amplitude and rhythm.
Style Guide
The visual language of Lapis — color, type, and UI components that make biometric data feel intimate rather than clinical.
100px radius · SF Pro Bold
Back arrow · Logo · Share
HRV capture · Dark overlay motion
Storyboard
Sara's journey — an Italian immigrant in her thirties, living in Canada, reconnecting with her mother through Lapis.
Sara, an Italian immigrant in Canada, sits alone after a call with her mother. Distance has become a weight she carries.
Sara sees an ad for the Lapis app. She downloads it — curious about the idea of a bracelet made from her mother's heartbeat.
The app guides Sara to invite her mother. Across the Atlantic, her mother receives a notification and opens the link.
Her mother follows the app prompts and records her heartbeat using her smartwatch. The biometric data is sent to Sara's app in Italy.
Sara sees the bracelet design generated from her mother's heartbeat. It is unlike anything she could have chosen herself.
The bracelet arrives. Sara wears it every day. It carries her mother's heartbeat at her wrist — a physical form of love across distance.
Wireframes
Low-fidelity screens establishing the app's information architecture and interaction flow before moving into high-fidelity design.
User Journey Map
Sara's emotional and functional journey across five stages — from discovering Lapis to wearing the finished bracelet every day.
| 01 · Discover | 02 · Set Up | 03 · Connect | 04 · Design | 05 · Receive | |
|---|---|---|---|---|---|
| Actions | Sees Lapis ad on social media. Opens App Store. Downloads the app. | Creates account. Answers 3 questions about herself and who will wear the bracelet. | Invites her mother via the app. Her mother receives a notification and records her heartbeat. | Views the bracelet generated from her mother's HRV. Selects style. Adjusts color. Places order. | Receives the package. Puts the bracelet on her wrist for the first time. |
| Touchpoints | Social media ad · App Store | Lapis app onboarding | Lapis app · Mother's phone · Smartwatch | Lapis app design screens | Email confirmation · Physical bracelet |
| Thoughts | "Can it really turn a heartbeat into jewelry? How does that work?" | "This flow feels thoughtful. I hope mom can do the recording part from Italy." | "Is she doing it right? What if the signal drops? I wish I could be there with her." | "This is actually from her heartbeat. It's completely unlike anything I would have picked." | "It's warm in my hands. It feels like she's right here with me." |
| Feeling | Curious | Engaged | Anxious | Surprised · Emotional | Connected · Moved |
| Emotion | |||||
App Experience Map
The complete app flow — two distinct heartbeat-capture paths that converge into a shared design and print experience.
Final App Screens
High-fidelity prototype screens covering the full user flow — onboarding, heartbeat capture, both paths, design selection, color customization, and print.
Design Decisions
Every visual and interaction choice in Lapis traces back to a specific rationale rooted in research or user insight.
| Decision | Type | Rationale | Research Connection |
|---|---|---|---|
| Dark background (#000012) | Visual | Biometric data comes from an invisible, mysterious biological source. The near-black background mirrors that unknown depth — making the data visualizations feel like something surfacing from within the body. | User interviews: participants described heartbeat data as "hidden," "private," and "deep inside." Bright UI frameworks would contradict that emotional register. |
| Cyan (#0DDFFE) for primary actions | Visual | Cyan reads as technological, clean, and trustworthy — associations the app needed to establish for the biometric capture step. It also evokes biophotonic light, reinforcing the living-system metaphor. | Inspiration board research: health apps (Oura, Apple Health) use cool blues and cyans to communicate precision and safety. |
| Pink (#D0268F) for heartbeat / HRV data | Visual | Pink is warm, biological, and emotional — distinct from the clinical associations of red. It marks every moment where the user's heartbeat is present: the capture animation, the ECG line, the progress ring gradient. | Survey data confirmed that the bracelet's value is emotional, not medical. Pink signals warmth over clinical precision. |
| Pill-shaped (100px radius) buttons | Interaction | Rounded forms feel gentle and non-threatening — important in an app where users interact during emotionally vulnerable moments. Sharp UI corners would introduce friction at the wrong time. | Emotional design principle: form language communicates emotional register before content is read. |
| Wave background animation | Visual | The undulating pink wave pattern appears on key screens (welcome, thank you, waiting). It evokes a heartbeat oscillation without displaying raw data — maintaining the emotional tone while the technical process runs in the background. | Naturalistic data: participants described the heartbeat as "waves," "rhythm," and "pulse" — not as graph lines or numbers. |
| Two-path flow (own vs. loved one's HRV) | Architecture | Research showed two distinct use cases: users who want to wear their own heartbeat, and users who want to carry someone else's. Both paths converge at design selection — keeping the codebase unified while honoring the distinct emotional journeys. | Interview findings revealed both use cases were equally valid and emotionally distinct. Collapsing them into one flow would have diluted the personal meaning of each. |
| Email fallback on print screen | Interaction | "You don't have a printer? Don't worry, email us your design and we will be happy to print it for you" — removes a potential drop-off point by offering a human alternative to self-printing. | Accessibility principle: the hardest moment to lose a user is right before conversion. The fallback preserves the emotional investment even when the technical path is blocked. |
Physical Output
The end of the Lapis experience is tangible: a 3D-printed bracelet, derived from a loved one's heartbeat, worn at the wrist every day.
Early fabrication: testing how the ECG-derived lattice structure behaves when printed in different materials and at different scales.
Close-up of the parametric lattice surface — the texture is unique to each person's cardiac data, functioning like a biological fingerprint.
Material exploration: comparing rigidity, tactile feel, and wearability across different 3D printing substrates.
The finished bracelet worn on the wrist — the position that maximizes daily skin contact and reinforces the heartbeat symbolism at the pulse point.
Designing Lapis required navigating a tension most UX projects don't face: the product's emotional value proposition is deeply personal, but the technical pipeline underneath it — PPG capture, parametric modeling, 3D printing — is inherently complex. The most important design decision was to keep those two things completely decoupled. Users should feel they are sending love, not configuring a biometric workflow.
Future iterations would explore notification design for the async loved-one recording flow, haptic feedback during HR capture to reinforce the biometric moment, and a post-delivery ritual within the app — something to mark the first time the bracelet is worn.
Lapis — UX/UI Design
Designing the digital experience that turns a loved one's heartbeat into a wearable piece of jewelry.
A mobile app for emotional intimacy — guiding users through heartbeat capture, bracelet customization, and 3D print order in a single, seamless flow.
Project Brief
Translating a biometric thesis into an intuitive, emotionally resonant mobile experience.
Design a mobile app that makes capturing a loved one's heartbeat and converting it into a 3D-printed bracelet feel intimate and meaningful — not clinical or technical.
Emotional-first design: every screen decision was tested against the question "does this feel warm, not sterile?" The dark theme, wave motifs, and soft pill buttons were all intentional responses to that brief.
A high-fidelity prototype covering the full user flow — from first open to print confirmation — with two distinct paths for recording your own or a loved one's heartbeat.
MA Human Experience Design thesis, Brunel University London. Companion to Case Study 1 (HF Research), which validated the emotional and neuroscientific foundations for Lapis.
A heartbeat is abstract — the app needed to make users feel their loved one's biology was being faithfully translated, without exposing any technical complexity underneath.
Recording a loved one's heartbeat is an emotionally charged act. A confusing flow or technical error in that moment could break the entire experience. Simplicity was a UX requirement, not a preference.
Research & Affinity Mapping
Synthesizing insights from interviews, literature, and naturalistic data into design directions.
Physical touch carries emotional weight that visual or digital formats cannot replicate. The bracelet must be felt to fulfill its purpose.
People regulate emotional states through physical objects tied to absent people — a behavior pattern that predates and justifies the Lapis concept.
The felt sense of connection — not just communication — is what people seek. Lapis needed to translate that feeling into material form.
Why people keep objects from the past, what makes an object feel like a person, and how proximity to objects activates memory and emotional regulation.
Competitive analysis revealed a gap: existing biometric wearables track health but carry no emotional or memorial purpose. Lapis fills that gap.
Oxytocin release through touch, PPG capture via smartphone camera, and parametric modeling of HRV data provided the technical scaffolding for the concept.
Vision & Inspiration
Two parallel directions: the digital aesthetics of the app interface, and the material language of the physical bracelet.
Dark, immersive interfaces where biometric data becomes something beautiful rather than clinical. Referencing health apps that make invisible body data visible and meaningful — the visual language of data streaming from a living system, bioluminescent gradients, and quiet darkness that makes light feel significant.
Parametric jewelry, computational material structures, and biomorphic 3D printing. The bracelet needed to look like it came from a biological process — organic lattices, wave-derived textures, and forms that carry the fingerprint of a heartbeat's amplitude and rhythm.
Style Guide
The visual language of Lapis — color, type, and UI components that make biometric data feel intimate rather than clinical.
100px radius · SF Pro Bold
Back arrow · Logo · Share
HRV capture · Dark overlay motion
Storyboard
Sara's journey — an Italian immigrant in her thirties, living in Canada, reconnecting with her mother through Lapis.
Sara, an Italian immigrant in Canada, sits alone after a call with her mother. Distance has become a weight she carries.
Sara sees an ad for the Lapis app. She downloads it — curious about the idea of a bracelet made from her mother's heartbeat.
The app guides Sara to invite her mother. Across the Atlantic, her mother receives a notification and opens the link.
Her mother follows the app prompts and records her heartbeat using her smartwatch. The biometric data is sent to Sara's app in Italy.
Sara sees the bracelet design generated from her mother's heartbeat. It is unlike anything she could have chosen herself.
The bracelet arrives. Sara wears it every day. It carries her mother's heartbeat at her wrist — a physical form of love across distance.
Wireframes
Low-fidelity screens establishing the app's information architecture and interaction flow before moving into high-fidelity design.
User Journey Map
Sara's emotional and functional journey across five stages — from discovering Lapis to wearing the finished bracelet every day.
| 01 · Discover | 02 · Set Up | 03 · Connect | 04 · Design | 05 · Receive | |
|---|---|---|---|---|---|
| Actions | Sees Lapis ad on social media. Opens App Store. Downloads the app. | Creates account. Answers 3 questions about herself and who will wear the bracelet. | Invites her mother via the app. Her mother receives a notification and records her heartbeat. | Views the bracelet generated from her mother's HRV. Selects style. Adjusts color. Places order. | Receives the package. Puts the bracelet on her wrist for the first time. |
| Touchpoints | Social media ad · App Store | Lapis app onboarding | Lapis app · Mother's phone · Smartwatch | Lapis app design screens | Email confirmation · Physical bracelet |
| Thoughts | "Can it really turn a heartbeat into jewelry? How does that work?" | "This flow feels thoughtful. I hope mom can do the recording part from Italy." | "Is she doing it right? What if the signal drops? I wish I could be there with her." | "This is actually from her heartbeat. It's completely unlike anything I would have picked." | "It's warm in my hands. It feels like she's right here with me." |
| Feeling | Curious | Engaged | Anxious | Surprised · Emotional | Connected · Moved |
| Emotion | |||||
App Experience Map
The complete app flow — two distinct heartbeat-capture paths that converge into a shared design and print experience.
Final App Screens
High-fidelity prototype screens covering the full user flow — onboarding, heartbeat capture, both paths, design selection, color customization, and print.
Design Decisions
Every visual and interaction choice in Lapis traces back to a specific rationale rooted in research or user insight.
| Decision | Type | Rationale | Research Connection |
|---|---|---|---|
| Dark background (#000012) | Visual | Biometric data comes from an invisible, mysterious biological source. The near-black background mirrors that unknown depth — making the data visualizations feel like something surfacing from within the body. | User interviews: participants described heartbeat data as "hidden," "private," and "deep inside." Bright UI frameworks would contradict that emotional register. |
| Cyan (#0DDFFE) for primary actions | Visual | Cyan reads as technological, clean, and trustworthy — associations the app needed to establish for the biometric capture step. It also evokes biophotonic light, reinforcing the living-system metaphor. | Inspiration board research: health apps (Oura, Apple Health) use cool blues and cyans to communicate precision and safety. |
| Pink (#D0268F) for heartbeat / HRV data | Visual | Pink is warm, biological, and emotional — distinct from the clinical associations of red. It marks every moment where the user's heartbeat is present: the capture animation, the ECG line, the progress ring gradient. | Survey data confirmed that the bracelet's value is emotional, not medical. Pink signals warmth over clinical precision. |
| Pill-shaped (100px radius) buttons | Interaction | Rounded forms feel gentle and non-threatening — important in an app where users interact during emotionally vulnerable moments. Sharp UI corners would introduce friction at the wrong time. | Emotional design principle: form language communicates emotional register before content is read. |
| Wave background animation | Visual | The undulating pink wave pattern appears on key screens (welcome, thank you, waiting). It evokes a heartbeat oscillation without displaying raw data — maintaining the emotional tone while the technical process runs in the background. | Naturalistic data: participants described the heartbeat as "waves," "rhythm," and "pulse" — not as graph lines or numbers. |
| Two-path flow (own vs. loved one's HRV) | Architecture | Research showed two distinct use cases: users who want to wear their own heartbeat, and users who want to carry someone else's. Both paths converge at design selection — keeping the codebase unified while honoring the distinct emotional journeys. | Interview findings revealed both use cases were equally valid and emotionally distinct. Collapsing them into one flow would have diluted the personal meaning of each. |
| Email fallback on print screen | Interaction | "You don't have a printer? Don't worry, email us your design and we will be happy to print it for you" — removes a potential drop-off point by offering a human alternative to self-printing. | Accessibility principle: the hardest moment to lose a user is right before conversion. The fallback preserves the emotional investment even when the technical path is blocked. |
Physical Output
The end of the Lapis experience is tangible: a 3D-printed bracelet, derived from a loved one's heartbeat, worn at the wrist every day.
Early fabrication: testing how the ECG-derived lattice structure behaves when printed in different materials and at different scales.
Close-up of the parametric lattice surface — the texture is unique to each person's cardiac data, functioning like a biological fingerprint.
Material exploration: comparing rigidity, tactile feel, and wearability across different 3D printing substrates.
The finished bracelet worn on the wrist — the position that maximizes daily skin contact and reinforces the heartbeat symbolism at the pulse point.
Designing Lapis required navigating a tension most UX projects don't face: the product's emotional value proposition is deeply personal, but the technical pipeline underneath it — PPG capture, parametric modeling, 3D printing — is inherently complex. The most important design decision was to keep those two things completely decoupled. Users should feel they are sending love, not configuring a biometric workflow.
Future iterations would explore notification design for the async loved-one recording flow, haptic feedback during HR capture to reinforce the biometric moment, and a post-delivery ritual within the app — something to mark the first time the bracelet is worn.