Я хотел посмотреть, как далеко я могу зайти в своем творчестве. Поэтому я переделал Instagram.

Фотография, на которой я пытаюсь осмыслить все данные моего исследования с помощью стикеров и моей рубашки Gator.

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

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

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

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

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

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

Мои цели по редизайну:

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

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

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

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

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

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

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

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

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

Мои исследования пользователей и данные

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

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

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

Демография целевой аудитории

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

Я чувствовал, что это была справедливая репрезентативная выборка текущей пользовательской базы Instagram с тех пор, как 90% of Instagram users are younger than 35, Кроме того, 55% of all 18–29 years old in US are Instagram users.

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

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

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

всего я собрал 64 adjectives.
В топ-3 прилагательных вошли: Creative, Fun, and Simple

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

1. это на основе изображения
2. легко и просто использовать
3. это помогает им оставаться на связи

Персонажи типичного пользователя Instagram

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

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

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

Опыт №1: домашняя страница

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

Проблема №1: перегрузка контента (Instastories vs Feed)

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

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

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

В качестве решения я решил интегрировать истории непосредственно в ленту по нескольким причинам:

• Лента и история теперь будут работать вместе, чтобы обеспечить более сплоченный опыт для пользователя.
• Интеграция историй в новостную ленту также не позволяет ей быть «rooftop deck» как что Julie Zhuo (вице-президент по дизайну продукта в Facebook). В текущем дизайне Instagram об Instastories легко забыть, как только пользователь начинает прокручивать ленту. С глаз долой, из сердца вон.

• Внедрив истории в ленту, он теперь будет работать по графику подкрепления с переменным соотношением. Это most powerful type of operant conditioning that generates the highest response для любого целевого поведения — в данном случае вовлечения в инстастори.

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

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

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

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

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

Метод (n=40)

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

Для считывания:

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

Для верхней навигации:

3. Как вы попадаете на экран, чтобы опубликовать свою историю? Ответ: верхний левый значок камеры.

4. Как вы попадаете в папку входящих сообщений? Ответ: Верхний правый значок «стрелка»

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

Here’s all the data I collected.

Основываясь на моих результатах, общее знание Instagram не так уж и велико:

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

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

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

Дополнительные интересные факты и статистика:

• Только 3 из 40 опрошенных ответили правильно на все четыре вопроса.
• По шкале от 1 до 5 того, насколько они знакомы с навигацией по Instagram, 75% людей оценили себя на 4 или выше. Только 30% из этих людей правильно ответили хотя бы на ОДИН вопрос.
• Значительно больше 92.3% людей, ответивших неправильно, полагали или предположили, что свайп влево приведет их на страницу изучения/поиска. (Что имеет смысл, поскольку значок поиска/исследования расположен рядом со значком дома в нижней части навигации)

Анализ результатов показывает, что Instagram users have not established an association between the top navigation and the swiping features.

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

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

Листайте, чтобы увидеть новые и старые сообщения

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

То, что я хотел знать, было зачем люди wanted их подача должна быть хронологической? Почему они были так расстроены этим изменением? Копнув глубже, я обнаружил, что пользователи коррелируют хронологию с тщательностью. В текущем алгоритме Instagram популярные посты (считающиеся постами, которые вы хотели увидеть) располагаются в верхней части ленты. Это расстраивает пользователей Instagram, потому что они часто пропускали пост, который хотели бы увидеть, но не видели. (aka FOMO — fear of missing out).

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

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

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

People hold their phones in many ways. Независимо от того, как они его держат, верхний левый угол экрана всегда будет самым неудобным и болезненным местом для размещения навигации для пользователей. Потому что реаааааааааааааааак *роняет телефон на лицо*… или что-то в этом роде.

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

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

Опыт № 2: режим «Исследуй и открывай»

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

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

Опыт № 3: Скольжение в DM и Stories

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

Чтобы исправить вторую причину, я реализовал новую функцию под названием «Истории из ваших избранных», чтобы придать больше ценности и цели использованию Instastories.

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

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

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

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

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

Аааа… последний отрезок. Для уведомлений и страницы профиля я хотел дать пользовательскому интерфейсу больше свободы действий, добавив больше пустого пространства и сгруппировав/вложив похожие элементы.

Кроме того, теперь вы можете ставить лайки и отвечать на комментарии прямо в уведомлениях, просто проведение имя пользователя этого человека (нажав на него, вы перейдете к его профилю). Как только вы сохраните имя пользователя, появится окно комментария с автоматическим @username. Затем все, что вам нужно сделать, это ввести свой ответ и нажать «Опубликовать».

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

«Подписанные» уведомления

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

Профиль

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

Размышляя о работе, которую я сделал здесь

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

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

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

И вишенка в том, что это не заканчивается. Процесс обучения непрерывный.

«Дизайн не становится проще. Ты просто выздоравливай».

И это обертка. Большое спасибо за чтение!

You can check out my full interactive prototype here

Редактировать (3 / 10 / 17)
Я дал интервью freeCodeCamp (через Youtube) о моем переходе от медицины к дизайну, а также о том, что вдохновило меня на этот редизайн. Вы можете посмотреть это here.