Андрей Астракт

Дизайнер мобильных приложений. Фрилансер. Работал в компании mailru — Одноклассники.

Пишу об интерфейсах в телеграм канал.
Мой сайт. Мои дизайн концепты на Dribbble и Behance.

Интерфейс публикаций для Вконтакте

Первая запись в блоге и в ней я хочу рассказать, как я работал над задачей для конкурса Вконтакте.

Задача конкурса

Придумайте новый удобный интерфейс публикации записи для iOS. Необходимо поддержать уже существующие функции и поэкспериментировать со следующими форматами:

  1. Публикация текста на цветном фоне (в качестве фонов можно использовать, как простейшие цвета и градиенты, так и более сложные текстуры);
  2. Интерфейс рекомендаций записей на основе действий человека (если прибыл в новое место, предложить сделать чекин; если сделал много новых фотографий, предложить опубликовать запись на стене или историю и тому подобное);
  3. Генерация записей-событий по шаблону (нашёл работу, завёл собаку, посадил дерево, женился и так далее);
  4. Общий интерфейс для создания историй и публикаций записей.

Как я работал

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

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

Прежде чем начать

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

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

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


Google Plus — приложение гугл тоже держит активной строкой ввод новой записи во внимании пользователя и так же отображает дополнительное действие.

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

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

Рекомендации постов

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

Описал несколько примеров таких генерируемых постов.

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

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

Отметившись в месте, друзья получат уведомление о том, что их друг тоже приехал на встречу.

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

Во время прослушивания музыки можно попробовать выводить пользователю сообщение приложить аудио трек к записи.

Текст на фоне

Короткие записи можно написать на фоне. Такой тип поста наверняка привлечёт внимание друзей.

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

Интерфейс новой записи

Обновлённый дизайн экрана новой записи. Ниже подробное описание.

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

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

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

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

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

Меню добавления к записи
Я изменил меню добавлений материалов к записи. В новом меню, пользователь может выбрать стикер или эмоджи для записи, событие из его жизни. Это придаст настроение к записи.

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

Дополнения

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

Опрос
При создании опросов добавить к вариантам ответов прикрепление изображений в дополнение к текстовому описанию. Это могло бы расширить возможности использования функции — опросы.

Репост
При репосте и публикации ссылки из браузера, для решения проблемы «пустых репостов». Пустые репосты — когда пользователи просто добавляют записи к себе на страницу без комментариев. Для решения этой проблемы, можно попробовать предлагать пользователю быстрые ответы при репосте.

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

Дополнительно эта кнопка даёт возможность включить режим «свободные руки». Свободные руки — режим в котором пользователю не нужно держать кнопку для записи видео. Для включения пользователю нужно просто свайпнуть в её сторону.

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

В завершении

Презентация проекта на Behance

27 сентября   вконтакте   концепт