7 советов как улучшить интерфейс карточек в веб-дизайне

интерфейс карточек в веб-дизайне Статьи Юзабилити 

Если просмотреть наши публикации трендов веб-дизайна за несколько прошедших лет, то можно увидеть, что карточное оформление элементов на веб-страницах появилось достаточно давно. Это в первую очередь связано с развитием адаптивного дизайна и социальных медиа, для которых требовалось придумать простой и универсальный метод отображения данных. Подобные карточки представляют из себя краткую выжимку с определенной информацией и возможностью перейти к ее полному прочтению. Этот элемент пользовательского интерфейса может…

Эффективный дизайн текстовых полей в формах и приложениях (элемент text field)

дизайн текстовых полей Статьи Юзабилити 

Ранее в блоге уже была заметка про оформление текстовых полей, но там мы рассмотрели лишь парочку базовых вопросов, хотя на самом деле в этой теме имеется гораздо больше интересных нюансов. Сегодня постараемся наверстать упущенное и сделать более детальную и комплексную статью. По стилистике она будет похожа на публикацию об эффективном дизайне кнопок в интерфейсах. Оно и не удивительно, ведь оба материала являются переводами одного и…

Все про эффективный дизайн кнопок в интерфейсах

кнопки Мобильный дизайн Статьи Юзабилити 

Сегодняшний пост достаточно тесно переплетается с двумя другими статьями блога — заметкой про виды кнопок в интерфейсах, а также подборкой примеров дизайнов кнопок на сайтах с 2009 года и до наших дней. Он станет отличным дополнением для них и позволит рассмотреть вопрос немного с другого (более практичного) ракурса. Начинающим и опытным дизайнерам должно быть интересно. Для того чтобы правильно организовать взаимодействие пользователя с вашим сайтом/приложением,…

Оформление текстовых полей на страницах сайтов (оформление text field)

текстовые поля Статьи Юзабилити 

Текстовые поля на веб-страницах (text field) – это, наверное, один из наиболее часто используемых компонентов интерфейса. Они применяются для заполнения контактнs[ форм, ввода платежных реквизитов, создания учетной записи (онлайн регистрации), лидогенерации, формы логина и др., то есть решают задачу организации взаимодействия с посетителями сайтов. Цель данной статьи – выделить некоторые ключевые рекомендации, которые помогут вам правильно подойти к разработке дизайна текстовых полей. Мы рассматривает исключительно…

Функциональные и красивые футеры для сайта (40 лучших примеров)

красивые футеры для сайта Вдохновение Дизайны сайтов 

Раздел про красивые дизайны сайтов содержит не только подборки макетов по определенным стилям и тематикам, там также есть статьи, посвященные отдельным элементам веб-страниц, например, недавно мы постили оригинальные формы логина, а сегодня рассмотрим красивый footer для сайта. Похожая заметка у нас уже была ранее, но спустя много лет практически ни одно из тех дизайнерских решений не сохранилось: какие-то веб-проекты закрылись, а где-то разработчики просто сделали…

Основные виды кнопок пользовательского интерфейса на сайтах и в приложениях

кнопки пользовательского интерфейса Мобильный дизайн Статьи Юзабилити 

Кнопки – это один из наиболее известных интерактивных элементов пользовательского интерфейса. Они играют очень важную роль в организации взаимодействия с пользователем и формировании у него позитивного опыта. Продолжая серию постов, посвященных тематике UI/UX дизайна, в этой статье были собраны понятия и примеры, касающиеся наиболее часто используемых типов кнопок, что встречаются на веб-сайтах и в мобильных приложениях. Раньше мы публиковали заметку про историю изменения дизайна кнопок…

Создание эффективного Hero Image изображения для сайта (8 советов)

Изображения hero image Веб-дизайн Статьи 

Пользователю требуется всего 50 миллисекунд, чтобы составить мнение о любом сайте? У веб-разработчиков и дизайнеров реально очень мало времени, чтобы произвести хорошее впечатление на человека при посещении ресурса. Именно поэтому так важно правильное оформление главной страницы + шапки сайта, которую все видят в первую очередь. Многие веб-проекты в сети объединяет один общий способ привлечения внимания аудитории – использование ярких красочных дизайнов, в частности — размещение крупного фонового…

Красивые формы логина на сайте: HTML/PSD исходники, дизайны для вдохновения

Красивые формы логина PSD макеты Вдохновение Дизайны сайтов 

В продолжение статьи о создании идеальной формы авторизации на сайте мы решили продемонстрировать вам одни из лучших решений по данной теме. Значительная часть материалов из подборки имеет PSD/HTML исходники, поэтому вы сможете внедрить их в собственных проектах, предварительно подправив под свои задачи. Все ссылки находятся в картинках, а если их там нет, то это просто скриншоты дизайнов для вдохновения. Вообще формы логина и пароля встречаются в разных по…

Идеальная форма авторизации — как делать не нужно (ошибки и советы)

форма авторизации Статьи Юзабилити 

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

Как сделать подвал сайта (footer): варианты дизайна, зачем он нужен, советы

подвал сайта Веб-дизайн Статьи 

Разработчики часто упускают из виду, что footer для сайта (перевод с англ. футер/подвал) является одним из базовых его элементов. Он может дать более полную информацию о компании, а также выполняет разные полезные функции: облегчает навигацию, помогает сориентироваться посетителям веб-проекта и пригодится в некоторых коммерческих целях. Ранее в блоге мы рассматривали разработку шапки сайта а сегодня поговорим о подвале. Тут нужно грамотно подойти к выбору управляющих компонентов, которые…

Улучшаем регистрационную форму на сайте (4 полезных совета)

Регистрационная онлайн форма Статьи 

В интернете процедура регистрации встречается нам также часто как и форма авторизации на сайтах. Вам приходится регится выполнять: во всевозможных веб-сервисах, помогающих искать нужную информацию, бесплатных раздачах материалов, интернет-магазинах, соц.сетях и т.п. В такие моменты чувство радости от интересной находки мгновенно улетучивается из-за необходимости заполнять бесконечные поля ввода (к тому же иногда совершенно лишние). Как правило, все это бывает неудобно, занимает много времени и выглядит чересчур навязчиво. Плюс…

UI Patterns — полезный архив паттернов интерфейсов

UI Patterns Дизайны сайтов Полезные сайты Юзабилити 

В процессе проектирования интерфейса приложений или сайтов полезно учитывать имеющийся опыт других специалистов и лучшие варианты решения типовых задач. Это позволяет избежать ненужных ошибок и получить хорошие отзывы от ваших пользователей. В разделе про UI/UX дизайн мы публиковали некоторые заметки по данной теме: например, был обзор 20-ти ресурсов с дизайнами мобильных интерфейсов, а также разные статьи про гамбургер меню, историю развития кнопок на сайтах и…

Примеры дизайнов кнопок на сайтах и в интерфейсах (с 2009 и до наших дней)

дизайнов кнопок на сайтах Вдохновение Веб-дизайн Дизайны сайтов 

Разные виды кнопок для сайтов и приложений используются повсеместно: при входе в профили социальных сетей, совершении покупок в интернете, отправке сообщений через форму обратной связи и т.д. Это один из самых важных элементов UI/UX дизайна и онлайн проектов в навигации и разного рода призывах к действию (Call To Action). Поэтому не удивительно, что ему уделяется достаточно много внимания. Сегодня публикуем перевод одной интересной статьи от Wojciech…