Потребительский продукт · Веб-редактор
PicsArt
Поверхность редактирования, которой реально пользуются миллионы, и пайплайн ассетов, который держит её консистентной.
- Role
- JavaScript-разработчик
- Years
- 2020
- Links
- picsart.com
Контекст
PicsArt — потребительская креативная платформа с веб-редактором для широкой, а не технической аудитории. Работа над этой поверхностью оценивается по тому, ощущается ли взаимодействие мгновенным на железе, которое никто не контролирует.
Задача
Потребительский редактор должен оставаться быстрым и предсказуемым, притом что каждый ассет в нём переменный — стикеры, фигуры и текст приходят в разных начертаниях, заливках и шрифтовых вариантах, и каждый вариант должен отрисовываться корректно без участия дизайнера.
Архитектура
- React и TypeScript по всей поверхности основного веб-редактора.
- Adobe-скриптинг для интеграции SVG, чтобы варианты ассетов генерировались, а не поддерживались вручную.
- Юнит- и интеграционные тесты как страховка поведения редактора, где регрессия сразу видна пользователю.
Что я построил
- Функциональные, производительные и масштабируемые фичи основного веб-редактора с фокусом на плавности редактирования.
- Расширяемые переиспользуемые компоненты, написанные с расчётом на быстро меняющийся потребительский продукт.
- Работа с Adobe-скриптами для интеграции SVG — варианты ассетов и шрифтовые кастомизации по всей библиотеке редактора.
- Покрытие юнит- и интеграционными тестами, защищающее целостность и производительность приложения.
Технологии
Сложные места
- Потребительские редакторы оценивают по ощущению. Задержка, которую вы не заметите в дашборде, очевидна, когда человек тащит стикер.
- Держать один ассет корректным во всех вариантах и шрифтовых обработках, которые редактор может к нему применить, не поддерживая каждый вручную.
Результат
Более быстрая и лучше протестированная поверхность основного редактора, где варианты SVG-ассетов и шрифтовые кастомизации создаются скриптами, а не ручной поддержкой.
Next case study
Coverant →Контакты
Расскажите, что вы создаёте — и что мешает двигаться дальше.
Если задача находится на стыке финансовой инфраструктуры, продукта и разработки, скорее всего, я смогу помочь.
Записаться на созвон
30 мин · видео
Предпочитаете сначала написать? armmamyan@gmail.com