Harbor

Harbor is an emergency preparedness app. It guides users through checklists and relevant knowledge bases to ensure readiness in case of any emergency - such as house fire, earthquake, or other natural disasters.

Email Design System

Working within existing brand guidelines, I built out an email design system in Figma Libraries with preset atoms, components, and modules.

The library utilizes the Properties feature to enable toggling between variants such as desktop/mobile, light/dark mode, and layout variations, to make the process of designing marketing emails more accurate, consistent, and efficient.

Onboarding emails

Harbor’s new subscriber onboarding emails consisted of a series of 11 weekly emails. The series breaks down the emergency preparation syllabus into bitesize modules, focusing on one topic per week, with the objective of getting users into the app to complete their preparedness goals.

Utilizing the design system, the email header sets clear intentions for the content of the email by verbally and visually showing the topic of the week. Illustrations were created to complement existing brand assets and further communicate the topic of focus and where it fits in to the user’s lifestyle.