Веб-дизайн, веб-разработка, UI и UX: В чем разница и что вам нужно?
В чем разница между веб-дизайном и разработкой? А как насчет UI против UX? Что означают эти дивизии? Почему так много акронимов? Не технологические люди хотят, чтобы все было удобнее для пользователя!

Содержание статьи
Азбука IT
—

—
«Веб-дизайн» — это немного архаичный термин, относящийся ко временам, когда один человек обрабатывал все аспекты дизайна веб-сайта. По современным стандартам термин «веб-дизайнер» может быть немного расплывчатым; сегодня, благодаря технологиям и нашему более глубокому пониманию ремесла, у нас есть радуга подразделений.


- Более того, вам нужно знать, чего вы хотите, прежде чем вы сможете найти лучшего веб-дизайнера для вас. Из-за большого количества специализаций речь идет не о том, хороший или плохой дизайнер, но подходит ли он для вас.
- Обратите внимание на их портфолио. С уделением особого внимания графическому дизайну веб-дизайнеры имеют свои уникальные художественные стили.
- Ищите мастерство тех аспектов, которые вы цените. Если у вас есть сайт с тяжелым текстом, посмотрите, как они обрабатывают типографику, читаемость и макет страницы. Если вы строите магазин электронной торговли, посмотрите, знают ли они, что делает хорошую страницу продукта.
- Является ли их предпочтительное программное обеспечение совместимым с тем, что использует ваша команда? Существует множество различных дизайнерских программ: Adobe Photoshop, Illustrator, InDesign и Sketch, а также программное обеспечение для создания прототипов, например UXPin или Balsamiq. Проконсультируйтесь с вашим другим персоналом, чтобы узнать, какие у вас варианты.
- Спросите своего дизайнера об их процессе проектирования и его сроках. Дизайнеры имеют свои собственные методы и циклы проектирования, поэтому дважды проверьте, что вы нанимаете кого-то, что подходит для вашей корпоративной культуры, а также ее расписания.
Веб-разработка
—
Веб-дизайн и разработка отличаются использованием кода. Развитие — это то, где вещи становятся техническими, но хорошая новость заключается в том, что вам не нужно знать, что говорят ваши разработчики, пока они это делают (хотя это, безусловно, полезно для изучения основ).
Веб-разработка разделена на две основные категории:
Front-end (a.k.a. на стороне клиента ): код для отображения веб-сайта (или приложения) на экране. Передний разработчик отвечает за то, чтобы оживить видение веб-дизайнера, как правило, используя компьютерные языки, такие как HTML, CSS и JavaScript. Естественно, не все, что планировал дизайнер, реалистично выполнимо, поэтому разработчик интерфейса часто работает с дизайнером.
Back-end (a.k.a. серверная сторона ): «front-end» извлекает из цифровой системы ресурсов, размещенных на сервере. Внутренний разработчик управляет этими за кадром ресурсами, кодирует данные в базе данных и оптимизирует доставку этих данных. Они используют языки, такие как PHP, Ruby, Python, Java или .Net.
Аналогичным образом, разработчик full-stack — это тот, кто может работать как с интерфейсом, так и с внутренним интерфейсом. Иногда они являются умным вариантом для стартапов, которые не могут позволить себе больше, чем один найм, но в идеале у вас будет целая команда разработчиков с различными специализациями.
Что нужно искать при найме веб-разработчика …
- Обязательно убедитесь, что они свободно владеют необходимыми языками. Если вы не можете сказать разницу, сообщите им, что вы хотели бы сделать с вашим сайтом, и послушайте их рекомендации.
- Хотя это и не требуется, разработчик может быть вовлечен в процесс проектирования. Например, разработчик может превентивно рассказать разработчику, если их выбор возможен, и сэкономить время на пересмотры в долгосрочной перспективе. Вы можете посмотреть, насколько хорошо ваш разработчик работает с командой, поскольку некоторые предпочитают работать автономно.
- Просмотрите свои предыдущие сайты с помощью объектива функциональности. Все работает так, как должно? Появляются все флаги? Вы можете не знать достаточно о развитии, чтобы понять, как это работает, но вы, конечно, знаете, каково это быть нормальным человеком, использующим сайт.
Пользовательский интерфейс (UI)
—
Теперь, когда мы объяснили веб-дизайн и разработку, мы можем обсудить более специализированные поля, начиная с дизайна пользовательского интерфейса. Пользовательские интерфейсы — это то, что каждый использует, не задумываясь, — вам не нужно знать историю значка гамбургера, чтобы знать, что кнопка с тремя строками — ваше меню.


- Портфель дизайнера пользовательского интерфейса должен рассказать вам все, что вам нужно знать. Протестируйте предыдущие сайты вашего кандидата и посмотрите, насколько это просто. Можете ли вы найти все, что вам нужно? Использовал сайт / приложение разочарование или легко?
- Больше, чем другие категории, ищите прошлую работу в конкретном типе проекта, который вы нанимаете. Самый лучший в мире разработчик интерфейса веб-сайта может быть ужасен в создании интерфейса для игрового приложения. Наймите того, кто имеет правильный опыт.
Пользовательский опыт (UX)
—
Во многих отношениях UX похож на поле веб-дизайна с точки зрения пользователя. Как макет веб-страницы влияет на пользователя? Как пользовательский интерфейс влияет на пользователя? Когда вы переходите на продвинутые этапы, UX становится гораздо более стратегическим, как в «как мы создаем страницу, чтобы пользователь хотел зарегистрироваться?»

- Как и в случае с дизайнами пользовательского интерфейса, вы хотите «проверить диск» на предыдущих сайтах или приложениях у вашего кандидата. Легко ли они использовать? Вы наслаждаетесь опытом использования своего сайта?
- Если у вас нет бюджета, чтобы нанять отдельного дизайнера UX, попросите кандидатов в других областях об их опыте UX. Эти обязанности иногда могут обрабатываться как кроссовер от разных команд; менеджер по продуктам или маркетолог могут объяснить, что они хотят UX, а затем команда разработчиков обрабатывает визуальный дизайн и реализацию.
Как насчет сайтов с шаблонами?
—
Как насчет того, используете ли вы сайт шаблонов, например WordPress, Squarespace или Wix? Вам все еще нужна полная команда? Вам нужен кто-то еще?

—
К настоящему моменту вы должны быть в состоянии рассказать обо всем, что касается веб-дизайна и разработки, и вы знаете, что «UI vs UX» не так точна, как «UI + UX». Вопрос в том, какой из них вам следует уделять первоочередное внимание, если вы можете «Нанимать специалистов для всех?»
Нет универсального ответа для этого. Поскольку эти поля имеют дело с разными областями, все зависит от уникальных потребностей вашей компании. Учитывая ваши собственные цели и недостатки, вам может понадобиться один специалист больше, чем другие.
Чтобы помочь вам понять, какой из них вам больше всего нужен, вот краткий список проблем, которые каждое поле специализируется на решении. Найдите свои самые большие препятствия ниже и посмотрите на соответствующее поле для решения. Если у вас уже есть существующий сайт, заранее проверите некоторые пользовательские тесты, чтобы узнать, какие жалобы имеют фактические пользователи.
Веб-дизайн
- сайт не отзывчивый (что означает, что на мобильных устройствах сайт не выглядит хорошо)
- сайт выглядит устаревшим
- низкокачественная графика
- клиенты не отправляются на страницы, которые вы хотите, чтобы они
- время на странице слишком короткое
Веб-разработка
- ошибок (функции сайта не работают должным образом)
- безопасность в Интернете и предотвращение взлома
- слишком много ошибок 404
- слишком много неудачных поисков DNS
- сайт в оффлайне
- определенный контент не загружается
UI
- Плохая навигация
- Отсутствие вариантов настройки
- отсутствие вариантов социального обмена
- жалобы на «как это сделать» или «где я могу найти это»
УБ
- плохой коэффициент конверсии (много трафика, но мало конверсий)
- высокий показатель отказов (посетители уходят через несколько секунд)
- пользователи не заканчивают контент (видео или блоги)
- фрагментированные посещения, т. Е. Пользователь уходит после одной страницы и вместо того, чтобы оставаться и исследовать
Конечно, некоторые проблемы могут быть устранены различными методами, как мы объясняли на примере медленных нагрузок выше. Вот почему важно знать, какие аспекты вы хотите определить по приоритетам, так что любое решение, которое вы выбираете, наиболее соответствует вашим приоритетам.