Итоги года: Редизайны «ВКонтакте», Uber, Apple Music, «Студии Артемия Лебедева»
Редакция рубрики «Интерфейсы» вспомнила наиболее обсуждаемые и примечательные редизайны сервисов, сайтов компаний и приложений в 2016 году.
«ВКонтакте»
1 апреля 2016 года соцсеть «ВКонтакте» представила новую версию дизайна сайта — первое крупное обновление интерфейса веб-версии сервиса за 10 лет.
Интерфейс новой версии сайта российской соцсети выполнен в концепции «островов»: основной контент страниц — записи сообществ и пользователей — находится в блоках с белым фоном. Весь сайт получил голубой фон.
![]()
Редизайн был тепло принят сообществом дизайнеров. Позднее сооснователь «ВКонтакте» Павел Дуров, покинувший компанию в апреле 2014 года, сформулировал 7 претензий к новому дизайну «ВКонтакте».
«Проведенный редизайн не только не соответствует стандартам 15–16 года (таким, как Material), но и снижает юзабельность ресурса. Все перечисленные элементы нового дизайна были вслепую скопированы с Facebook образца 2012 года», — отметил Дуров. По его словам, основные разделы сайта стали уже, пропал фокус с контента и фотографий, а белый фон был заменен на «грустный и пасмурный».
В ответ на претензии Дурова операционный директор «ВКонтакте» Андрей Рогозов сформулировал 7 плюсов редизайна соцсети. Навигация упростилась, общаться стало удобнее, а сайт стал работать быстрее, ответил Рогозов.
Uber
В ноябре 2016 года крупное обновление интерфейса — впервые с 2012 года — получило и приложение Uber. В начале года компания изменила логотип и фирменный стиль, отказавшись от чёрно-белой палитры, при этом в приложении на тот момент обновился только экран загрузки.
В новом приложении изменились основные сценарии использования. Например, теперь нужно сначала выбрать пункт назначения для поездки, а затем указать нужный класс автомобилей — ранее Uber предлагал сначала выбрать класс, а затем указать пункт прибытия.
Обновленное приложение «учится» на поездках пользователя и автоматически создает «закладки» для наиболее востребованных маршрутов — например, домой или на работу.
![]()
Разработчики интерфейса предусмотрели возможность интеграции сторонних сервисов: например, с помощью Yelp можно будет изучить отзывы на заведение, в которое едет пользователь, а через Foursquare — посмотреть, какие интересные места есть в городе в районе маршрута поездки.
Чаще всего пользователи критиковали изменившийся интерфейс заказа машины — ля того, чтобы уточнить своё местоположение, пользователю необходимо совершить несколько дополнительных шагов.
Apple Music
В июне 2016 года Apple объявила о полном редизайне сервиса Apple Music — спустя год после запуска первой версии.
Изменились все экраны приложения. Теперь при входе в Apple Music пользователь видит свою музыкальную библиотеку отдельно от произведений, доступных для онлайн-прослушивания. Разработчики упростили интерфейс и спрятали редко используемые функции. Например, раздел Connect с публикациями артистов переместился во вкладку For you.
Заголовки и элементы управления стали крупнее, а плеер открывается в новом слое: пользователь может просмотреть следующие композиции в списке проигрывания свайпом снизу вверх.
Первая версия Apple Music
Обновленная версия Apple Music
Сайт «Студии Артемия Лебедева»
Еще одно крупное обновление дизайна произошло у сайта «Студии Лебедева». Главная страница выполнена в виде блога, появились теги для навигации по проектам студии и адаптивная верстка для мобильных пользователей.
![]()
Раздел «Наше всё» с работами компании получил новую сетку — все проекты представлены в прямоугольных блоках.
![]()
![]()
Новый сайт получил адаптивную верстку. При этом ранее Лебедев выступал против создания мобильных версий сайтов: «Чем хорош современный смартфон? Тем, что это практически полноценный компьютер. Он умеет все. В том числе — нормально показывать сайты. Спрашивается, если телефон нормально показывает сайт, зачем что-то еще изобретать? Через телефон все отлично видно».
![]()
Предыдущая версия сайта:
![]()
YouTube
В мае Google представила новый интерфейс YouTube, выполненный в стиле Material Design. На главной странице основные изменения коснулись строки поиска — теперь она расположена в середине «шапки» сайта. Кнопка «Upload» заменена на пиктограмму из мобильных приложений Google.
![]()
Основные изменения произошли на странице каналов — их фон теперь привязан к основному цвету на картинке-обложке. Логотип канала теперь отображается в круге, а не в квадрате.
![]()
Новый дизайн
Старый дизайн
«Фламп»
Сервис отзывов «Фламп», принадлежащий компании »2ГИС», в июне представил новую версию своего сайта, обновил логотип и расширил возможности пользователей. В частности, у них появилась возможность связаться с зарегистрированными на «Флампе» представителями компаний.
По словам представителей сервиса, основной акцент сделан на удобном поиске и выборе подходящих компаний. Система поиска теперь поддерживает естественные запросы по различным характеристикам: например, «кафе с wi-fi», «круглосуточная парикмахерская» и так далее.
Новая версия
Старая версия сайта
Часть пользователей «Флампа» раскритиковала новый дизайн сервиса, обвинив компанию в резкой смене «привычного и яркого» интерфейса на «слишком лаконичный и холодный».
«Новая газета»
В июле «Новая газета» представила новую версию своего сайта, которая напомнила пользователям дизайн издания «Медиазона».
![]()
![]()
Разработкой нового сайта издания занималась студия Charmer, которая ранее работала над проектами Meduza, «Ведомости», «Арзамас», Afisha Daily.
РИА Новости
Дизайнеры РИА Новости изменили структуру страниц и избавились от лишних элементов. На заглавной странице остались только главные темы дня. Блок новостей дизайнеры опустили ниже, на «второй экран» сайта.
Раздел «Картина дня» остался на «третьем экране». В холдинге считают, что трёхуровневая подача информации «позволит читателю получить полное представление об информационном поле в пределах одного экрана».
![]()
![]()
«Ситимобил»
Обновленный дизайн приложения московского такси-сервиса разрабатывала «Студия Артемия Лебедева». Разработчики говорят, что во время работы проанализировали более 80 приложений такси-сервисов, сравнивая ходы и способы решения однотипных задач.
![]()
В предыдущей версии приложения адреса подачи и прибытия нужно было указывать вручную, при этом настройка параметров была вынесена на отдельный экран. В новой версии решили использовать «самый смелый» вариант изменений, разместив все элементы управления на одном экране.
![]()
Forbes
В декабре российское издание Forbes представило первое крупное обновление сайта после смены владельца, гендиректора и главного редактора.
Разработчики разделили главную страницу на две части, увеличив акцент на главные новости дня. В правой части теперь отображается анонс обзорного материала. Боковой рекламный баннер смещен вниз и отображается только на втором экране главной страницы.
![]()
![]()
«Дождь»
Российский телеканал «Дождь» перешел на адаптивную верстку и новый стиль страниц. Главная страница сайта теперь состоит из двух колонок — блок «Новости» разработчики расположили в левой колонке, оставив центральную часть страницы для ТВ-сюжетов. Материалы канала теперь имеют крупные иллюстрации.
![]()
![]()
Приложение Google Maps
В 2016 году Google провела редизайн карт для своих приложений на iOS и Android, а также в веб-версии.
Слева — старый дизайн, справа — новый
Разработчики изменили шрифты, используемые в приложениях, и убрали с карт элементы, которые могут мешать навигации. Теперь на Google Maps объекты, которые могут интересовать пользователя в первую очередь, подсвечиваются желтым оттенком.
© vc.ru
