6 расширений Google Chrome для работы над проектом, если вы — не дизайнер

И тестировщикам, и разработчикам, и проджект менеджерам временами приходится фиксить дизайн (особенно в маленькой компании, где могут запросто «пригрузить» смежной ролью). UI дизайнер Лиана Климович сделала подборку расширений для браузера Chrome, которые максимально упростят эту задачу.

«Здесь речь идет не о дизайне, не о прототипировании и не о создании/проектировании чего-либо. А о быстром ревью, быстрой проверке стилей, отступов и так далее. Часто это очень нужно при работе на этапе тестирования», — уточнила Лиана в LinkedIn.

1. VisBug — инструмент отладки веб-дизайна с открытым исходным кодом, созданный с помощью JavaScript. С его помощью можно прямо на странице редактировать, перемещать, измерять — в общем, фиксить дизайн без Figma или Photoshop. Также он подходит для ревью задеплоенных дизайнов (QA и PM, не благодарите).
2. GoFullPage — инструмент, который поможет сделайте снимок экрана текущей веб-страницы полностью, одним полотном, а не только того «клаптика», который у вас перед глазами. Готовый скрин можно загрузить в виде изображения или PDF, или даже просто перетащить на рабочий стол.
3. Window Resizer — расширение, которое изменяет размер окна браузера, чтобы эмулировать различные разрешения. Будет особенно полезно для веб-дизайнеров и разработчиков, поскольку помогает им тестировать свои макеты в разных разрешениях браузеров.

   Да, есть же Webkit Inspector, скажете вы. Но это расширение изменяет разрешение окна самого браузера, и можно оценить респонсив дизайн в его, так сказать, натуральном виде.

4. Corporate Ipsum — генерирует случайный текст-рыбу (для использования в качестве заполнителя) по слову или абзацу.

   «QA, BA и FE, пожалуйста, используйте какой-то более-менее реальный контент, а не qwerty12345 и т.п., для тестов или ваеров. Чем более приближен контент к реальности, тем раньше можно предусмотреть разные ошибки, а так же сделать дизайн более привлекательным для презентации заказчику», — говорит Лиана.

5. Whatfont — самый простой способ определить шрифты на веб-страницах. Чтобы проверить веб-шрифты, достаточно навести на них курсор. Дизайнер назвала это расширение must have: это простой доступ к характеристике любого текстового элемента на странице (название шрифта, размер, цвет, насыщенность и т.д.).
6. Eye dropper — расширение с открытым исходным кодом, которое позволяет выбирать цвета с веб-страниц, создавать палитры цветов и сохранять личную историю цветов. Работает как «пипетка». Плюс расширения — можно быстро и просто проверить правильность цвета элементов.