Airbnb открыл библиотеку для дизайна на React и Sketch

Сегодня команда дизайнеров Airbnb открыла свою внутреннюю библиотеку для отображения компонентов React непосредственно в Sketch. Вместо того, чтобы пытаться заставить Sketch экспортировать код, команда Airbnb зашла с противоположной стороны – и экспортирует код в скетчи.

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

Для любого продукта, будь то Airbnb или Facebook, легко увидеть, как одно новое правило в дизайне может изменить представление большего количества элементов – и за этим очень трудно уследить. Если рендеринг Sketch  может быть мгновенно обновлен модификацией кода, то от этой проблемы можно избавиться. Здесь и находит свое применение библиотека React-Sketchapp.

Библиотека позволяет мгновенно строить прототипы и наполнять их данными — например, автоматически тестировать локализацию:

Поведение на разных экранах:

Динамически работать с картами:

Библиотека доступна в GitHub: https://github.com/airbnb/react-sketchapp.