diff --git a/blog/2024-01-19-releasing-ai-customizations.mdx b/blog/2024-01-19-releasing-ai-customizations.mdx
new file mode 100644
index 000000000..95822e80a
--- /dev/null
+++ b/blog/2024-01-19-releasing-ai-customizations.mdx
@@ -0,0 +1,65 @@
+---
+slug: releasing-ai-customizations
+title: "Elevate Your Translations with AI Translation Customization"
+description: "Enhance your translations effortlessly with Tolgee AI Translation Customization by allowing personalized project descriptions, language notes and key descriptions"
+authors: [mchalupnikova]
+tags: ['tolgee', 'ai', 'tolgee translator']
+image: '/img/blog/ai_customizations.webp'
+---
+In June 2023, we released our own [Tolgee AI Translator](https://tolgee.io/blog/tolgee-ai-translator).
+
+It doesn't ignore context like other traditional machine translators, which makes it great for translating
+especially short texts. Tolgee Translator understands the context of the strings used in your app: that's why
+it can provide the best results.
+
+Throughout autumn 2023, we refined the translator further, including, for example, the language formality feature.
+And now, we are taking another step closer to the [autonomous software translation](https://tolgee.io/blog/autonomous-localization),
+adding a couple of new features, which make the results of Trolgee Translator even more accurate.
+
+We're excited to announce the release of a **new feature, AI Translation Customization**,
+so you can improve the translation by providing a description of your project or adding a language-specific note.
+
+
+
+
+
+:::info
+This functionality is available only in the cloud Business subscription or higher and in subscribed self-hosted instances using the Tolgee AI translator.
+:::
+
+## New Key Features
+Imagine translating an app for golf players. 🏌️
+With AI Translation Customization, you can ensure the tone, terminology, and cultural sensitivity are spot-on.
+AI Translation Customization allows you to tailor your translations in three ways:
+
+### 1. Project Descriptions: Define the overall tone and terminology for your project.
+Project descriptions are beneficial when you have a project in a specific domain. You can also specify your overall tone of voice. For instance, if you're translating an app for golf players, you can provide a description like the following:
+
+Example
+```
+This is an app for golf players.
+We are motivating the players to get better.
+Please use golf terminology.
+Use a friendly tone of voice.
+```
+
+### 2. Language Notes: Specify conventions and tones for specific languages and standardize your terminology.
+Language notes are helpful in specifying your conventions for a specific language. You can also use it to specify common terminology.
+Sometimes, you might also want to specify the tone of voice for a specific language if you wish to communicate differently to different cultures.
+Example for Japanese 🇯🇵
+
+```
+In Japanese, we are using polite language. Japanese Golf players are very polite.
+Always translate "Golf Club" as ゴルフクラブ, referring to the equipment used to hit the ball, not a group of players.
+```
+
+### 3. Key Descriptions: Improve translation accuracy with detailed key descriptions.
+Key descriptions can help translators to understand the context of the key. Key descriptions are also provided to the Tolgee AI translator to help it understand the key.
+You can see the description in the editor directly under the key name.
+
+By completing these three steps, you ensure that the translation results of Tolgee Translator
+will be more precise for your project, and you save some extra reviewing time for your translated texts.
+
+Try AI Translation Customization today and take your translations to a whole new level!
+Explore more details about AI Translation customization in the [documentation](/platform/projects_and_organizations/ai-translation-customization)
+and let us know in the [Tolgee Slack community](https://Tolg.ee/slack) if you have any questions about this new feature.
diff --git a/platform/projects_and_organizations/ai_translation_customization.mdx b/platform/projects_and_organizations/ai_translation_customization.mdx
new file mode 100644
index 000000000..c0787d846
--- /dev/null
+++ b/platform/projects_and_organizations/ai_translation_customization.mdx
@@ -0,0 +1,67 @@
+---
+id: ai-translation-customization
+title: AI Translation Customization
+sidebar_label: AI Translation Customization
+---
+
+import { ScreenshotWrapper } from "../shared/_ScreenshotWrapper";
+
+:::info
+This feature is only available with a Business subscription or higher on Tolgee cloud and on Subscribed Self-hosted
+instances with [Tolgee AI translator](/platform/translation_process/tolgee_translator) enabled as the translation provider.
+:::
+
+If you wish to enhance the results from the [Tolgee AI translator](/platform/translation_process/tolgee_translator),
+you can customize it according to your needs. Tolgee enables you to input key descriptions,
+project descriptions, or language notes. This information is provided along with the actual string
+that requires translation. It helps to understand the context of your translation project and provide
+more accurate translations.
+
+## Providing project description
+
+Project descriptions are beneficial when you have a project in a specific domain.
+You can also specify your **overall tone of voice**.
+For instance, if you're translating an app for golf players, you can provide a description like the following:
+
+```text title="Example"
+This is an app for golf players.
+Please use golf terminology.
+Use a friendly tone of voice.
+We motivate the players to get better.
+```
+
+To provide the project description,
+- Select `Languages` in the project menu.
+- Select `AI Customization`.
+- Click the `+ Description` button in the `Project description` section.
+
+
+
+## Providing language notes
+
+Language notes are useful to specify your conventions for a specific language. You can also use it to specify common terminology.
+Sometimes, you might also want to specify the tone of voice for a specific language
+if you wish to communicate differently to different cultures.
+
+```text title="Example for Japanese"
+In Japanese, we are using polite language. Japanese Golf players are very polite.
+Always translate "Golf Club" as ゴルフクラブ, referring to the equipment used to hit the ball, not a group of players.
+```
+
+To provide the language description,
+ - Select `Languages` in the project menu
+ - Select `AI Customization`
+ - Click the `+` on the language you want to customize
+
+
+
+## Providing key description
+
+You can read more about providing key descriptions [here](/platform/translation_keys/keys#key-description).
+Tolgee uses the same key description for AI translation as visible in the Translation editor.
diff --git a/platform/projects_and_organizations/languages.mdx b/platform/projects_and_organizations/languages.mdx
index 5616d2549..ba60389db 100644
--- a/platform/projects_and_organizations/languages.mdx
+++ b/platform/projects_and_organizations/languages.mdx
@@ -3,60 +3,33 @@ id: languages
title: Languages
sidebar_label: Languages
---
+import { ScreenshotWrapper } from "../shared/_ScreenshotWrapper";
+
-## Languages settings
### Adding new language
-To add a language to the project, simple use the search field to find the language (or to create a custom one). If you want to add that language, simply click `Add`.
+To add a language to the project,
+- Click the `+ Language` button
+- Then start to type in the search field to find the language
+- Select the desired language or click `+ New custom language` to create a custom one.
-
+
If you want to edit the language details before adding it to the project, click on the pencil icon.
You can also change the language tag, original name and English name, and flag.
-
-
-### Editing languages
-When opening the Languages settings, you can see the list of all languages in the project. You can **change the base language** in the [project settings](project_settings).
-
-
-You can edit the language details by clicking on the cog icon in the language list. You can also change the language tag, original name and English name, and flag.
-And if you wish to delete the language, you can do so by clicking the `Delete language` button.
-
-
-
-
-## Machine translation settings
-
-Machine translation (MT) uses external providers to translate base text to currently edited language.
-Number of machine translations that you can use is limited by credits which are shown in language settings. You can **buy more credits** in the [billing settings](organization_settings#billing).
-
-Currently, we support the following machine translation providers:
-
-- Tolgee AI translator based on ChatGPT
-- Google Translate
-- Amazon Translate (AWS)
-- DeepL
-- Microsoft Azure Translator (Azure Cognitive)
-
-You can selectively **enable or disable machine translation suggestions** for each language and each MT provider.
-When you set a "primary" MT provider, it will be displayed first in the suggestions list and will be used for [automatic translation](#automatic-translation) and for [batch machine translations](/platform/translation_keys/batch_operations#available-batch-operations).
-
-Some providers support formality selection (for certain languages), you can adjust that with the formality select.
-
-
-
-To enable machine translation when self-hosting, please check out the [configuration](/platform/self_hosting/configuration#machine-translation).
-
-> TIP: You can adjust default settings that will be used for all languages, or you can edit settings for individual languages, which will override the default.
-
-### Automatic translation
-
-Automatic translation is a feature that allows you to translate base text automatically when a new string is added.
-
-You can enable whether Tolgee should automatically translate new strings by looking for **100% translation memory matches** or by using **machine translation** with the selected primary MT provider. You can also enable automatic translation when there are **new keys imported** by the CLI, Import UI or any REST API endpoint importing multiple keys.
+
-Auto translation is also triggered when base language value is changed from empty to non-empty.
+### Editing Languages
+Upon opening the Languages settings, a list of all languages in the project is visible.
+The base language can be **changed** in the [project settings](project_settings).
-Translations that were translated automatically (and not edited by humans) are marked by a provider indicator or translation memory indicator. You can clear this indicator by hitting the remove button displayed while hovering the indicator icon. Until you touch the value manually or clear the indicator, the translated value will be automatically updated as the base language translation is updated.
+To edit the language details, click on the cog icon in the language list.
+This allows changes to the language tag, original name, English name, and flag.
-
+To delete a language, click on the `Delete language` button.
diff --git a/platform/projects_and_organizations/machine_translation_settings.mdx b/platform/projects_and_organizations/machine_translation_settings.mdx
new file mode 100644
index 000000000..505f8fbb8
--- /dev/null
+++ b/platform/projects_and_organizations/machine_translation_settings.mdx
@@ -0,0 +1,47 @@
+---
+id: machine-translation-settings
+title: Machine Translation Settings
+sidebar_label: Machine Translation
+---
+import { ScreenshotWrapper } from "../shared/_ScreenshotWrapper";
+
+Machine translation (MT) uses external providers to translate base text to currently edited language.
+Number of machine translations that you can use is limited by credits which are shown in language settings. You can **buy more credits** in the [billing settings](organization_settings#billing).
+
+Currently, we support the following machine translation providers:
+
+- Tolgee AI translator based on ChatGPT
+- Google Translate
+- Amazon Translate (AWS)
+- DeepL
+- Microsoft Azure Translator (Azure Cognitive)
+
+You can selectively **enable or disable machine translation suggestions** for each language and each MT provider.
+When you set a "primary" MT provider, it will be displayed first in the suggestions list and will be used for [automatic translation](#automatic-translation) and for [batch machine translations](/platform/translation_keys/batch_operations#available-batch-operations).
+
+Some providers support formality selection (for certain languages), you can adjust that with the formality select.
+
+:::info
+Tolgee AI translator uses metadata to provide better results. [Read more here](/platform/translation_process/tolgee_translator).
+:::
+
+
+
+To enable machine translation when self-hosting, please check out the [configuration](/platform/self_hosting/configuration#machine-translation).
+
+> TIP: You can adjust default settings that will be used for all languages, or you can edit settings for individual languages, which will override the default.
+
+### Automatic translation
+
+Automatic translation is a feature that allows you to translate base text automatically when a new string is added.
+
+You can enable whether Tolgee should automatically translate new strings by looking for **100% translation memory matches** or by using **machine translation** with the selected primary MT provider. You can also enable automatic translation when there are **new keys imported** by the CLI, Import UI or any REST API endpoint importing multiple keys.
+
+Auto translation is also triggered when base language value is changed from empty to non-empty.
+
+Translations that were translated automatically (and not edited by humans) are marked by a provider indicator or translation memory indicator. You can clear this indicator by hitting the remove button displayed while hovering the indicator icon. Until you touch the value manually or clear the indicator, the translated value will be automatically updated as the base language translation is updated.
+
+
diff --git a/platform/shared/_ScreenWrapper.css b/platform/shared/_ScreenWrapper.css
index 740f6e736..abda7cee0 100644
--- a/platform/shared/_ScreenWrapper.css
+++ b/platform/shared/_ScreenWrapper.css
@@ -5,6 +5,11 @@
display: inline-grid;
overflow: hidden;
}
+.screen-wrapper--container img {
+ max-width: 100%;
+ width: auto;
+ height: auto;
+}
.screen-wrapper--header {
background: #f8f9f9;
diff --git a/platform/translation_keys/keys.mdx b/platform/translation_keys/keys.mdx
index dd4a5ef6a..2a615f489 100644
--- a/platform/translation_keys/keys.mdx
+++ b/platform/translation_keys/keys.mdx
@@ -3,6 +3,7 @@ id: keys
title: Keys
sidebar_label: Keys
---
+import { ScreenshotWrapper } from "../shared/_ScreenshotWrapper";
Translation keys are used to identify a string or text that is displayed to the user.
They are used in the translation files to translate the text to the user's language. They are also used in the code to display the text to the user.
@@ -27,18 +28,24 @@ To add new translation keys to Tolgee, you have a few options:
To create a new translation key, click the `+ Add` button on the project's Translations view.
-
+
When adding a new key, you can specify the following options:
- **Key name**: The name of the key. This name is used to identify the key in the translation files and in the code. The name must be unique within a project.
- **Namespace**: The namespace of the key. This is an optional field that can be used to structure keys into different "buckets" – namespaces separate translation keys to separate files.
- It can be useful in large projects, we recommend it for projects with more than ~1000 keys. You can learn more on the [Namespaces](namespaces) page.
+It can be useful in large projects, we recommend it for projects with more than ~1000 keys. You can learn more on the [Namespaces](namespaces) page.
- **Tags**: Tags can be used to group keys together. You can select multiple tags. You can learn more on the [Tags](tags) page.
- **Language text(s)**: The text that should be displayed to the user in each language. You can specify the text for one or more languages.
- You can select which languages to show here by selecting them in the dropdown at the top. If you don't specify the text for a language, the key will be marked as "Untranslated" for that language.
+You can select which languages to show here by selecting them in the dropdown at the top. If you don't specify the text for a language, the key will be marked as "Untranslated" for that language.
-
+
## Naming conventions
@@ -46,12 +53,12 @@ When it comes to naming conventions for translation keys, there are no hard and
However, it is generally advisable to use naming conventions that are easy to understand and follow a consistent format. Here are some common naming conventions that can be used for translation keys:
1. **Meaningful names**: Translation keys should be named based on the meaning or purpose of the content they represent.
- For example, a translation key for a button that says `Save` could be named `save_button`.
+For example, a translation key for a button that says `Save` could be named `save_button`.
2. **Descriptive names**: It's also helpful to use descriptive names that provide additional information about the content, such as the location of the content or its function.
- For example, a translation key for a header that appears on the homepage could be named `homepage_header`.
+For example, a translation key for a header that appears on the homepage could be named `homepage_header`.
3. **Consistent naming**: To ensure consistency across translation keys, it's recommended to follow a standard naming convention.
4. **Short and memorable**: Translation keys should be short and easy to remember.
- Avoid using long, complicated names that are difficult to type or remember.
+Avoid using long, complicated names that are difficult to type or remember.
Overall, the most important factor is to choose a naming convention that makes sense for your specific project or organization, and to use it consistently throughout the translation process.
This can help to ensure that translation keys are easy to manage and understand, and that translations are accurate and consistent.
@@ -59,3 +66,16 @@ This can help to ensure that translation keys are easy to manage and understand,
:::tip
If you want to learn more about naming translation keys, check out our [blog post](/blog/naming-translation-keys) on the topic.
:::
+
+
+## Key description
+Key descriptions can help translators to understand the context of the key. It's also provided to the
+[Tolgee AI translator](/platform/translation_process/tolgee_translator) to help it understand the key.
+
+You can see the description in the editor directly under the key name.
+
+
+
+To modify the description, you can do so in the key editing dialog by clicking the key name or description.
diff --git a/platform/translation_process/tolgee_translator.mdx b/platform/translation_process/tolgee_translator.mdx
index 55411b374..66b17b934 100644
--- a/platform/translation_process/tolgee_translator.mdx
+++ b/platform/translation_process/tolgee_translator.mdx
@@ -3,26 +3,44 @@ id: tolgee_translator
title: Tolgee Translator
---
+Tolgee Translator is based on ChatGPT and can translate with included [Tolgee Context](/js-sdk/tolgee_context),
+key description, project description, language notes and results from the translation memory.
+
+## Tolgee Translator with context
+
:::info
This functionality is available only in the Cloud version with SDK 5.9.0 and higher.
:::
-Tolgee Translator is based on ChatGPT and can translate with included [Tolgee Context](/js-sdk/tolgee_context). Tolgee Context is a statistic about relations between the keys based on how they are laid out in your application. Context is gathered by Tolgee SDK ([read more](/js-sdk/tolgee_context)).
+Tolgee Context is a statistic about relations between the keys based on how they are laid out in your application.
+Context is gathered by Tolgee SDK. [Read more.](/js-sdk/tolgee_context)
_With [Tolgee Context](/js-sdk/tolgee_context), ambiguous translations can be improved radically._
-The presence of context for the given key is indicated at the bottom left corner of the key cell and at the Tolgee Translator icon with a little ⚡ icon.
+The presence of context for the given key is indicated at the bottom left corner of the key cell and at the Tolgee
+Translator icon with a little ⚡ icon. By clicking on the icon, you can see the context.
## Tolgee Translator without context
-Tolgee Translator can improve the quality of translation even without the [Tolgee Context](/js-sdk/tolgee_context). It knows that you are translating a software product, and it gets access to the translation memory. So if there are similar translations, it will keep it consistent.
-
-It also knows the translation key, which can also contribute to better translation.
+Tolgee Translator can improve the quality of translation even without the [Tolgee Context](/js-sdk/tolgee_context).
+It knows the key name, it can be enhanced with key description, project descriptions and language notes.
+Also, it gets access to the [translation memory](/platform/translation_process/translation_memory),
+so if there are similar translations, it will keep it consistent.
_Tolgee Translator can help maintain consistency with other translations if translation memory is available._
It can essentially see the same information as a human translator (when screenshots are replaced by [Tolgee Context](/js-sdk/tolgee_context)).
+
+## Tolgee Translator customization
+
+You can customize the Tolgee Translator to your needs. Read more about that in the
+[AI Translator Customization section](/platform/projects_and_organizations/ai-translation-customization).
+
+:::tip
+If you want to learn more about autonomous translation with Tolgee Translator, check out our
+[blog post](/blog/autonomous-localization) on the topic.
+:::
diff --git a/sidebarPlatform.js b/sidebarPlatform.js
index baaef10fc..d1ce5213d 100644
--- a/sidebarPlatform.js
+++ b/sidebarPlatform.js
@@ -15,6 +15,8 @@ module.exports = {
items: [
'projects_and_organizations/project_settings',
'projects_and_organizations/languages',
+ 'projects_and_organizations/machine-translation-settings',
+ 'projects_and_organizations/ai-translation-customization',
'projects_and_organizations/members',
'projects_and_organizations/import',
'projects_and_organizations/export',
diff --git a/src/component/pricing/featuresTable/featuresCloud.tsx b/src/component/pricing/featuresTable/featuresCloud.tsx
index 98f7907c0..87d97ee70 100644
--- a/src/component/pricing/featuresTable/featuresCloud.tsx
+++ b/src/component/pricing/featuresTable/featuresCloud.tsx
@@ -111,6 +111,11 @@ export const featuresCloud = {
label: 'In-context translating',
items: ['y', 'y', 'y', 'y'],
},
+ {
+ type: 'item',
+ label: 'AI Customization',
+ items: ['n', 'n', 'y', 'y'],
+ },
{
type: 'item',
label: 'Translation memory',
diff --git a/src/component/pricing/featuresTable/featuresSelfHosted.tsx b/src/component/pricing/featuresTable/featuresSelfHosted.tsx
index 9cdc73126..876619a95 100644
--- a/src/component/pricing/featuresTable/featuresSelfHosted.tsx
+++ b/src/component/pricing/featuresTable/featuresSelfHosted.tsx
@@ -43,6 +43,11 @@ export const featuresSelfHosted = {
label: 'In-context translating',
items: ['y', 'y', 'y'],
},
+ {
+ type: 'item',
+ label: 'AI Customization',
+ items: ['n', 'y', 'y'],
+ },
{
type: 'item',
label: 'Translation memory',
diff --git a/src/component/pricing/pricingPlan/PricingFeatures.tsx b/src/component/pricing/pricingPlan/PricingFeatures.tsx
index 451f13c91..5d98489d1 100644
--- a/src/component/pricing/pricingPlan/PricingFeatures.tsx
+++ b/src/component/pricing/pricingPlan/PricingFeatures.tsx
@@ -48,6 +48,7 @@ const FEATURES_MAP = {
'backup-configuration': Backup configuration,
'team-training': Team training,
'account-manager': Account manager,
+ 'ai-prompt-customization': AI Customization,
};
export type Feature = keyof typeof FEATURES_MAP;
diff --git a/src/pages/pricing/index.tsx b/src/pages/pricing/index.tsx
index 2a9856a33..5e9842f6b 100644
--- a/src/pages/pricing/index.tsx
+++ b/src/pages/pricing/index.tsx
@@ -154,6 +154,7 @@ export default function Pricing() {
'webhooks',
'multiple-content-deliveries',
'custom-content-storage',
+ 'ai-prompt-customization',
]}
minHeights={MIN_PLAN_HEIGHTS}
action={
diff --git a/src/pages/pricing/self-hosted.tsx b/src/pages/pricing/self-hosted.tsx
index aca7d9b6f..26c49d0ac 100644
--- a/src/pages/pricing/self-hosted.tsx
+++ b/src/pages/pricing/self-hosted.tsx
@@ -103,6 +103,7 @@ export default function SelfHosted() {
'webhooks',
'multiple-content-deliveries',
'custom-content-storage',
+ 'ai-prompt-customization',
]}
secondaryPrices={[
{
diff --git a/static/img/blog/ai-customizations.webp b/static/img/blog/ai-customizations.webp
new file mode 100644
index 000000000..b3d20cb98
Binary files /dev/null and b/static/img/blog/ai-customizations.webp differ
diff --git a/static/img/blog/ai_customizations.webp b/static/img/blog/ai_customizations.webp
new file mode 100644
index 000000000..b3d20cb98
Binary files /dev/null and b/static/img/blog/ai_customizations.webp differ
diff --git a/static/img/docs/platform/add_key_button.png b/static/img/docs/platform/add_key_button.png
deleted file mode 100644
index 368941674..000000000
Binary files a/static/img/docs/platform/add_key_button.png and /dev/null differ
diff --git a/static/img/docs/platform/add_key_button.webp b/static/img/docs/platform/add_key_button.webp
new file mode 100644
index 000000000..43414a0f3
Binary files /dev/null and b/static/img/docs/platform/add_key_button.webp differ
diff --git a/static/img/docs/platform/ai-customization/language-notes.webp b/static/img/docs/platform/ai-customization/language-notes.webp
new file mode 100644
index 000000000..fd0fb1b50
Binary files /dev/null and b/static/img/docs/platform/ai-customization/language-notes.webp differ
diff --git a/static/img/docs/platform/ai-customization/project-description.webp b/static/img/docs/platform/ai-customization/project-description.webp
new file mode 100644
index 000000000..dc0b6495d
Binary files /dev/null and b/static/img/docs/platform/ai-customization/project-description.webp differ
diff --git a/static/img/docs/platform/create_key_form.png b/static/img/docs/platform/create_key_form.png
deleted file mode 100644
index 79d0d9c3d..000000000
Binary files a/static/img/docs/platform/create_key_form.png and /dev/null differ
diff --git a/static/img/docs/platform/create_key_form.webp b/static/img/docs/platform/create_key_form.webp
new file mode 100644
index 000000000..c7b370428
Binary files /dev/null and b/static/img/docs/platform/create_key_form.webp differ
diff --git a/static/img/docs/platform/key_description.webp b/static/img/docs/platform/key_description.webp
new file mode 100644
index 000000000..02ae067fb
Binary files /dev/null and b/static/img/docs/platform/key_description.webp differ
diff --git a/static/img/docs/platform/languages-mt-settings.webp b/static/img/docs/platform/languages-mt-settings.webp
new file mode 100644
index 000000000..afdfad415
Binary files /dev/null and b/static/img/docs/platform/languages-mt-settings.webp differ
diff --git a/static/img/docs/platform/languages_add.png b/static/img/docs/platform/languages_add.png
deleted file mode 100644
index 4633ebc0b..000000000
Binary files a/static/img/docs/platform/languages_add.png and /dev/null differ
diff --git a/static/img/docs/platform/languages_add.webp b/static/img/docs/platform/languages_add.webp
new file mode 100644
index 000000000..37365acd4
Binary files /dev/null and b/static/img/docs/platform/languages_add.webp differ
diff --git a/static/img/docs/platform/languages_add_details.png b/static/img/docs/platform/languages_add_details.png
deleted file mode 100644
index 7c7581c5a..000000000
Binary files a/static/img/docs/platform/languages_add_details.png and /dev/null differ
diff --git a/static/img/docs/platform/languages_add_details.webp b/static/img/docs/platform/languages_add_details.webp
new file mode 100644
index 000000000..0c577e998
Binary files /dev/null and b/static/img/docs/platform/languages_add_details.webp differ