Большинство фрилансеров веб-дизайнеров сталкивается с типом заявок, когда необходимо сделать редизайн сайта или приложения. Причины у заказчиков для этого могут быть разные - дизайн может устареть, низкая конверсия, ошибки, ребрендинг, новый функционал, просто захотелось освежить дизайн и тд.
Если в случае с низкой конверсией и ошибками, на помощь приходит UX анализ - про который здесь написано множество статей, маркетинговый анализ, QA - тестирование (хороший диз - и швец и жнец и на дуде игрец), с результатами которых не поспоришь, то в случае с изменением визуала, когда у тебя нет за спиной студийного бренда и команды, в ход вступает всеми любимая (нет) вкусовщина. И многие коллеги потом ругаются в дизайнерских чатиках на заказчиков, что не понимают, чего те хотят, что заказчикам хочется розового поярче, и белого на желтом. Таких недопониманий можно легко избежать, если правильно выстроить отношения с заказчиком. Не по типу: раб <-> заказчик, а профессионал <-> заказчик, и аргументировать свои решения не вкусовщиной, а логикой и опытом. Нет своего опыта - учись на чужом, читай исследования, например - NNG.
Ошибка
Главная ошибка при редизайне, особенно, когда заказчик просит структуру не трогать - это начинать работу с поиска референсов, либо сразу приступать к отрисовке по полученным референсам.
Начинать же нужно с аудита. Даже если работаете с маленькими бюджетами, да, это занимает время. Но это выявляет проблемные зоны проекта, ошибки, которые в свою очередь тоже могут влиять на логику. Полученные данные при аудите задают правильный вектор работы, и закрывают возможное желание заказчика экспериментировать, чем сохраняют ваши нервы)
UI аудит
Главное правило при любом аудите - все документировать, во-первых, система - это хорошо, во-вторых, если заказчику захочется поиграться со шрифтами, можно будет напомнить ему этим документом о прошлых ошибках. Лучше всего для этого подходит Гугл Докс. Что именно включать в аудит зависит от проекта, но чаще всего проверяются:
1. Цвета
Я обычно начинаю с цветов, беру пипетку и собираю все цвета и градиенты, которые есть в проекте. Если в задании было условие - сохранить палитру, это помогает убрать лишние рандомные цвета и почистить палитру. Если цветов для обозначения глубины или иерархии наоборот недостаточно, то стоит добавить темные/светлые/серые оттенки базовых цветов.
2. Типографика
Беру все шрифты, размеры, начертания на каждой странице проекта. Лучше, чтобы было не больше 4 стилей на странице, но во всем проекте стилей может быть больше. В итоге получается таблица, по которой будет видно, что какие-то стили используются всего пару раз и их можно будет убрать, что два разных начертания могут иметь одинаковые функции и тд.
3. Сетка
Смотрю, все ли элементы расположены по сетке, если использовалась система отступов, то проверяю их.
4. Стили элементов
На этом этапе я проверяю бордеры, радиусы углов, тени, блюры, иконки. Размеры инпутов, чекбоксов, форм, кнопок и тд. Так же составляю таблицу, и выявляю лишнее.
5. Проверка контрастности
Если на первый взгляд кажется, что контрастности недостаточно, проверяю. Это опять же весомый аргумент в пользу отказа от ряда экспериментов)
Такой подход облегчает работу, иногда достаточно исправить имеющиеся ошибки, чтобы улучшить дизайн. Так же полезно проводить аудит своих работ, но еще лучше сразу начинать работать со стилями и составлять кит, чтобы не наворотить лишнего и сэкономить свое время.
Спасибо всем, кто дочитал, надеюсь, что такой подход будет кому-нибудь полезен
Кому интересно - мой инстаграм , когда - нибудь я начну его вести
А для работодателей - мое портфолио
Интересная статья,благодарен!