Совсем недавно YouTube прекратил поддержку интерфейса Cosmic Panda. Судя по комментариям в сети и отзывам знакомых, дизайн пришелся по вкусу многим и отчасти этот факт подтолкнул меня к написанию этого поста, потому как новый интерфейс хоть и приобрел некоторый лоск, в большинстве своем остался на уровне 2005 года, что лично я считаю неприемлемым для сервиса такого уровня. Но оставим эти рассуждения, возможно YouTube делает только первые шаги на пути к улучшению внешнего вида, я же предлагаю вам пятничный экскурс в историю дизайна в картинках. Это не многостраничный отчет, а всего лишь небольшая серия, разрозненных картинок, сдобренных сдержанным сарказмом, при всем при этом, прекрасно иллюстрирующая наплевательское отношение к дизайну и пользователям в целом со стороны Google.
Прежде всего хотелось бы выразить благодарность дизайнерам который спроектировали этот интерфейс и смогли, пусть не надолго, но вдохнуть хоть толику стиля в YouTube.
Небольшое отступление: к сожалению, делать скриншоты я начал слишком поздно и материалов вышло не столь много, косяков в дизайне было намного больше.
Итак, в июле этого года YouTube выкатывает новый интерфейс – Cosmic Panda. Выглядит стильно и многообещающе.
Но счастье длилось не долго, видимо дизайнер начал конфликтовать с руководством которое требовало больше gifых котиков и блестяшек в дизайне, после чего, возможно даже запил, в итоге плюнул и ушел.
Началось все с шапки. Изначальный вариант был плох лишь в неаккуратной иконке поиска.
Кнопку поправили, но зачем-то сменили цвет подложки на белый. Сделано это было видимо потому, как старая шапка конфликтовала с главной страницей, на которой все белое аж с 2000 года. Дань традициям, так сказать.
Через некоторое время серый цвет вернули, причем вместе с иконкой О_- При этом пострадала ссылка на профиль, на скриншоте отображено состояние при наведении курсора.
Ну и в оконцовке, поправили все разом. Даже иконку вызова экранной клавиатуры подвинули.
Блок с быстрым доступом к избранному и плейлистам – отдельная песня. Видимо старый дизайнер так и не успел довести дело до конца. Стрелки «Влево-вправо» хороши.
Ребята долго шли к вполне очевидному варианту, и не решались растянуть их на всю длину, даже промежуточную версию сделали.
Хвала Одину, тут как и с шапкой все закончилось почти хорошо. Стрелки растянулись и потолстели. Правда отступ превью справа так и не поправили.
Ну а вариант с наведением курсора, вообще плох.
Спускаемся ниже. При просмотре канала, слева и справа от окна плеера имеются стрелки перехода к следующему видео. К сожалению первоначального варианта нет, зато есть последний. Вот такие вот очаровательные стрелочки с классными подсказками.
Накосячить с плеером оказалось сложнее, поэтому он особым изменениям не подвергался. Cпасибо Adobe Flash ЗА ЭТО!
Ну это не страшно, ниже возможностей хватает. Далее идет заголовок, в нем всего три блока: блок с аватаром, именем владельца видео и кнопкой подписки, блок переключения «Комментарии – Похожие видео» и блок изменения размера плеера. Внимание, а теперь вопрос:
В скольких из трех блоков допущены ошибки? Правильно! Во всех.
Изначальный вариант со временем превратился в
Вызывающие восхищение у многих, кнопки переключения размера также подверглись экзекуциям и в результате прижались друг к другу на неприличное расстояние.
Но это не единственный косяк в этом элементе. Дело в том, что при наведении курсора, внешняя, нижняя линия, черного цвета, меняется на внутреннюю белую. В результате, кнопка уменьшается в размерах на один пиксель. В статике это не особо видно, но глаз цепляется.
Та же болезнь наблюдается и у кнопок «Комментарии – Похожие видео».
На этом моменте, а может быть и раньше, внимательный читатель вероятно скажет: «Минутку, а ты в каком браузере смотришь? Установил небось Conqueror и рассказывает нам, как все плохо». Успокою внимательного читателя, на момент создания скриншотов я использовал последнюю версию Opera. Не слишком убедительно? Opera, СНГ, да-да, но специально для этого случая я приберег несколько скриншотов из… сюрприз-сюрприз Googleвского браузера – Chrome. Открываем, смотрим.
Статистика видео. В нее никто не заглядывает, видимо по этой причине до последнего момента график вылазил за рамки.
А вот дальше самое вкусное. Создаем плейлист.
Ну вроде бы все норма…Минутку. Что, серьезно?! «Отмен…» значит влезло на «Отмена» нет? Google, are u insane? Ну а «Создать плей…» я не знаю, тут видимо надо быть учеником Якоба Нильсена, как минимум, чтобы выйти из такой сложной ситуации. И оставим на совести дизайнеров кнопку отмена слева.
Ну и последний Easter egg из старого интерфейса: блок «Эти каналы могут быть вам интересны».
Присмотритесь к этой картинке, в частности к кнопкам закрытия. Под первым блоком она есть, под последним тоже. «Ну да, а под вторым нету» А вот хрен! Она есть. Видите белую линию в один пиксель? Так вот это она. С горем пополам, перетерпев некоторые изменения, эта самая кнопочка перекочевала в новый интерфейс, и попасть по ней все также сложно.
Ну и напоследок, несколько «приятных» моментов из нового интерфейса.
Сразу после запуска, YouTube позаботился и разъяснил несколько ключевых моментов, дабы переход на новый дизайн прошел менее болезненно и показал подсказки.
Только вот беда «десь на название канала» не очень-то помогает. Слева видна граница боковой панели Opera. Разрешение экрана 1366х768.
Ну а добавить каналы, оно и в Африке – добавить каналы. Что тут разъяснять.
Объем текста разрывает кнопку.
Пожалуй на этом все. Желаю YouTube внимательнее подходить к front-endу, а вам приятных выходных. Спасибо за чтение.
Прежде всего хотелось бы выразить благодарность дизайнерам который спроектировали этот интерфейс и смогли, пусть не надолго, но вдохнуть хоть толику стиля в YouTube.
Небольшое отступление: к сожалению, делать скриншоты я начал слишком поздно и материалов вышло не столь много, косяков в дизайне было намного больше.
Итак, в июле этого года YouTube выкатывает новый интерфейс – Cosmic Panda. Выглядит стильно и многообещающе.
Но счастье длилось не долго, видимо дизайнер начал конфликтовать с руководством которое требовало больше gifых котиков и блестяшек в дизайне, после чего, возможно даже запил, в итоге плюнул и ушел.
Началось все с шапки. Изначальный вариант был плох лишь в неаккуратной иконке поиска.
Кнопку поправили, но зачем-то сменили цвет подложки на белый. Сделано это было видимо потому, как старая шапка конфликтовала с главной страницей, на которой все белое аж с 2000 года. Дань традициям, так сказать.
Через некоторое время серый цвет вернули, причем вместе с иконкой О_- При этом пострадала ссылка на профиль, на скриншоте отображено состояние при наведении курсора.
Ну и в оконцовке, поправили все разом. Даже иконку вызова экранной клавиатуры подвинули.
Блок с быстрым доступом к избранному и плейлистам – отдельная песня. Видимо старый дизайнер так и не успел довести дело до конца. Стрелки «Влево-вправо» хороши.
Ребята долго шли к вполне очевидному варианту, и не решались растянуть их на всю длину, даже промежуточную версию сделали.
Хвала Одину, тут как и с шапкой все закончилось почти хорошо. Стрелки растянулись и потолстели. Правда отступ превью справа так и не поправили.
Ну а вариант с наведением курсора, вообще плох.
Спускаемся ниже. При просмотре канала, слева и справа от окна плеера имеются стрелки перехода к следующему видео. К сожалению первоначального варианта нет, зато есть последний. Вот такие вот очаровательные стрелочки с классными подсказками.
Накосячить с плеером оказалось сложнее, поэтому он особым изменениям не подвергался. Cпасибо Adobe Flash ЗА ЭТО!
Ну это не страшно, ниже возможностей хватает. Далее идет заголовок, в нем всего три блока: блок с аватаром, именем владельца видео и кнопкой подписки, блок переключения «Комментарии – Похожие видео» и блок изменения размера плеера. Внимание, а теперь вопрос:
В скольких из трех блоков допущены ошибки? Правильно! Во всех.
Изначальный вариант со временем превратился в
Вызывающие восхищение у многих, кнопки переключения размера также подверглись экзекуциям и в результате прижались друг к другу на неприличное расстояние.
Но это не единственный косяк в этом элементе. Дело в том, что при наведении курсора, внешняя, нижняя линия, черного цвета, меняется на внутреннюю белую. В результате, кнопка уменьшается в размерах на один пиксель. В статике это не особо видно, но глаз цепляется.
Та же болезнь наблюдается и у кнопок «Комментарии – Похожие видео».
На этом моменте, а может быть и раньше, внимательный читатель вероятно скажет: «Минутку, а ты в каком браузере смотришь? Установил небось Conqueror и рассказывает нам, как все плохо». Успокою внимательного читателя, на момент создания скриншотов я использовал последнюю версию Opera. Не слишком убедительно? Opera, СНГ, да-да, но специально для этого случая я приберег несколько скриншотов из… сюрприз-сюрприз Googleвского браузера – Chrome. Открываем, смотрим.
Предпо. Чтобы и. Нажмит %юзернейм%.
Те самые иконки в Chrome, Opera на тот момент не понимала CSS3 градиенты.
Статистика видео. В нее никто не заглядывает, видимо по этой причине до последнего момента график вылазил за рамки.
А вот дальше самое вкусное. Создаем плейлист.
Ну вроде бы все норма…Минутку. Что, серьезно?! «Отмен…» значит влезло на «Отмена» нет? Google, are u insane? Ну а «Создать плей…» я не знаю, тут видимо надо быть учеником Якоба Нильсена, как минимум, чтобы выйти из такой сложной ситуации. И оставим на совести дизайнеров кнопку отмена слева.
Ну и последний Easter egg из старого интерфейса: блок «Эти каналы могут быть вам интересны».
Присмотритесь к этой картинке, в частности к кнопкам закрытия. Под первым блоком она есть, под последним тоже. «Ну да, а под вторым нету» А вот хрен! Она есть. Видите белую линию в один пиксель? Так вот это она. С горем пополам, перетерпев некоторые изменения, эта самая кнопочка перекочевала в новый интерфейс, и попасть по ней все также сложно.
Ну и напоследок, несколько «приятных» моментов из нового интерфейса.
Сразу после запуска, YouTube позаботился и разъяснил несколько ключевых моментов, дабы переход на новый дизайн прошел менее болезненно и показал подсказки.
Только вот беда «десь на название канала» не очень-то помогает. Слева видна граница боковой панели Opera. Разрешение экрана 1366х768.
Ну а добавить каналы, оно и в Африке – добавить каналы. Что тут разъяснять.
Объем текста разрывает кнопку.
Масло. YouTube 2011 год.
Пожалуй на этом все. Желаю YouTube внимательнее подходить к front-endу, а вам приятных выходных. Спасибо за чтение.
