loading

Show info
.

© 2026 Srava Design

CRM + Email Marketing

Nature CRM Template Library (Email + Landing Pages) UX/UI Design/ Email Marketing Category UI/UX Design Date...

Details

sarvadesign. Sarva design uxdesign

Nature CRM Template Library (Email + Landing Pages)

UX/UI Design/ Email Marketing

Category UI/UX Design
Date May , 2023
Client Ram Boutique

Nature CRM Template Library (Email + Landing Pages) : is a scalable CRM template system designed to deliver consistent, responsive campaign experiences across email and landing pages. The focus is on reusable components, fast production workflows, and localization-ready layouts to support multi-region delivery.

Problem Statement

Campaign assets were often rebuilt from scratch, slowing down delivery

Goal

Build reusable, responsive templates for email and landing pages

Improve consistency across campaigns using a component-based library

Reduce production time with clear layout rules and handoff specs

Ensure localization-safe layouts for different copy lengths and regions

Challeng

Email and landing pages became inconsistent across devices

Localization and long copy frequently broke layouts and hierarchy

Maintaining brand consistency while iterating quickly with stakeholders

Process

  1. Audit & Requirements: Defined key campaign types (announcement, offer, onboarding, re-engagement, event) and recurring content blocks.
  2. Design System Foundations: Established typography scale, spacing rules, and reusable UI components in Figma.
  3. Template Creation: Built a modular set of email templates and matching landing page layouts (desktop + mobile).
  4. Localization Stress Test: Created short/long copy variants and flexible content-safe zones to prevent truncation and overflow.
  5. Production Handoff: Prepared specs (breakpoints, padding, image ratios) and a QA checklist for implementation accuracy.

Style Guide

Typography

 

  • Headings: Clear hierarchy (H1/H2/H3) with responsive scaling
  • Body: Readable size and line-height for email and web

 

Layout & Spacing

 

  • Mobile-first grid, consistent margins/paddings
  • Component spacing rules for predictable stacking

 

Components

  • CTA buttons (primary/secondary), cards, hero blocks, footer/legal blocks
  • Variant rules: image/no-image, 1–3 column sections where applicable

PALET COLOUR

The color scheme is the same as brand design color.

User Flow

Wireframe

Landing Page

Email Template

Timeline: 3 weeks
Programs Used: Figma, Adobe XD, Adobe Photoshop