Joom

Как мы научились делать локализацию макетов в Figma в один клик

Делимся полезным инструментом.

Анна Ноджак, дизайн-директор Joom, рассказывает, как наладить работу с переводами, перестать сходить с ума от ручных переносов текста и автоматизировать работу с макетами в Figma, если у вас мультиязычное приложение.

На старте у продукта часто есть ряд потребностей, которые просто обязательно нужно закрыть. Не всегда есть возможность реализовать все сразу на самом высоком уровне, но наступает момент, когда ресурсов становится больше. Так, долгое время контент для App Store и Google Play готовился на аутсорсе. Он был. Он хорошо работал. Но хотелось лучше. И вот наконец мы решили делать его внутри команды.

Что представляет собой задача подготовки макетов для сторов? Пропустим здесь часть про анализ трендов и конкурентов, обработку данных о том, что рассказать нашим потенциальным пользователям и обсуждение, как лучше это показать. Сейчас будем говорить о подготовке макетов для двух платформ в трёх размерностях на 17 языках. Итого — 102 экрана. Поехали.

Часть первая, техническая. Мы не роботы, и мы хотим оптимизировать Ctrl+C и Ctrl+V

Страница приложения в сторе — это самая верхушка воронки, и коммуникация должна быть безупречной. Здесь решается, получите вы ещё одного пользователя или нет. Поэтому переводы в духе Google Translate не годятся. Нужно, чтобы текст был не просто складным и грамотным, а ещё и был адаптирован к современному звучанию языка, учитывал культурные особенности его носителей. В Joom за качество перевода отвечают кантри-менеджеры — если коротко, они руководят у нас клиентской поддержкой и контент-проектами на разных языках.

Получив переводы впервые, мы наивно решили, что можно просто взять и руками перенести всё в макеты. На деле оказалось, что перенос текстов на одном языке вместе с проверкой занимает около часа. На то, чтобы перенести все переводы, нужно потратить два дня скучнейшей, кропотливейшей работы, которая дико выматывает. И это только один вариант. Без правок. Без учета каких-либо накладок. О том, что в конечном счете один вариант — это вообще не результат, и нужно проводить серию экспериментов, можно даже не говорить. И да, это работа скорее для робота, а не для человека — слишком механическая, кропотливая и объемная. Стало очевидно, что надо искать какой-то другой способ. Нужна какая-то магия...

Пишем плагин для Figma

Figma позволяет манипулировать содержимым документа через систему плагинов, которые можно писать на TypeScript. Мой коллега Искандер Ситдиков согласился помочь с разработкой плагина. Казалось, нам нужно немного: загрузить словарь, найти все тексты и заменить их на соответствующие переводы.

Мы сразу заметили, что некоторые тексты переводить не нужно: числа, проценты, цены, названия Google Play, Joom, JoomPay, и решили поддержать настраиваемые исключения. Сделали первую версию плагина и порадовались скорости преображения макетов.

Ну как порадовались.

Макеты перевелись, но сработало это совсем не так, как хотелось бы: у нас было довольно много текста с гибридным форматированием, и всё оно слетело.

Дорабатываем форматирование

Если в одном абзаце было применено несколько стилей, как, например, в комментарии к посту, то вместо заголовка Medium Primary 100 и ссылки Regular Primary 60 мы получили весь блок Medium Primary 100. Переразмечать его вручную каждый раз после замены текста — долго и опасно, особенно на незнакомом языке.

Но казалось, мы можем довольно легко сделать и это автоматически, если допереведём выделенные части текстов. Оперативно отправили дополнительные тексты на перевод и приступили к разработке второй версии.

Новая версия плагина хитрым образом разбивала тексты на части и аккуратно подставляла в них переводы, гарантированно сохраняя правильное форматирование. Но и тут мы нашли маленькие косяки в форматировании: иногда цветом был выделен кусок текста с лишним пробелом на конце, из-за чего перевод для него просто не находился.

Добавляем конвертер валют

Дальше заметили, что у нас остались цены в рублях. Существующий плагин для конвертации валют работал не совсем так, как нам нужно. Важно было сохранить форматирование валют в том виде, в каком оно живёт у нас в приложении: обозначение, позиция, разделители. Поэтому добавили ещё и конвертер валют.

И всё уже вроде получилось. Мы снова порадовались. И тут настала очередь арабского и иврита.

Переводим на RTL языки

Этой части работы можно было бы посвятить целый роман, а не кусочек статьи. Просто поверьте мне, я выдохну, и пройдемся по фактам. Figma не поддерживает RTL языки — те, что пишутся и читаются справа налево. Боль.

Есть плагины для интерактивного ввода арабского текста, которые не подходили, и один плагин для форматирования RTL, который не работал. Ещё боль.

Подставлять и форматировать эти переводы руками было ещё опаснее, чем <вставьте ваше ужасное сравнение>. Уж лучше <вставьте ваш самый безрассудный поступок>.

Поковыряв существующие плагины и потратив ещё кучу нервов и сил, мы всё-таки добавили в наш плагин возможность переводить на RTL язык с правильной ориентацией текста, переносами и даже с сохранением форматирования.

Было очень сложно отлаживать корректное отображение арабского текста, имея под рукой лишь Google Translate и не зная языка. Но к сожалению, даже после всего этого колдовства с текстами полной автоматизации, как это было с другими языками, добиться не получилось, поскольку сами интерфейсы, порядок и направленность элементов всё-таки необходимо было переворачивать руками. Но это мы уже исправили и скоро выложим обновление плагина. Вот как он будет работать.

Раньше мы бы переносили тексты в макетах для пяти экранов на одном языке час. Перенос текстов на 17 языках занял бы больше двух дней монотонного труда. Теперь, когда плагин работает, перевод происходит в один клик.

Но это я забегаю вперед. Потому что до этого момента рассказ был только о сложностях, которые возникали на стороне макеты — плагин — Figma. А есть ещё одно большое направление, которое отняло больше всего времени и сил, поэтому о нем отдельно.

Часть вторая, человеческая. Мы всё ещё не роботы и хотим как можно меньше ошибаться

Плагин не человек, он не допускает ошибок и не прощает их. Он поможет, если не хватает какого-то перевода, если лишний пробел, если недостающий пробел и так далее. А вот люди допускают ошибки. Увы.

Исправляем ошибки в переводах (заранее)

Как я уже сказала, многие ошибки может засечь плагин. Но лучше их не допускать на стадии подготовки переводов, чтобы не возвращаться на дополнительный круг: попытаться внести перевод в макет — понять, что там есть ошибки — отправить тексты на доперевод — дождаться — вернуться к задаче. Тратится общее время, лучше делать сразу на чистовик.

Делаем общий контекст

Контекст очень важен: на макетах фразы выделены белым и красным цветом, но мы с вами отлично понимаем, что это один текст. Когда мы отправили эти фразы переводчикам в виде таблицы, в ней тоже были блоки текстов, выделенные цветом. Так вот, оказалось, что в таблице эти фразы не воспринимаются как связанные друг с другом. Переводы не удались.

Нам пришлось сделать более явную разметку и дополнительно пояснить переводчикам, что эти кусочки текста являются частью целого. Ещё один круг переводов, и мы пофиксили и эту проблему.

И вносим финальные правки

Плагин был полностью готов. Все переводы готовы. Макеты подогнали по шрифтам (вы знали, что заголовок в три строчки на английском легко превращается в шесть на итальянском?). Все готово, даже отдельная версия обложек для арабского и иврита! Мы выгружаем все макеты, которые нужно разложить по локалям, платформам, размерам и версиям. И если бы не усталость, то уже бы точно пришло время слез радости. Счастливо закрываем эту задачу.

Но тут кантри-менеджеры впервые видят тексты в макетах и… предлагают правки. Все правки приходят в виде документа, а нам нужно перенести их в таблицу. В таблице нет номеров экранов. Поэтому чтобы соотнести правки с макетами, приходится сверять текст и искать его в таблице. Правки присылали каждый в своей манере. Один переводчик пишет, какой текст на какой заменить, другой — сразу правильный вариант. Один не дублирует одинаковые тексты в разных версиях, другой перечисляет поэкранно... Сделали! Счастливо закрываем эту задачу?

Но тут кантри-менеджеры решают сделать переводы более нативными и предлагают правки. В этой итерации на каждом экране было всего по несколько незначительных правок, но из-за этого пришлось перепахать почти все тексты во всех локалях, заново проверить все экраны, заново всё выгрузить.

Мы научились на своих ошибках. А кто-то, возможно, сможет избежать их благодаря нашим рекомендациям.

  • Прежде всего, подготовьте основную версию макетов (ту, которую будете дублировать на разных языках) и тексты на переводы, в которых всё будет финально и безошибочно.
  • Вместе с текстами обязательно показывайте переводчикам макеты основной версии, чтобы они сразу хорошо понимали контекст задачи, и акцентируйте на этом внимание.
  • Если вам нужна разбивка блоков на составляющие, сделайте явную разметку, а также пропишите значение этой разметки и дополнительно акцентируйте на это внимание переводчиков.
  • Ну и главное, поясните важность того, что готовые переводы передаются только один раз, и никаких доработок. Потому что это выходит слишком дорого.

А ссылки на плагин будут?

Если вы тоже работаете со множеством языков, то делимся с вами плагином: Static Localizer.

А если вам интересно, как мы разрабатывали плагин, почитайте статью моего коллеги Искандера Ситдикова на Хабре (и посмотрите исходный код на GitHub).

И не стесняйтесь рассказать в комментариях о ваших самых рутинных дизайн-задачах!

0
75 комментариев
Написать комментарий...
David Goffman

Вопрос какой словарь вы используете, поэтому очень важно получать качественные переводы. Качественный перевод зависит от языка донора и языка, на который требуется делать перевод. Есть несколько компаний, которые дают единый API для всех переводчиков сразу. Например, https://mylang.pro/ru/

Ответить
Развернуть ветку
Andrey Nazarchuk

Ну да, универсального переводчика нет, и вряд ли когда-нибудь будет. Машинный перевод это быстро конечно, но все равно правки живым человеком нужно в любом случае делать. Эра роботов еще не наступила)

Ответить
Развернуть ветку
Evgeniy Fomin

Полностью согласен, универсального переводчика нет. Все зависит от языка с которым вы работаете.

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Ivan Pomidoroff

Я не верю, неужели чудо случилось и появился плагин для локализации. Спешно убежал проверять. Спасибо!!!

p.s. Дед Мороз, сделай чтобы все работало как задумывалось :)

Ответить
Развернуть ветку
Joom
Автор

Если понравится, с вас лайкос и звёздочка на Гитхабе! 

Ответить
Развернуть ветку
3 комментария
Alex Metelkin

я аж вином подавился, это реально чудо!

Ответить
Развернуть ветку
Игорь Старков

Их давно несколько штук же!
И переводчиков на разные языки и тд

Ответить
Развернуть ветку
1 комментарий
Iskander Sitdikov

Да! Если у вас возникнут проблемы, то смело пишите сюда - мы поможем, улучшим документацию (она пока сырая) и пофиксим баги (ну а вдруг) 😊

Ответить
Развернуть ветку
Ivan Pomidoroff

Пробую на маке, сразу следующие баги (или пока не разобрался)

- чекбокс направление перевода выглядит не совсем как чекбокс и не работает (не меняет визуально стрелочку направления и не работает сам плагин)если руками переставить названия языков - работает
- в словаре разделитель таб, если заполнять его в фигме, таб - переводит фокус к другому контролу
- как выгрузить словарь из плагина? Пока вижу только загрузить
- почему загрузка словаря и исключений отдельно?
- если выбрать два слова с разными переводами (например ру и ен) - не переведется ни одно из слов, хотя ошибку только на одно покажет

Но идея супер! Буду дальше испытывать
p.s. Такой плагин не жалко и за денежку купить, архинужная вещь!

Ответить
Развернуть ветку
Алексей Андреев

Надо Google/Yandex translate прикрутить - для прототипов / дизайнов сойдёт

Ответить
Развернуть ветку
Максим Мостовой

Лучше Deepl

Ответить
Развернуть ветку
1 комментарий
Famil Gadzhiev

Огонь! как вовремя
спасибо ребят!

Ответить
Развернуть ветку
Захар Лобанов

Огонь-плагин! Спасибо, очень вовремя!

18 локалей в приложении, как раз вчера начал обновлять скрины руками, а тут такой подгон.

Сейчас буду тестить.

Обратил внимание, что у вас после применения плагина названия фреймов не меняются.
В последнем видео в посте вы перевели с русском на арабский, а в названиях осталось Russian. Может, удобней было бы, чтобы и название менялось под язык?

Ответить
Развернуть ветку
Захар Лобанов

Проверил, прекрасно работает.
https://www.youtube.com/watch?v=cHYQVs9NBwA

Спасибо вам! Если можно, добавьте отключаемый ренэйминг переведенных фрэймов (смену RU на EN, например).

Ответить
Развернуть ветку
1 комментарий
Iskander Sitdikov

1. Стрелочка - не чекбокс, просто стрелочка. Обычно мы переводим с какого-то базового языка на другие, поэтому обратный перевод почти никогда не требуется (хотя возможен).
2. Да, подразумевается, что словарь подгружается из файла или вставляется копипастой. В крайнем случае можно отдельно скопировать символ табуляции откуда-нибудь и вставлять его через Cmd+V где требуется.
3. Выгрузить словарь нельзя, потому что это поле не столько для редактирования, сколько для вставки/загрузки.
4. Словарь и исключения загружаются отдельно, потому что они в разных форматах. Исключения - это просто список регулярок (по одной на строку). Плюс, список исключений меняется редко, а вот переводы правятся и часто перезаливаются в плагин.
5. Перевод не происходит вообще, если плагин понял, что есть проблемы в выделенных нодах.

Ответить
Развернуть ветку
Ivan Pomidoroff

1. Имею ввиду чекбокс справа, перед кнопкой "перевести"

Ответить
Развернуть ветку
3 комментария
Ivan Pomidoroff

5. По отдельности слова переводятся, проблема именно если выбрать несколько, например,
выделяем два "привет" - переводит "hello"
выделяем "привет" и "hello" - не переводит ничего, ошибку кидает только на одно слово

p.s. И да, иконка загрузки скорее ассоциируется с "экспорт", наоборот стрелка нужна

Ответить
Развернуть ветку
4 комментария
Natalia Fedorova

О май гад! Конец 2020 не так уж плох! Еще не тестила, но это же чудо-чудесное диво-дивное!

Ответить
Развернуть ветку
Ivan Pomidoroff

Краткие итоги: испытан плагин на боевом проекте - около сотни десктопных экранов сразу. Все работает корректно. Из появившихся прям хотелок-хотелок

1. Хотелось бы чтобы проверка перевода шла не только в прямом, но и сразу в обратном направлении, так как такой случай был - в одну сторону все отлично, а в обратную оказалось один перевод на два значения, плюс откат не сработал (толи большой объем, толи еще что).
2. Очень не хватает быстрого переключения направления перевода- клик-клик и экран проверил (выше уже писал про это)
3. И фигма начинает заметно тормозить при переводе большого кол-ва экранов, но наверное это уже не к плагину вопросы

В остальном не нарадуемся! Спасибо!

Ответить
Развернуть ветку
Иван Афонасов

Ребята, привет!
Почему-то плагин ругается, не хочет переводить.
В гайде почитал только про локальную установку плагина, не очень понял зачем, если можно из коммьюнити сразу. Но установил и так, и сяк Если ставить локально, как в инструкции — то в панельке плагинов Static Localizer не отображается.

В траблшутинге сказано «you will see the list of untranslatable nodes right in the UI». Но на конкретные ноды не ссылается ошибочка. Плюс, пробовал перевести даже отдельный текстовый блок, и фрейм с одним текстовым блоком. Не сработало почему-то. Подскажите пожалуйста, что я делаю не так? Спасибо :)

Ответить
Развернуть ветку
Iskander Sitdikov

Привет! Ставить нужно через community (гайд был написан до публикации - спасибо, поправил). Видимо, при последней публикации код частично не доехал, и сообщения об ошибках сломались :( Уже исправил. Еще раз спасибо!

Ответить
Развернуть ветку
Alex Ganin

Полезный плагин, спасибо разработчикам! Но есть вопрос. В своей работе мы столкнулись с такой задачей, нам нужно чтобы переводимые заголовки были в две строчки и разрывались ровно в тех местах в которых мы нажали Enter. Можно ли вставить какой то спец символ чтобы при переводе разрывы строк были в нужных нам местах или просто чтобы переносы сохранялись как в оригинальном тексте?

Ответить
Развернуть ветку
Iskander Sitdikov

Вопрос очень хороший. Есть несколько соображений.

Во-первых, "сохранить разрывы как в оригинальном тексте" - хотелка понятная, но неосуществимая, так как при переводе слова часто меняют порядок непредсказуемым образом.

Во-вторых, у меня уже было желание использовать разделитель параграфов http://www.unicode-symbol.com/u/2029.html (вводится через Shift+Enter) для таких целей, но против этого есть пара сильных доводов. Если дизайнер решил из эстетических соображений добавить ручные переносы в оригинальные тексты (что очень разумно), то абсолютно не ясно, как потом отличить их от разделения текста на параграфы. К тому же, формировать TSV-словарь для таких многострочных текстов сложно в любом редакторе.

TL;DR. Чтобы "сохранить переносы" в идеале нужно разбить оригинальный текст на параграфы, вынеся их в отдельные ноды и связав их в auto layout. Это заметно прибавит вам гибкости и позволит переводить каждый параграф отдельно, в одну строчку.

Ответить
Развернуть ветку
2 комментария
Ivan Pomidoroff

Работаем с плагином, все прекрасно даже на текущем этапе, но появился вопрос - а можно ли сделать автовыгрузку текстов?
То есть выделил блок - нажал кнопку и на выходе файл словаря с текстом из макетов и ес-но пустым переводом. Чтобы не выковыривать по кусочкам рискуя пропустить где-то скрытый текст

Ответить
Развернуть ветку
Iskander Sitdikov

Плагин уже это делает. В некотором виде. Если не хватает каких-то переводов (например, можно изначально передать пустой словарь, в котором есть только заголовок), то внизу появляется список ошибок с ссылками, а вот в самом низу - раздел "We suggest to translate the following phrases", где приведен список фраз, которые достаточно перевести, чтобы все было ок. Его можно скопировать. Пока мы сами делаем именно так.

Ответить
Развернуть ветку
Каця Буднікава

Привет! Было бы круто получить обучающее видео или послушать доклад на митапе :) А то из статьи не совсем ясно, как пользоваться
Спасибо!

Ответить
Развернуть ветку
Anna Nodzhak

Катя, уже думаем в этом направлении. На сегодняшний день уже не помним как жили без плагина: написали еще один плагин в помощь к решению этой задачи, составили максимально подробную инструкцию по применению для чайников (для себя😇) и планируем записать тутор.
Когда будет апдейт — пошумим немножко про это, чтобы оповестить всех, кому было интересно.

Ответить
Развернуть ветку
Виталий Куделевский

Как вариант автоматом вытаскивать скриншоты из приложения, сверстать текст и мокапы в html, а переводы текстов подтягивать по ключам.

4 приложения, 52 локали, 8 устройств
Ушло 2 недели

Ответить
Развернуть ветку
Tolik Harchuk

Спасибо)

Ответить
Развернуть ветку
Полный будильник

Хм, если это правда, то это пушка :-\
*ушел тестить"

Ответить
Развернуть ветку
Ivan Pomidoroff

Не переводит пробел :(
То есть в словарь добавляю " " и перевод " " (не спрашивайте зачем) и выдает ошибку

UPD Добавил в исключения ^\s*$ и все отлично, еще раз низкий поклон за этот восхитительный плагин!

Ответить
Развернуть ветку
Iskander Sitdikov

Дело в том, что при загрузке словаря плагин обрезает пробелы в начале и конце каждого поля. Поэтому оба пробела превратятся в пустые строки. Это было сделано, чтобы меньше зависеть от произвола переводчиков (те изредка добавляли лишние пробелы после фразы). Но замечание хорошее, уходит в гайд. Спасибо!

Ответить
Развернуть ветку
Игорь Дмитриев

Молодцы!

Ответить
Развернуть ветку
Georgy Alaverdyan

Спасибо за столь полезный плагин. Уже установил и буду переводить теперь намного быстрее и эффективнее!

Ответить
Развернуть ветку
Алексей Бурдин

Столкнулся с вопросом:
Можно ли как-то в плагине для переводов сделать игнорирование ошибок
http://joxi.ru/eAOBp4lUkJKNQ2
Чтобы он переводил только то, для чего предоставлен перевод

Получил ответ: 
Практика игнорировать пропущенные переводы вслепую - дурная практика. Правильнее брать список непереводимых фраз (в самом низу после перевода) и добавлять то, что нужно, в Exceptions в виде регулярного выражения. Для этого почти всегда достаточно к фразе добавить ^ в начало и $ в конец.

Вдруг тоже кто-то столкнется :)

Ответить
Развернуть ветку
Ivan Pomidoroff

А что делать со словами, которые имеют одинаковый перевод? Или наоборот - разный перевод в зависимости от контекста. Плагин выдает ошибку в этом случае, мол повторы в словаре. 
И еще, так понимаю плагин все повторяющиеся пробелы заменяет на один?

Ответить
Развернуть ветку
Iskander Sitdikov

Пока что можно только погрустить, увы. В ближайшее время добавлю какую-нибудь опциональную разметку тэгами, чтобы не усложнять жизнь тем, кому это не нужно, но иметь возможность разруливать подобные ситуации.

Да, плагин нормализует тексты перед переводом, заменяя переносы на пробелы, удаляя потом лишние. Проблем вообще не возникает, если формировать список фраз автоматически через плагин, а не руками. Основной аргумент в пользу такого подхода - дизайнеры могут расставлять ручные переносы в текстах, зачастую оставляя висящие пробелы перед переносом, так что после замены его на пробел (а не заменять нельзя - слова сольются) сложно понять, сколько по задумке тут было пробелов.

Ответить
Развернуть ветку
3 комментария
Денис Усов

Если цена не кусается, то у lokalise есть плагин для figma.

Ответить
Развернуть ветку
Iskander Sitdikov

Правда, есть. И у Crowdin есть. Но есть много но. Например, Crowdin вообще не поддерживает тексты с гибридным форматированием: https://support.crowdin.com/figma-plugin/#uploading-translations-back-to-figma (видно прямо на скринах). Lokalise поддерживает крайне урезанный вариант с разметкой bold/italic/underlined при помощи тэгов в самой платформе Lokalise. И конечно же, никто не заморачивался по поводу отображения переводов на RTL языки.

Еще в нашем случае не требуется разметка всех текстов ключами. Это может стрелять, когда одно и то же слово в разных контекстах нужно перевести по-разному. Но для и для этого можно придумать обходные пути (добавление скрытых символов или внедрение тех же опциональных ключей локализации).

Ответить
Развернуть ветку
Ivan Pomidoroff

Смотрел, не понравилось
Не только у lokalise есть

Именно этот плагин мне лично импонирует тем, что не нужно никуда ничего посылать, регистрироваться, в какой то сервис, к каким то переводчикам - что сам перевел, то и видишь, все под рукой (плюс есть специфика - "свои" переводчики)

Ответить
Развернуть ветку
Mike Kosulin

Ссылка на гитхаб битая из-за скобки

Ответить
Развернуть ветку
Iskander Sitdikov

Вроде, открывается 🤷‍♂️
https://github.com/thoughteer/figma-static-localizer

Ответить
Развернуть ветку
1 комментарий
Irina Griaznykh

Получается, что всё равно отдаёте на вычитку нейтивам макеты? Они правки в макетах оставляют? Как финальные правки реализуете?

Ответить
Развернуть ветку
Anna Nodzhak

Все правки вносятся в таблицу с переводами, а оттуда уже с помощью плагина подтягиваем их в макеты.
В самих макетах ничего вручную не правим.

Ответить
Развернуть ветку
1 комментарий
Anna Nodzhak

Все переводы делают кантри-менеджеры. В идеале это процесс в одну итерацию: отдать таблицу с текстами на основном языке – получить заполненную таблицу с переводами.
Но в нашем конкретном примере, в первый раз, получилось три итерации.
1. Отдали основные тексты – получили переводы
2. Получили правки после того, как кантри-менеджеры увидели тексты в макетах
3. Получили правки после того, как кантри-менеджеры захотели усовершенствовать переводы

Ответить
Развернуть ветку
Iskander Sitdikov

И над интеграцией с Google/Yandex Translate обязательно поработаем)

Ответить
Развернуть ветку
Artemida Svet

обьясните, а как проект с переводами из фигмы,
уходит в локализированные компиляции проекта ?

Ответить
Развернуть ветку
Irina Griaznykh

поддерживаю вопрос

Ответить
Развернуть ветку
1 комментарий
Karina Tashkhanova

Подскажите, пожалуйста. При переводе на RTL языки скобочки в тексте выворачиваются наоборот. Можно ли с этим что-то сделать?

Ответить
Развернуть ветку
Iskander Sitdikov

Огромное спасибо за внимательность! Обращение RTL текстов был сделан на коленке, так что подобные казусы были вполне ожидаемы. Я только что опубликовал фикс для круглых, квадратных и фигурных скобок. Если вдруг возникнет потребность в каких-то еще заменах, вроде знаков сравнения, то можно и это быстро поправить. Единственный момент - скобочки должны быть отделены от внешнего окружения пробелом.

Ответить
Развернуть ветку
Alex

Большое спасибо за плагин. 

Вопрос к автору и к комьюнити. Кто как организует файл фигмы. Как храните локализованные версии, все рядом с оригиналом или на отдельных пейджах?
 
Как вносите правки, наиболее очевидный: превращаете весь экран в символ -> делаете дубликат символа -> переводите. Тогда изменяя мастер, не нужно править остальные. Так или есть более лучший вариант? 

Ответить
Развернуть ветку
Anna Nodzhak

Приветик. Жаль, что пропустила вопросик, но все-таки поделюсь, может что-то будет еще актуально.
Касательно хранения. В первых версиях мы разносили каждый язык на свою страницу. Расчет был на то, что дерево языков поможет нам не запутаться. Но на текущий момент мы храним все локализованные версии на одной странице, разграничивая их только визуально и заголовками: так есть возможность быстро окидывать взглядом все версии и вносить корректировки там, где все-таки хочется добавить небольшой ручной тюн.

Ответить
Развернуть ветку
Anna Nodzhak

Касательно правок. У всех макетов есть мастеры. Как оптимально обернуть зависит от специфики конкретных макетов. Например, в первой версии скринов мы делали двойную вложенность: мастером являлся уникальный экран в конкретном размере, который состоял из текста и вложенного мастера с интерфейсом, единым для всех размеров. Таким образом, если нужно было внести изменение в интерфейсе – это делалось в одном макете.
Но такое переиспользование в разных размерах требует очень внимательной подгонки интерфейса, чтобы все красиво обрезалось. Так что чаще такая вложенность, кажется, избыточна и достаточно каждый экран в каждом размере обернуть в символ. Итого, смотрим по ситуации. Сейчас чаще используем один уровень вложенности.

Ответить
Развернуть ветку
1 комментарий
Читать все 75 комментариев
null