Рубрика «интерфейсы» - 81

Ник Бабич разработчик, UX/UI специалист написал заметку в блоге UX Planet про UX-дизайн кнопки: советы по созданию, типы и состояния. Наша команда выполнила перевод данной статьи

image

Кнопки – это самый обычный, «повседневный» элемент дизайна взаимодействия. Именно поэтому на них нужно обратить особое внимание, ведь кнопки являются важнейшим элементом, обеспечивающим беспрепятственное взаимодействие в сети и приложениях. Мы обсудим типы и состояния кнопок — эту информацию нужно знать, чтобы создавать эффективные кнопки и совершенствовать опыт пользователя.

Советы по созданию кнопок

Кнопки должны выглядеть как кнопки

Давайте на минуту представим, как с помощью дизайна донести возможность выбора. Как пользователь поймет, что данный элемент и есть кнопка? Он ориентируется на цвет и форму.

image
Читать полностью »

Я давно интересуюсь темой алгоритмического дизайна и собираю материалы и примеры на тему, но тема всплывала от случая к случаю. За 4 года скопилась пара десятков примеров и полдюжины статей в привязке к продуктовому дизайну, но до этой весны всё это были скорее отдельные всплески безо всякой системы.

Алгоритмический дизайн

Читать полностью »

Статья была опубликована на smashingmagazine и была переведена специально для Хабрахабра.

image

Испытанный прием веб-дизайна: нужно свести к минимуму количество возможных вариантов выбора для пользователя; создать интуитивно понятные средства навигации; помочь людям получить то, что они ищут как можно быстрее.

Звучит довольно просто, не так ли? А теперь давайте рассмотрим это вот с какой точки зрения… Число интернет-пользователей, страдающих деменцией во всем мире постоянно растет. У них могут быть разные уровни компьютерной грамотности, они могут испытывать следующие проблемы: потеря памяти, спутанность сознания, проблемы, связанные со зрением и восприятием, трудности с упорядочиванием и обработкой информации, речевые проблемы, неспособность решать некоторые проблемы и задачи.

Когда мы думали, что комплексное проектирование уже плотно закрепилось на своих позициях, возникло совершенно новое измерение.
Читать полностью »

Статья была опубликована на LayerVault и была переведенна специально для Хабрахабр.

Идея упрощения

image

Для начала стоит отметить, что, во-первых, вы наверняка уже сталкивались с идеей упрощения дизайна, так как именно из неё вытекают базовые принципы плоского дизайна. И, во-вторых, приведённые ниже советы не смогут значительно помочь, если у вас некачественный продукт.

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

Читать полностью »

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

Сегодня мы представляем вашему вниманию адаптированный перевод исследования Анны Иман (Anna Yeaman), соосновательницы и директора американского агентства, которое было изначально опубликовано на страницах авторитетного ресурса SmashingMagazine.

image

В прошлом году я прочитала пост Яна Константина (Jan Constantin) «Тенденции и современные методы типографского дизайна» и тут же решила провести похожую работу, но применительно к почтовой рассылке. В то время я изучала адаптивную веб-типографику. Я выделила группу сайтов, которые мне понравились, и попыталась разобраться, в чем секрет их типографики, чтобы потом применить новые знания к разработке дизайна email-рассылки.

После того, как я познакомилась с работой Константина, мне захотелось понять, как другие дизайнеры email-рассылок использовали адаптивную типографику. В итоге я собрала 50 примеров почтовой рассылки из разных сфер, в которых, на мой взгляд, подобрана качественная типографика, и решила проверить, есть ли у них что-то общее. Исходные данные и результаты этой работы вы можете посмотреть в Google-таблице.Читать полностью »

Я сделал мой сайт диалоговым. Здесь рассказано, чему я научился.

image

Несколько недель назад я начал эксперимент на своём сайте. Я сделал его диалоговым. Обратная связь, отзывы и освещение в сети были абсолютно удивительными. Я получил более 300 записок по почте за первые 24 часа.

Спасибо всем, кто нашёл время пообщаться со мной на сайте. Это было прекрасно!

Некоторые из вас просили меня поделиться своим представлением о ситуации. Поскольку всё это дело началось как общение, я хотел бы воспроизвести его в том же виде.

Так что — вперёд.
Читать полностью »

Эволюция маркетинга: от маленького интернет-магазина до гипермаркета - 1

В России непринято рассказывать о закрытых проектах. Однако, закрытие проекта, вовсе не означает, что все что с ним происходило было неправильно.

Это история о том как создавался сайт интернет-магазина Сотмаркет и менялась работа с каналами привлечения трафика по мере роста компании.

Примечание автора. Ошибка выживших

«Живые трупы», — вот так описал историк Кевин Вильсон пилотов Второй мировой.

Шансы уцелеть при бомбардировке были такие же, как при игре в русскую рулетку с несколькими патронами. Один раз может и повезет, но если продолжать играть, никакой удачи не хватит.

Эволюция маркетинга: от маленького интернет-магазина до гипермаркета - 2

Действительно, многие бомбардировщики не возвращались на базу. А на тех, что уцелели, оставалось множество пробоин на крыльях и хвосте. Любые улучшения защиты корпуса самолета могли спасти не одну сотню жизней пилотов.

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

Обнаруживший ошибку математик Абрахам Вальд позже, на базе статистических методов, не только выделил наиболее уязвимые места воздушных кораблей, но и рассчитал возможную длинну полета с определенными типами повреждений корпуса.

Систематическая ошибка выживших — это склонность фокусироваться на одной группе данных («выживших»), игнорируя или не имея данных по другой («погибших»).

Читать полностью »

image

В фильме Спайка Джонса 2013 года «Она» усатый Хоакин Феникс, переживший неудачную любовь, со всей страстью влюбляется в своего личного робота-помощника по имени Саманта.

Сюжетная линия могла бы показаться немного смешной и нелепой большинству из нас, но рост количества чат-ботов показывает, насколько сильно люди желают разговаривать с машиной как с человеком.

Предназначение Саманты, как и любой технологии (особенно ботов), состоит в том, чтобы сделать жизнь пользователя легче. Мы желаем не нажимать кнопки и клавиши на сайте, а просто проговаривать вопросы и сразу же получать ответы. И поскольку научная фантастика — всё же фантастика, она, действительно, позволяет хотя бы очень приблизительно представить, как мир должен работать.

Быстрее — всегда лучше, и разговор, по мере совершенствования структуры общения, обработки естественного языка и ботов с искусственным интеллектом, всё больше вытесняет нажатие клавиш, становясь нашим предпочтительным методом нахождения информации.
Читать полностью »

Как создавать визуально эффективные призывы к действию - 1

Как сделать призыв к действию деликатным, но эффективным? Это статья раскрывает несколько простых секретов. Мы постарались воспользоваться ими при создании нового дизайна для нашего сайта «Я люблю ИП». И заодно решили её перевести. Надеемся, эта статья также будет вам полезна.

Создавать эффективные посадочные страницы — это непростая задача. Это постоянная борьба между тем, что работает и что нет. Это непрерывный процесс тестирования, измерений и улучшений.

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

Хорошая новость состоит в том, что поведение людей достаточно предсказуемо, и мы можем это использовать.
Читать полностью »

Ценность многошрифтового дизайна - 1

Я заметила, что одна из особенностей моего дизайнерского стиля — это готовность использовать, на первый взгляд, слишком большое количество разных гарнитур шрифтов. Я видела неисчислимое множество статей о сочетаниях и системах использования шрифтов, и почти везде рекомендуется использовать меньше шрифтов в любом дизайне. Я и к своей работе получала такие комментарии – дескать, работы приятные, несмотря на количество используемых шрифтов.

«Очень нравится сайт, потому что он не боится нарушать одно из первых правил шрифта – не использовать слишком много разных гарнитур. Используется четыре шрифта, два из семейства sans-serif и два из serif — Galaxie Copernicus, Interstate, Harriet и Nimbus Sans. Основной момент такого дизайна – последовательность, и сайт Бетани Хек последовательно использует каждый из шрифтов для своей цели.»
— Джеремия Шоаф, Typewolf

Расцениваю это, как вызов. Спасибо, Джеремия!

Хочу поспорить и рассказать о ценности эклектичных систем, и о том, как создать структуру проекта, чтобы эффективно использовать совместно несколько шрифтов.

Ценность многошрифтового дизайна - 2

Так почему же у нас есть правила насчёт количества используемых гарнитур?
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js