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

В начале этого года я подал заявку и прошел собеседование для прохождения стажировки в Apple Music (шанс всей жизни). И мою кандидатуру отклонили очень любезным письмом, в котором говорилось, что, хотя им и нравится моя работа, они хотели бы видеть больше роста и обучения.

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

… но как только я осознал это, я вдохновился на трехмесячное путешествие к священному Граалю — приложению iOS, которое заслуживает Apple Music.

Для меня это была возможность по-настоящему покопаться в исследованиях и UX дизайне, предлогом проводить много времени в Sketch и Principle, причиной надоесть всем вокруг своей тетрадью полной грубо нарисованных макетов 😂 …

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

Вступление

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

Однако, приложение Apple Music всегда разочаровывало меня. То, что должно было быть сервисом, который приучит всех слушать потоковое аудио, проходит через период полового созревания — это значит, что, хотя сервис постоянно развивается, он выглядит непривлекательно по сравнению с уже взрослыми игроками на рынке (aka Spotify).

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

Редизайн Apple Music, фото номер - 1
Спасибо, Lana Del Rey и Wayback Machine
С iOS10, Apple выпустила столь необходимое обновление, основанное на принципах Упрощения интерфейса (Complexion Reduction).
Редизайн Apple Music, фото номер - 2
Посмотрите на эту удивительную обложку Pentatonix от моего дорого друга и наставника Энни Столл
Хотя в этом новом интерфейсе было намного легче ориентироваться, я все же чувствовал, что еще есть куда его улучшать. Несмотря на упрощенную цветовую палитру и увеличенную типографику, интерфейс ощущался громоздким и даже клаустрофобным — очень далеким от обычной элегантности Apple. Я подошел к моему редизайну в три этапа, все время проводя исследования:

  • Суть интерфейса
  • Фирменный стиль
  • Визуальный интерфейс

1. Суть интерфейса: Поиск музыки

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

Редизайн Apple Music, фото номер - 3
Определите, где вы. Я в сероватой области
Накопители:

  • Имеют большую библиотеку, к которой они время от времени добавляют новые песни
  • Более избирательны в отношении того, что они слушают

Склонные к переменам:

  • Полагаются на плейлисты/рекомендованный контент
  • Возможно уже пользуются Spotify

Apple Music находится на стороне накопителей этого спектра. Откройте плейлист Apple Music, и вы, вероятно, найдете эту фразу в описании:

Если вы слушаете что-то, что вам нравится, добавьте это в свою библиотеку.

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

Если Apple Music хочет расширить свою деятельность до склонных к переменам стороны спектра, они должны увлечь их за собой. Это означает, создание поиска музыки, который будет сосредоточена на исполнителях и альбомах вместо плейлистов. Откройте… My Sampler

My Sampler

My Sampler — это новый опыт, сделанный для преодоления разрыва между накопителями и людьми, склонными к переменам, заменив существующий «New Music Mix». Он возник из понимания того, что пользователи, которые разборчивы в том, что добавляют в свою библиотеку, также будут с большей неохотой слушать весь плейлист с новой музыкой. Лучшим опытом будет предоставление отрывков или образцов, которые дают пользователю достаточно информации для решения, добавлять ли трек в свою библиотеку или еженедельный плейлист.

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

Tinder ios приложение
Музыка для поколения Tinder
Я решил использовать взаимодействие с помощью жестов, чтобы пользователи могли использовать Sampler, даже если они не смотрят на экран. Когда пользователь закончит прослушивать сэмплы, его выбор используется для создания нового музыкального микса (New Music Mix), который пользователь может прослушать.

Редизайн Apple Music, фото номер - 4

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

«Apple недооценивает силу геймефикации».

— UX дизайнер и пользователь Apple Music, у которого я брал интервью в Лос-Анджелесе

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

2. Фирменный стиль

Во время моей стажировки в Sony Music я узнал, что визуальное присутствие бренда в потоковом сервисе должно быть узнаваемым, но при этом невидимым. Spotify делает это очень хорошо, используя полутоновые фотографии и «Bursts» в обложках альбомов и плейлистов.

Редизайн Apple Music, фото номер - 5

Для сравнения, визуальный брендинг Apple Music на данный момент по-своему противоречив:

Редизайн Apple Music, фото номер - 6

Здесь есть сочетание символов, 3D типографии и черно-белой фотографии.

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

Редизайн Apple Music, фото номер - 7

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

Мое решение основывалось на следующем принципе:

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

Обложки артистов:

Вдохновленный экраном приветствия Apple Music, я решил продемонстрировать портреты артистов в кругах. Форма круга была вдохновлена iPod Click Wheel — знаковой частью музыкального наследия Apple. Мотив «лицо внутри круга» также можно увидеть в других аспектах iOS, в первую очередь в «Контактах».

Кроме того, я выбрал Сан-Франциско, чтобы обложки артистов гармонировали с пользовательским интерфейсом. Наконец, я ограничил цветовую палитру различными оттенками синего, фиолетового и красного цветов, чтобы отразить значок Apple Music.

Редизайн Apple Music, фото номер - 8
Обложки артистов

Обложки рекомендованных плейлистов:

Я хотел, чтобы для рекомендованных плейлистов внешний вид был согласован с обложками артистов. И посредством использования цвета продемонстрировать аспект настроения / ощущения плейлиста. Более яркие изображения отображаются на фоне одного и того же изображения с фильтром размытия по Гауссу (навеяно размытыми фонами iOS). Для некоторых обложек я также добавил слабый градиент подписи Apple Music, чтобы добавить ощущение объема.

Редизайн Apple Music, фото номер - 9
Рекомендованные плейлисты

Обложки основных плейлистов:

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

Редизайн Apple Music, фото номер - 10
Основные плейлисты
Я думаю, что эта новая схема брендинга хорошо гармонирует с остальной частью пользовательского интерфейса, и мне любопытно посмотреть, может ли этот круговой мотив быть каким-то образом анимирован при вводе пользователем…

3. Визуальный интерфейс

Общие улучшения

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

Редизайн Apple Music, фото номер - 11
Выше: бесстыжая реклама EXID

Библиотека

Я не думал, что необходимы значительные изменения во вкладке «Библиотека», поэтому я ограничил изменения стандартным пробелом и регулировкой размера шрифта. Я удалил Загруженная музыка как пункт меню по умолчанию, потому что я думаю, что приложение должно самонастраиваться, какую музыку пользователь может получить, основываясь на доступности LTE / WiFi.

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

Редизайн Apple Music, фото номер - 12
Закругленные углы приложения уже заставляют его выглядеть бодро, почему бы не заставить его чувствовать себя бодрым?

Для вас

«Для вас» (For You) — это сердце Apple Music. Где приложение Apple Music демонстрирует гибкость знаний о пользователе, посредством рекомендованных плейлистов и альбомов, основываясь на том, что пользователь отметил как «Понравилось.»

Я получил тонну отзывов о том, насколько случайным ощущается нынешнее «Для вас», поэтому для своего редизайна я стремился уменьшить количество контента, предлагаемого пользователю, одновременно повышая релевантность того, что осталось… как «Топ публикаций» в Facebook и Instagram.

Переработанный раздел «Для вас» начинается с «My Sampler» вместо текущих «My Favorites Mix» и «My New Music Mix». Пункт «Недавно прослушанные» остался без изменений, так как пользователи сочли его весьма полезным.

Редизайн Apple Music, фото номер - 13

Прокрутив страницу вниз, вы обнаружите, что я изменил «Вставить здесь день недели — Списки воспроизведения» (Insert Day of the Week Here — Playlists) на определенное Настроение (Mood), которое будет корректироваться в зависимости от местоположения, времени и последних действий в социальных сетях.

Разве не было бы здорово, если бы сразу после проверки кафе на Facebook, AppleMusic обновила раздел настроения и предложила соответствующий плейлист?

Редизайн Apple Music, фото номер - 14
Если мы в любом случае делимся всей жизнью в социальных сетях, возможно, что-то из этого получится, как думаете?
Ниже — Daily Stream, пример того, как эксклюзивный видеоконтент может быть предложен пользователю в зависимости от его предпочтений. Например, мне очень нравится Кэти Перри, поэтому, если выйдет эпизод Carpool Karaoke с Кэти Перри, призыв к действию может быть изменен, чтобы выделить выступление Кэти.
Редизайн Apple Music, фото номер - 15
Технически это еще не реализовано, но, пожалуйста, позвольте этому стать правдой.
Впоследствии вы найдете классические обложки артистов, которые я сохранил в этом демо, чтобы показать, как новые схемы визуального брендинга работают в гармонии с остальной частью пользовательского интерфейса.

Редизайн Apple Music, фото номер - 16

И последнее, но не менее важное: пользователи получают предварительный просмотр своих любимых / слушаемых жанров, так что у них есть быстрый доступ к большему количеству музыки, если ничто в канале «Для вас» не способно заинтересовать их.

Редизайн Apple Music, фото номер - 17
Я не смог придумать подходящий инструмент для жанра Pop, поэтому выбрал жвачку

Но что случилось с Connect?

Хороший вопрос. По правде говоря, в моих исследованиях нет данных, которые оправдывали бы сохранение фида Connect в приложении. Пользователи больше интересовались связью с друзьями и семьей через музыку (а-ля Spotify), а не с артистами через выхолощенный Twitter.

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

Mean Girls
Фото Paramount Pictures/Mean Girls

Обзор

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

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

Редизайн Apple Music, фото номер - 17

Я также объединил меню радио с существующим меню обзора.

Редизайн Apple Music, фото номер - 18
Удобно освободилось место для вкладки Видео…

Видео

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

Редизайн Apple Music, фото номер - 19
Дополнительным преимуществом выделения вкладки для видео является то, что «Обзор» может быть зарезервирован исключительно под аудиоконтент.
Со временем будет достаточно контента, чтобы обосновать необходимость отдельной вкладки, но сейчас я основываю свои дизайнерские решения на утечке информации, а также на существующем визуальном языке Apple Music.

Поиск

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

Редизайн Apple Music, фото номер - 20

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

Редизайн Apple Music, фото номер - 21
Это особенно раздражает, потому что есть большая вероятность ошибки ввода, особенно если пользователь ищет новую песню или исполнителя, которые еще не в его библиотеке.
Мое решение — объединить два режима в один общий «поиск», который отображает результаты из библиотеки пользователя, а затем все, что доступно в Apple Music.
Редизайн Apple Music, фото номер - 22
Это очевидно, что я большой поклонник Lady Gaga?
Поддержка нечетких ключевых слов должна распространяться на содержимое библиотеки пользователя. Также будет интересно узнать, могут ли в будущем быть реализованы результаты поиска, по ключевым словам, связанным с настроениями или деятельностью пользователя.

Сейчас воспроизводится

Мне нравится то, что Apple сделала с экраном «Сейчас воспроизводится» (Now Playing), и не думаю, что необходимы какие-либо существенные корректировки. Я решил сохранить большую часть визуального интерфейса. Тем не менее, я думал, что будет замечательно опираться на существующий опыт, включив простое взаимодействие при помощи жестов.

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

Редизайн Apple Music, фото номер - 23
«Если они так хорошо спрятаны, это означает, что они не должны быть найдены, верно?»
Мое решение состояло в том, чтобы реализовать жест, с которым большинство пользователей уже знакомы по игре Now Playing — двойной щелчок. Я заметил, что многие пользователи пытались нажать на «плавающую» обложку альбома в настоящем релизе (это просто выглядит так восхитительно) … почему бы не добавить отзыв?
Редизайн Apple Music, фото номер - 24
Музыка для поколения Instagram
Кроме того, я добавил предварительный просмотр к смежным трекам, которые пользователи могут пролистать. Я верю, что это предоставит пользователям больше контроля над прослушиванием интуитивным способом.
Редизайн Apple Music, фото номер - 25
Пролистывайте вправо.

Что дальше?

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

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

Я не ожидаю, что хорошие люди из Apple Music возьмут что-нибудь из этого исследования. Фактически, у меня может быть сердечный приступ, если любой, кто работает над Apple Music, наткнется на эту статью … но если вы там, я надеюсь, что моя работа смогла дать вам некоторые идеи и стать толчком к обсуждениям!

Благодаря этому проекту я пришел к пониманию ценности моего театрального опыта для UX дизайна — дизайнеры и артисты, работающие в театре, одинаковы в своем общем понимании человеческой эмпатии. Примите это, буквально все, кто смотрит мое резюме!

Вскоре я приступлю к следующему большому приключению: начну учиться на бакалавра искусств (BFA) по графическому дизайну в Школе дизайна Род-Айленда. Хотя мне странно прощаться с этим этапом своей жизни (и с Северо-западным университетом), я искренне надеюсь, что это только начало карьеры в дизайн-опыте … карьеры изменения мира посредством эмпатии.

Джейсон Юань — Visual & Experience Designer
Theatre/Communications Junior, Northwestern University
Twitter | Instagram | Portfolio | Let’s talk!