Як тестувальникам, так і розробникам, і проджект-менеджерам іноді доводиться перевіряти дизайн (особливо в невеличкій компанії, де можуть легко додати суміжні обов’язки). UI-дизайнер Ліана Климович підготувала добірку розширень для браузера Chrome, які значно полегшать це завдання.
«Йдеться не про сам дизайн, не про прототипування чи створення чогось нового. А про швидкий огляд, оперативну перевірку стилів, відступів та подібних деталей. Це часто буває дуже необхідно під час роботи на етапі тестування», — уточнила Ліана у LinkedIn.
VisBug — це інструмент для налагодження веб-дизайну з відкритим програмним кодом, створений за допомогою JavaScript. Він дозволяє безпосередньо на сторінці редагувати, переміщати, вимірювати — загалом, коригувати дизайн без необхідності використання Figma чи Photoshop. Він також підходить для перевірки вже розгорнутих дизайнів (QA та PM, будь ласка, дякуйте).
GoFullPage — розширення, що дозволяє зробити повний знімок поточної веб-сторінки одним цілісним зображенням, а не лише видимою частиною. Готовий скріншот можна зберегти у форматі зображення або PDF, або навіть просто перетягнути на робочий стіл.
Window Resizer — розширення, яке змінює розмір вікна браузера для імітації різних роздільних здатностей. Це буде особливо корисно для веб-дизайнерів та розробників, оскільки допомагає їм тестувати свої макети при різних роздільних здатностях браузерів. Так, ви можете сказати, що існує Webkit Inspector. Але це розширення змінює роздільну здатність самого вікна браузера, що дозволяє оцінити адаптивний дизайн у його, так би мовити, природному вигляді.
Corporate Ipsum — генерує випадковий текст-заповнювач (placeholder) за одним словом або абзацом. «QA, BA та FE, будь ласка, використовуйте для тестів або вайрфреймів хоч якийсь більш-менш реалістичний контент, а не ‘qwerty12345’ тощо. Чим ближчий контент до реальності, тим раніше можна виявити різні помилки, а також зробити дизайн привабливішим для презентації замовнику», — зазначає Ліана.
Whatfont — найпростіший спосіб визначити шрифти на веб-сторінках. Для перевірки веб-шрифтів достатньо навести курсор. Дизайнер назвала це розширення обов’язковим: воно забезпечує легкий доступ до характеристик будь-якого текстового елемента на сторінці (назва шрифту, розмір, колір, насиченість тощо).
Eye dropper — розширення з відкритим вихідним кодом, яке дозволяє вибирати кольори з веб-сторінок, створювати палітри кольорів та зберігати персональну історію кольорів. Воно працює як “піпетка”. Перевага розширення полягає в можливості швидко та просто перевірити коректність кольору елементів.
Головна > Добірки > 6 розширень Google Chrome для роботи над проектом, якщо ви — не дизайнер
Необхідні cookies забезпечують роботу сайту. Google Analytics використовуємо лише за вашою згодою. Змінити вибір можна в «Налаштуваннях cookies».
Необхідні
Завжди активні
Забезпечують основні функції та безпеку сайту, а також збереження вашого вибору щодо cookies. Цю категорію неможливо вимкнути через налаштування згоди.
Налаштування
Технічне зберігання або доступ, необхідні для збереження ваших налаштувань, про які ви не надсилали окремого запиту.
Статистика
Допомагають аналізувати відвідуваність і використання сторінок за допомогою Google Analytics. Застосовуються лише за вашою згодою.Технічне зберігання або доступ, що використовується виключно для анонімної статистики. Без судового рішення, добровільної згоди вашого інтернет-провайдера або додаткових записів третьої сторони ця інформація зазвичай не дозволяє вас ідентифікувати.
Маркетинг
Використовуються для персоналізації реклами та відстеження взаємодії з нею. Застосовуються лише за вашою згодою.