# Discovery-and-engagement



# Service Discovery & Engagement Guide

> Effective service discovery and promotion are crucial for user engagement and business growth. This pattern combines seamless navigation with strategic feature promotion to create value for both users and organizations.

## Benefits

The combination of seamless navigation and strategic feature promotion creates significant value for both users and organizations. When implemented properly, this pattern delivers clear advantages:

**For Users**

1. **Discovery Through Context**: Find relevant tools exactly when needed
2. **Seamless Experience**: Move between applications while maintaining workflow
3. **Clear Value Proposition**: Understand benefits before commitment
4. **Guided Growth**: See natural progression path for their needs

**For Organizations**

1. **Increased Adoption**: Higher discovery and conversion of complementary services
2. **Reduced Friction**: Seamless transitions reduce abandonment
3. **Strategic Promotion**: Right message at the right time

## Implementation Strategy

### 1. Navigation & Discovery

Navigation and discovery is handled by the `m-app-menu` component. It is used to display the main navigation and the additional services.

[AppMenu Documentation →](?path=/docs/components-appmenu--docs)

<img
  src="menu-promotion-pattern/app-menu.png"
  alt="App menu showing the main navigation and the additional services"
  style={{ maxWidth: "400px", width: "100%" }}
/>

### 2. Feature Promotion

Feature promotion is handled by the `m-promotion-dialog` component. It is used to display a promotion dialog with a clear headline, description, benefits and call-to-action.

[PromotionDialog Documentation →](?path=/docs/components-promotion-dialog--docs)

<img
  src="menu-promotion-pattern/promotion-example.png"
  alt="Example of a promotion dialog showing a new feature announcement with clear headline, description, benefits and call-to-action"
  style={{ maxWidth: "400px", width: "100%" }}
/>

#### Content Structure

1. **Clear Feature Badge**: Mark new or premium features distinctly, e.g. "New", "Premium", "Addon", "Feature"
2. **Compelling Headline**: Benefit-focused, action-oriented titles, "Check references digitally with Refensa"
3. **Concise Description**: Problem-solution explanation, "Save time and money by checking references digitally"
4. **Key Benefits**: 2-3 main features with visual aids, "Save time", "Save money", "Improve quality"
5. **Clear Call-to-Action**: Direct next steps, "Learn more"

#### Writing Guidelines

- Focus on user benefits over technical features
- Use everyday language, avoid jargon
- Keep descriptions brief and scannable
- Include concrete, relatable benefits

### 3. Lead Generation

Include `m-product-lead-form` component in the promotion dialog. This component is used to collect leads for the product. The form is ready to be used by providing the necessary data about the user and the product chosen.

[ProductLeadForm Documentation →](?path=/docs/components-product-lead-form--docs)

<img
  src="menu-promotion-pattern/form.png"
  alt="Example of a product lead form"
  style={{ maxWidth: "400px", width: "100%" }}
/>

## Example Implementation

Open the menu and click on the **additional services** in the **more services** section.

<Canvas of={WithAppMenu} />

## Implementation Requirements

For technical implementation details, see:

- [m-app-menu](?path=/docs/components-appmenu--docs)
- [m-promotion-dialog](?path=/docs/components-promotion-dialog--docs)
- [m-product-lead-form](?path=/docs/components-product-lead-form--docs)
- [m-nav-group](?path=/docs/components-navgroup--docs)
- [m-nav-group-app](?path=/docs/components-navgroupapp--docs)

This guide helps create an effective service discovery and promotion strategy that benefits both users and organizations while maintaining a seamless, professional experience.