От конструкции платформы и размещения элементов зависит комфорт пользователя. Мы расскажем, что делать, чтобы твой мобильный сайт или приложение было удобным.
Touch-friendy design
Можем поспорить, в основном ты пользуешься смартфоном одной рукой и одним большим пальцем. Как и 75% юзеров. Этот факт нужно учитывать при разработке сайтов и приложений. На ПК, ноутбуках и даже планшетах мы можем примерно с одинаковым удобством достать до всех элементов приложения/сайта. Мы управляем курсором мышm. или тач-падом, а планшет держим на коленях, подставке, на руке и используем всю руку для взаимодействия.
Смартфон - как наша ладонь с дисплеем, и при взаимодействии с ним одним пальцем некоторые элементы в верхних/нижних углах экрана трудно достать физически.
Основной контент и действия - в центре экрана
Представь “Черный квадрат” Малевича на стене музея.
Куда ты будешь смотреть, если он будет перед глазами? Скорее всего, в центр. Так устроено наше восприятие, если мы видим плоскость с очерченными границами, наше внимание направляется в центр.
Размещай основной контент и элементы для взаимодействия в центре экрана. Второстепенные действия и табы - вдоль верхних границ. Функции третьей категории - прячь в меню. Если хочешь примеры на практике, регистрируйс на вебинар «Дизайн 3-х сайтов за один вечер». Вместе задизайним три удобных, функциональных ресурса.
Ресерч, анализ пользователя, иерархия
Открой прямо сейчас приложение YouTube.
В центре экрана самое главное - видео. С первого экрана приложения - большие превью из предложки. На верхней границе - поиск и опция загрузки. На нижней - меню с навигатором, библиотекой и подписками.
- Основная потребность пользователя четко обозначена - просмотр видео. Превью крупные и воспроизводятся автоматически, для того чтобы было понятнее содержание.
- Рекомендации на главном экране формируются из чаще просматриваемых каналов, подписок и уже просмотренных видео.
- Второстепенные действия: поиск видео, просмотр сохраненных, подписок - выведены в отдельное меню.
Ответь на 2 вопроса:
- Что нужно пользователю.
- В какой форме это представить, чтобы максимально удовлетворить потребность.
Действовать можно, опираясь на существующие паттерны. Улучшать уже созданные приложения. Так, например, появилась IKEA PLACE. Создатели усовершенствовали привычное мебельное приложение, добавив элемент дополненной реальности. Фотографии мебели заменены реалистичными 3D-моделями, которые проецируются в комнату юзера на экране смартфона. Здесь мы подробно описываем технологию.
С IKEA PLACE пользователю не нужно замерять габариты и сопоставлять их с параметрами комнаты, прикидывать сочетаемость цветов и фактур с интерьером. Стол или кресло уже в твоей комнате, пусть даже виртуально, на экране смартфона.
Почти любой интерфейс можно улучшить
При анализе потребностей и поиске решений для пользователя важно предусмотреть как можно больше положительных решений. Например, YouTube мог бы просто хранить и воспроизводить видео с возможностью загружать их. Но сервис подбирает потенциально интересные ролики, учитывая твою активность, дает возможность выходить в прямой эфир и сохранять стримы, зарабатывать на рекламе, создавать плейлисты и много чего еще.
Хочешь научиться делать удобные User-Friendly приложения и сайты? Регистрируйся на онлайн-коучинг «Веб-дизайнер: счастливый билет в Таиланд». Мы научим тебя работать с пакетом Adobe, ты освоишь правила композиции, типографики, цветовых сочетаний. Сделаешь сильный проект для портфолио.