Есть много способов улучшить шаги входа - вот один из них.

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

Фон

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

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

Попробуем выглянуть из коробки. Я не предлагаю изобретать велосипед здесь. Некоторые крупные компании уже используют эту концепцию - я просто разбиваю ее для вас.

Проблема

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

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

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

Итак, зачем разделять доступ между страницами, если вы можете сделать его динамическим на одной странице?

Навигация - это время, а время - деньги. Перечислим некоторые проблемы:

  1. Пользователи, которые забыли свои пароли, должны перейти на другую страницу, вставить свои адреса электронной почты, чтобы получить ссылку для восстановления;
  2. Несколько адресов электронной почты и не знаете правильный? Бедный пользователь. Несколько приложений отображают только сообщение типа «адрес электронной почты или пароль не совпадают»! Как жаль, Твиттер, исправь это.

Возможные решения

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

Для контекста: Salametrics - это приложение для измерения показателей, в котором вы можете измерять случайные вещи. Взглянем на страницу входа.

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

Это одноэкранная форма, которая позволяет пользователям создавать свою учетную запись или получать к ней доступ без каких-либо недостатков. Forget the password? Во-первых, мы проверим, совпадает ли ваш адрес электронной почты с нашими аккаунтами, и, если это так, мы используем ваши данные для отправки ссылки для подтверждения!

Кодирование с помощью Flutter

Теперь, когда я показал вам проблему и возможное решение, этого достаточно? Конечно нет. Вот почему я создал небольшое приложение с использованием Flutter Framework. Посмотрите гифку ниже.

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

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

Продолжай учиться

Хотите узнать о дизайне еще больше? Взгляните на мою новую статью и наслаждайтесь!



Последние мысли

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

Не путайте эти советы с законами - это не так. Это просто некоторые методы, которые сработали для меня в программировании - и их используют эти крупные компании.

Мы тоже должны начать использовать их.