Пустые экраны и ошибки

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

Тем не менее при проектировании часто забываем о них, в итоге разработчик дописывает одинокую фразу “no internet connection”, что выглядит довольно грустно. И раз уж эти экраны есть везде, почему бы не создать шаблоны с иллюстрациями и текстом. Это экономит время при разработке, а пользователям видеть такие экраны приятнее, чем несколько аскетичных слов на сером фоне.

В этой статье мы рассмотрим два типа экранов — экраны при отсутствии контента и экраны с ошибками.

 

 

Изображение с сайта dribbble.com

 

 

Пустые экраны

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

 

Обучение

Первостепенная задача при проектировании пустых экранов — объяснить пользователю, почему на экране нет информации и что он мог бы сделать, будь на этом экране контент. Здесь стоит придерживаться кратких и четких формулировок.

 

 

Призыв к действию

Что ж, мы объяснили пользователю, почему экран приложения пустой и что он из себя представляет. Не будем останавливаться на этом, следующий шаг — дать возможность совершить действие и получить доступ к контенту. Используйте мотивирующие фразы, чтобы убедить пользователя. Расскажите о пользе, которую он получит и дайте четкие инструкции. Можно добавить кнопку CTA или стрелку, которая ведет к ней.

 

 

Хорошее впечатление

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

 

 

 

 

Ошибки приложения

Возникают всегда и везде, никто от них не застрахован. Тем больше поводов продумать сообщения об ошибках и предотвратить разочарование пользователя.

 

 

Изображение с сайта dribbble.com

 

 

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

Как альтернатива, можно рассказать последние новости приложения или даже предложить поиграть (подробнее в статье “Empty states, what about No Network states”).

 

 

 

В заключение

Не стоит воспринимать пустые экраны и экраны ошибок как проклятье. Это отличная возможность превратить негативный опыт пользователя в позитивный. Используйте положительный тон, визуально простые и интуитивные сообщения.

У нас есть только один шанс, чтобы оставить первое впечатление, пусть оно будет приятным ;)

 

Материалы:

The Role Of Empty States In User Onboarding

Empty states

Errors

Why empte states deserve more design time