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

Instagram я выбрала потому, что стала преданным его последователем еще в 2011 году, то есть через год после его запуска.

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

Можно сказать, что я Insta-ветеран.



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

Мои личные цели при осуществлении всего этого

Мои цели в том, что касается редизайна:

• обеспечить более простой и гладкий пользовательский опыт как при поиске контента, так и при общении
• создать более представительный и интуитивно понятный пользовательский интерфейс
• создать дизайн, ориентированный на пользователя (HCD).

Мои цели в том, что касается личного развития:

• научиться проводить исследование аудитории и анализировать результаты, создавать блок-схемы и вайрфреймы, работать со Sketch, создавать анимацию с помощью Principle и прототипы в Invision
• завершить мой первый дизайн-проект от начала до конца, придерживаясь своих принципов дизайна.

Роли, которые мне пришлось выполнять в процессе создания этого редизайна:

• Исследователь аудитории
• Аналитик
• UI / UX дизайнер
• Дизайнер продукта

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

Понимание компании Instagram

Instagram — это визуально-повествовательное приложение, которое предоставляет пользователям платформу для хранения и обмена красивыми и яркими моментами из жизни. С момента выхода приложения в 2010 году база пользователей Instagram выросла до сотен миллионов, позволяя людям со всего мира присоединяться к социальной сети и делиться моментами своей жизни.

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

Мое исследование аудитории и результаты

Прежде чем приступить к проекту редизайна, я опросила 40 пользователей Instagram, чтобы получить более детальный портрет тех, для кого буду разрабатывать:

• Как выглядит типичный пользователь Instagram?
• Каковы его причины пользоваться Instagram?
• Что заставляет его возвращаться вновь и вновь?

Я проводила эти интервью лично, по телефону или с помощью видеозвонков.





Демографический портрет целевой аудитории

Среди 40 инстаграммеров, с которыми я беседовала, было 10 мужчин и 30 женщин. Возраст пользователей мужского пола колебался от 22 до 27 лет, а у женщин — от 19 до 25 лет. 65% респондентов в настоящее время являются студентами колледжей или выпускниками средних школ с планами на получение высшего образования.

Я посчитала, что такая выборка из текущей базы Instagram-пользователей будет репрезентативной, так как 90% пользователей Instagram моложе 35 лет. Кроме того, в США 55% людей из возрастной группы 18-29летних являются пользователями Instagram.

Что еще более интересно, 67,5% опрошенных пользователей отнесли Instagram к тройке приложений, которыми пользуются больше всего. Кроме того, 72,5% опрошенных людей пользуются Instagram ежедневно.

Веселье продолжается

Я попросила 40 инстаграммеров, с которыми работала, описать Instagram тремя прилагательными. Что вы думаете об Instagram? Что вы чувствуете, пользуясь им?

Всего я получила 64 прилагательных.
Самыми популярными из них оказались следующие: Креативный, Интересный, Простой.

Также я спросила, что им нравится в Instagram. Вот три самых распространенных ответа:

• Там преобладают изображения
• Он понятный и простой в использовании
• Он помогает поддерживать связь с другими людьми

Образ типичного пользователя Instagram

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

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

Теперь, когда вы составили представление, для кого я разрабатываю, мы можем перейти к самому захватывающему!

Опыт № 1: Главная страница

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

Проблема №1: Слишком много контента (Инста-истории vs Лента новостей)

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

Обе функции очень насыщены контентом; может даже возникнуть чувство, что всей этой прокрутке конца не будет. Согласно исследованиям о парадоксе выбора, обилие вариантов, как ни странно, может привести к менее позитивному опыту, вызывая усталость, чувство вины или страх пропустить что-то важное (FOMO). Это особенно актуально, учитывая, что почти половина опрошенных мною инстаграммеров, по их собственным словам, просматривают Instagram сразу после пробуждения и / или вечером перед сном.

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

Чтобы устранить проблему, я решила интегрировать инста-истории непосредственно в ленту новостей по нескольким причинам:

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

Интеграция историй в новостную ленту также предотвращает так называемый«эффект крыши», о котором упоминала Джули Чжо (вице-президент по дизайну продуктов в Facebook). В том виде, в котором дизайн Instagram реализован сейчас, Instastories легко забываются, как только пользователь начинает прокручивать ленту новостей. С глаз долой, из сердца вон.


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



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

Проблема №2: Отсутствие связки между верхней навигацией и свайпом

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

Проще говоря, знают ли пользователи Instagram, что прокрутка влево и вправо соответствует функциям, вынесенным на верхнюю панель навигации?

Чтобы ответить на этот вопрос, я провела относительно простой эксперимент во время интервью.

Метод (n = 40)

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

Вопросы о свайпе:

• Куда вы попадете, если, находясь на домашней странице, проведете по экрану слева направо? Ответ: Камера, новый пост, история.
• Куда вы попадете, если, находясь на домашней странице, проведете по экрану справа налево? Ответ: Входящие сообщения

Вопросы о верхней панели навигации:

• Как перейти на экран создания новой истории? Ответ: Значок камеры в верхнем левом углу
• Как перейти в папку входящих сообщений? Ответ: Значок стрелки в верхнем правом углу

Примечание: Если пользователь отвечал на эту часть вопроса «провести по экрану влево / вправо», я предлагала дать альтернативный ответ (Знаете ли вы другой способ добраться до ______?)

Тут находятся все данные, которые я собрала.

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

• Только 20% респондентов ответили правильно на все вопросы.
• 30% дали хотя бы один правильный ответ, 50% не дали ни одного.
• 50% людей знают, что, если провести по экрану слева направо, откроется камера.
• 20% людей знают, что, если провести по экрану справа налево, откроется список входящих сообщений.

Верхняя навигация:

• 72,5% людей знают, что попасть в папку входящих сообщений можно нажатием на значок со стрелкой справа вверху.
• 55% людей знают, что опубликовать историю можно нажатием на значок с камерой слева вверху.

Еще немного занимательных фактов и статистики:

• Только 3 из 40 опрошенных правильно ответили на все четыре вопроса.
• Когда я попросила оценить свои знания навигации Instagram по шкале от 1 до 5, 75% людей поставили себе 4 или выше. Только 30% из этих людей ответили правильно хотя бы на один из вопросов о свайпе.
• 92,3% людей, которые ответили неверно, считали или предполагали, что прокрутка влево приведет их на страницу поиска. (И в этом есть логика, поскольку значок поиска расположен рядом со значком «домой» в нижнем навигационном блоке).

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

«Сам не знаю. Я просто тыкаю по кнопкам, пока не найду то, что нужно, а потом внезапно вижу свое лицо...» – случайный пользователь Instagram на вопрос о том, как он попадает в папку входящих сообщений.

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


Прокрутка для просмотра новых и старых сообщений

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

Я хотела понять, почему люди хотят, чтобы их лента была хронологически упорядочена? Почему они так расстроились из-за этого изменения? Погружаясь в вопрос глубже, я обнаружила, что пользователи ассоциировали хронологию с основательностью. С текущим алгоритмом Instagram популярные посты (расценивающиеся как посты, которые вы хотели бы видеть) расположены в верхней части ленты. Это расстраивает Instagram-пользователей, потому что они часто пропускают действительно интересный для них контент (иначе говоря, они испытывают FOMO — страх пропустить что-то важное).

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



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

Проблема № 3: Верхний левый угол — вне досягаемости (с глаз долой, из сердца вон).

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

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


По моим данным, 100% опрошенных людей знают, как отправлять посты в свой канал (потому что делают это регулярно). Однако только 57,5% из тех же людей либо не знают, как опубликовать свою историю, либо просто не пользуются этой функцией вообще. Чтобы увеличить активность размещения историй, я решила объединить две функции публикации, потому что: 1) теперь она легко доступна и 2) можно скрестить пальцы и надеяться, что популярность новостной ленты перекинется и на истории.

Опыт №2: Режим поиска и обнаружения

Теперь у вас есть возможность как проводить поиск спонтанно, при помощи встроенного алгоритма Instagram, так и «прицельно» выискивать контент посредством вашей личной коллекции сохраненных хэштегов. Поэтому Сэм и Алекс могут просто подключить «#ecgtracing» или «#fitness», чтобы видеть, что нового появилось на интересующие их темы.

В моем случае я, вероятно, отслеживала бы «#coffeefliicks» и «#dametravelers», чтобы любоваться красивыми снимками кофе и различных мест. Вы можете кликать на каждый хэштег по очереди, чтобы открывать их по одному, а затем потянуть вниз, чтобы обновить страницу и увидеть все активные хэштеги разом. Также у вас есть возможность по клику добавлять новые хэштеги, удалять старые или выполнять поиск внутри своей коллекции (и да, они все выстроены в алфавитном порядке).

Опыт №3: Переходим в DM и истории

Только 42,5% опрошенных пользователей пользовались Instastories. Две из основных причин, по которым люди не пользовались Instastories, состояли в том, что 1) у них уже есть Snapchat и 2) им постоянно попадались истории людей, которые им не особо интересны.

Чтобы разобраться со второй причиной, я реализовала новую функцию под названием «Stories From Your Favs», чтобы люди могли пользоваться Instastories более осмысленно и целенаправленно.

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

Вы можете легко удалить или добавить людей в список «избранных», нажав на сердечко рядом с их ником. (Правда, мило?)



Для справки: Почему я решила переместить истории в DM? Во-первых, мне нужно было куда-то их пристроить, раз уж я убрала их из ленты новостей. Во-вторых, когда вы отправляете комментарий или фотографию в ответ на истории, они попадают прямо в папку входящих сообщений. Поэтому имеет смысл группировать Instastories и DM в один большой веселый пакет.

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

Опыт №4: Оповещения и профиль

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



Кроме того, теперь можно лайкать и комментировать посты непосредственно со страницы оповещений — достаточно нажать на имя пользователя и подержать (короткое нажатие перебросит вас на его профиль). Продолжительное нажатие активирует появление поля для комментирования, в котором уже будет введено @имяпользователя. Все, что вам остается, — набрать текст и нажать на кнопку «Отправить».

Мне показалось, что такая функция была бы очень полезна — ведь в Instagram иногда так легко потонуть в комментариях под постом. Как его там зовут? Где тот комментарий? О чем вообще шла речь?

Оповещения

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

Профиль

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

Анализируя проделанную работу

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

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

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

А самое-то классное: этому нет конца. Процесс обучения может продолжаться до бесконечности.

Дизайн не становится проще, это у вас начинает лучше получаться.

Вот и все. Спасибо за внимание! Ознакомиться с полным интерактивным прототипом вы можете здесь.