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 — розширення з відкритим вихідним кодом, яке дозволяє вибирати кольори з веб-сторінок, створювати палітри кольорів та зберігати особисту історію кольорів. Працює як «піпетка». Плюс розширення — можна швидко і просто перевірити правильність кольору елементів.