# Keeping the feedback experience consistent across apps

> Keep feedback forms consistent across your apps by sharing placement, trigger style, type names, locale rules and statuses. Let each product differ only in its key, accent color and product name, set through one template.

Source: https://escutaproduto.com/resources/consistent-feedback-experience
Last updated: 2026-10-09

## Decide what should match and what can differ

Start with a list of three columns: what must match across your apps, what can differ by brand and what belongs to one product only. Must match: the form's type names, the five statuses, the reply style and the placement of the feedback button. Can differ: the accent color, the language setting and the product name. Product specific: the product's key, its allowed origins and its webhook.

Write the list once. Every new app should copy it instead of reinventing it. Consistency comes from a shared decision, not from memory.

## Use the same placement and trigger

Put the feedback button in the same corner of every app. The widget default is the right side, which you can set explicitly with data-position="right". Choose one position and keep it. A customer who learns the button in one app will look for it in the same place in the next. If one app needs the button on the left for layout reasons, treat that as a deliberate exception and write it down.

Use the same trigger style too. The default floating button works everywhere. Where a page already has its own help link, set data-trigger="none" to hide the floating button, then open the form from that help link with an element that has data-escuta-open. That keeps the entry point consistent without a second button competing with the help link.

## Match the copy before you match the color

Customers notice wording before they notice color. If one app says "Send feedback" and another says "Report an issue", people will wonder whether they are reporting a bug or sharing an idea. The form uses four types: bug, idea, praise and other. Choose labels that map to those types in every app, and use the same sentence in the text around the button.

Language matters too. The widget supports English and Portuguese, and data-locale sets it explicitly. The default follows the browser language, which is usually right, but set it when your audience and your interface language differ. Use the same locale rule across all apps, so a Portuguese visitor does not get English in one product and Portuguese in another for no reason.

## Give each product its own accent color

The accent color is the one place where each product should look different. Set the color in each product's widget snippet with data-color, and keep the same value as the product's accent color so the hosted feedback page matches the widget. That gives each app its own identity while the structure stays the same. Pick colors with enough contrast against the page background, and test the button on both light and dark pages.

Each app loads its own snippet with its own key and color:

```html
<!-- Scheduler app -->
<script src="https://escutaproduto.com/widget.js" data-key="pk_your_scheduler_key" data-color="#1d4ed8" data-position="right" data-locale="en" defer></script>

<!-- Invoicing app -->
<script src="https://escutaproduto.com/widget.js" data-key="pk_your_invoicing_key" data-color="#0f766e" data-position="right" data-locale="en" defer></script>
```

## Keep the configuration in one template

Write the snippet once as a template, and let the key and color be the only values that change per app. Keep the template in a shared note or a snippet library, and copy it into each project. When you change a shared setting, such as the position, change the template first and then update each app on purpose.

Do not hand-edit the attributes in five places. Small differences pile up. An app with a different position and no comment explaining why will confuse the next person who maintains it.

## Match your replies and statuses

Replies should sound like the same person wrote them. Use the same greeting, the same length and the same sign-off across products. Keep replies short: one line that thanks the customer, one line that says what you did, and one line that says what happens next.

Statuses matter just as much. New, Planned, In progress, Done and Closed mean the same thing in every product, as described in [one feedback inbox for many products](/resources/one-inbox-many-products). When a status changes meaning between apps, your weekly routine starts comparing unlike things. Write the meaning in one place and link to it from your routine.

## Common inconsistencies to avoid

- **Different allowed origins for the same domain.** A staging domain added to one product and forgotten in another makes the widget work in one app and fail in the other.
- **Two entry points.** One app shows a help link and a floating button. Customers see two options and pick either at random.
- **Mismatched types.** One app uses only bug and idea, while another uses all four types. Your counts then mean different things.
- **Forgotten locales.** A Portuguese app with English labels, or the reverse, damages trust quickly.

## Check consistency once a quarter

Every quarter, open each app's feedback button, submit a test message and compare the result. Check the placement, the labels, the language, the status of the test item in the dashboard and the alert that arrives in the channel. Five minutes per app catches most drift before a customer does. Write the date of each check in your notes, so you can see how long any drift lasted.

## How to keep the widget consistent with Escuta Produto

Create one product per app in the dashboard, with its own allowed origins, webhook and accent color. Use the [widget docs](/docs/widget) to check every option, and keep the template with the same position, trigger and locale rules across apps. Use the [hosted page docs](/docs/hosted-page) if some apps need a link instead of a button. For the weekly routine that keeps all of them readable, see [a feedback routine for five products](/resources/feedback-routine-multiple-products).

## Frequently asked questions

### What should stay the same across feedback widgets in different apps?

Keep the placement, the trigger style, the four type names, the locale rules and the five statuses the same. Let the product key, accent color and product name change, and set them from one shared template.

### Should each app use a different accent color for the widget?

Yes, that is the one place where each product should look different. Set a data-color value per app that has enough contrast with its page, and keep the rest of the snippet identical.

### Why set the locale explicitly when the browser language already works?

The default follows the browser, which is usually right. Set the locale when your interface language and your audience differ, and use the same rule in every app so visitors get the same language across products.