https://dribbble.com/STUDIOJQ

Jonathan Quintin – дизайнер из Великобритании, основатель студии Studio-JQ, который стал известен и набрал почти 40 000 подписчиков на Dribbble благодаря тому, что начал каждый день рисовать по одному принту и выкладывать их на всеобщее обозрение. Если вы посмотрите его портфолио или Dribbble-аккаунт, то увидите, что Джонатан очень здорово подбирает цвета, и даже примитивные по содержанию работы выглядят очень ярко и сочно. Можно пытаться брать на вооружение.

https://dribbble.com/fuviz

Ben Schade – дизайнер из Германии, который помимо всего прочего еще ведет приятный Instagram – https://www.instagram.com/design.feed/, в котором собирается большая коллекция приятных работ абсолютно разных дизайнеров. Ну а сам Бэн, очень здорово работает с цветами, придавая им приятную матовость за счет правильных градиентов. Цвета получаются не такими ядреными, как у предыдущего автора, и начинают больше походить на fluent design стилистику.

https://dribbble.com/glebich

Ну Глеб Кузнецов итак уже должен быть у всех в друзьях. Но для тех ребят, кто работает в рекламе или в смежных с дизайном областях, все же не могу не упомянуть его. Глеб очень крутой дизайнер, который в данный момент занимает позицию дизайн-директора во всем известной компании Fantasy (http://fantasy.co/). Dribbble-аккаунт Глеба наполнен очень крутыми интерфейсными анимациями. Конечно, все сразу начинают писать, что такие анимации никогда не будут работать в реальной жизни, и правда, многие анимационные решения будет сложно воспроизвести в реальном продукте на большом количестве разных устройств. Но мне кажется, что все равно важно делать концепты на будущее, кто знает, как быстро технологии позволят реализовать ваши задумки. Но вдохновиться вы точно сможете! 😉

И хочу попросить вас писать мне свои вопросы, на которые я смогу ответить в постах – @sergeyandronov
Любые вопросы про фестивальные проекты, про рекламу, про инструменты принесут пользу.
Так что не стесняйтесь, буду отвечать! 😉

Привет!
Честно признаюсь, написал большой текстовый пост про второй блок фестивалей, но вчера начал голосовать за сайт месяца на The FWA и наткнулся на проект, который почему-то пропустил ранее. И пускай фестивали подождут до завтра, а этот сайт вам не стоит пропускать!

http://www.unlockourkids.com/

Обязательно откройте его с мобильного телефона прямо сейчас, и именно с мобильного телефона.
Это проект выступает против содержания маленьких детей в одиночных камерах в США. Оказывается, что в Штатах лиц старше 7 лет могут спокойно сажать в одиночку на сутки. И как показывает статистика, это имеет только обратный желаемому эффект.

Оцените, как ребята круто сплели интерактивную механику, технологию, эмоциональную составляющую и основную тему.
Моя реакция была приблизительно такой: ага, ну понятно -> что за… -> воу, круто!

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

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

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

Webby
Премия существует с 1996 года и ежегодно награждает лучшие веб-проекты. Иногда ее называют «Интернет Оскаром» и это недалеко от действительности.

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

Разумеется, все перечисленные категории рассматриваются в тесной взаимосвязи с интернетом.

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

Стоимость подачи
$325-$385 в зависимости от даты подачи

Cannes Lions
Я думаю, что многие знают эту премию. Изначально у многих она воспринималась как сугубо рекламная, но сейчас там такое количество категорий, что место найдется всем 🙂

В общем не стоит говорить, что это один из самых престижных фестивалей, существующий с 1954 года и обладание Львом или хотя бы шорт-листом уже хорошее достижение.

Но нам интересно посмотреть на Каннские Львы с точки зрения оценки заслуг именно в вебе, в мобильных приложениях, в продуктах. И совсем недавно здесь произошли нововведения, которые дали этому направлению сильный толчок. С 2016 года в списке категории появился Digital Craft, в котором как раз оценивается уровень и креативность исполнения в интересующих нас сферах.

Основные категории
Категорий настолько много, что они разделены на 5 больших групп, каждая из которых включает в себя рад подкатегорий:
- Группа А – Form: Image; Sound; Aesthetic
- A01 Interface & Navigation (UI)
- A02 Digital Illustration
- A03 Video / Moving Image
- A04 Image Design
- A05 Music / Sound Design
- A06 Typography
- A07 Overall Aesthetic Design
- Группа B – Function: Design; Construction; Experience
- B01 User Experience Design (UX)
- B02 Native & Built-In Feature Integration
- B03 Experience Design: Multi Platform
- B04 Overall Functional Design
- Группа C – Content
- C01 Editorial
- C02 Rich Media
- C03 Omni-Channel Storytelling
- Группа D – Data
- D01 Curation of Data
- D02 Data Storytelling
- D03 Data Visualisation
- Группа E – Technology
- E01 Augmented Reality (AR)
- E02 Virtual Reality (VR)
- E03 Innovative Use of Technology
- E04 Technological Achievement in Digital Craft

Более подробное описание всех категорий можно посмотреть вот здесь – https://www.canneslions.com/awards/the-lions/digital-craft .

Стоимость подачи
€515-€695

Red Dot
Премия из Германии, которая существует с 1955 года. Изначально награждались работы только в сфере промышленного дизайна, но позже стали также выбирать лучшие работы в сфере коммуникационного дизайна и концепт-дизайна.

Основные категории
Если говорить о вебе и интерфейсах, то они попадают в большую группу коммуникационного дизайна, в которой среди прочих есть следующие категории:
- online
- apps
- interface & User Experience Design

Оценка работ
Судьи используют в оценке следующие критерии:
- дифференциация от других проектов на рынке
- эстетика
- функционал
- эмоциональность

Стоимость подачи
€195-€315 в зависимости от времени подачи.
Но! На Red Dot есть забавный нюанс – если вам повезло взять со своим проектов Best of the Best, то вам придется заплатить еще €2,325.

Я обожаю удивляться! Наверняка вы тоже. Поэтому все мы так любим фокусы, всякие трюки и эксперименты. Это состояние заставляет нас чувствовать необычные эмоции и вызывает желание поделиться только что увиденным с друзьями, поэтому так популярны видео из серии PeopleAreAwesome.

Но для меня есть разные способы удивления. Один из них это как раз удивление от фокуса или какого-то нереального трюка, когда эмоция возникает от конфликта между случившимся и реальностью, которая существовала у вас в голове. Вы никогда не думали, что человек способен спрыгнуть с самолета без парашюта, а тут вдруг Люк Эйкинс прыгает с высоты 7,6 километров просто в сетку. И мы такие «Чееегооо»! =)

Другой вид удивления схож с озарением. Это когда мы удивляемся какому-то элегантному решению, которое поняли не сразу, или у меня такое часто случается в музеях современного искусства. Ты заходишь в зал, в нем какая-то непонятная экспозиция, которая не говорит тебе ровным счетом ни о чем. Ты читаешь большущий текст на стене, где тебе открывается контекст и понимаешь, что гора скомканных листков бумаги, которая в несколько раз больше тебя, оказывается состоит из реальных черновых записей, которые были забракованы автором на пути к финальному произведению. И ты такой «О-хре-неть»! =)

И такое большое вступление к тому, что сегодня закончился август, а это значит, что мы можем посмотреть на лучший проект месяца The FWA. И проект заставил меня почувствовать себя прямо как в музее современного искусства. Сначала я нихрена не понял, было просто «прикольно». А потом понял и стало «охрененно» аж на 89 баллов (что очень круто).

Небольшая вводная для проекта:
1) это интерактивный музыкальный клип популярной в Штатах группы LCD Soundsystem, сделанный совместно с ребятами из Google и фанатами группы
2) все двигающиеся фигуры, которые вы увидите, это реальные люди, которые плесали, кривлялись и выделывались, как могли в HTC Vive
3) каждая комната, это отдельный человек, где запись его движений дублируется несколько раз
4) если вы будете смотреть с мобильного телефона то: обязательно заходите на сайт в наушниках или в тишине, открывайте его в альбомной (горизонтальной) ориентации. Кароч поверните телефон на 90 градусов.
5) потыкайте там 😉
6) и дождитесь самого конца, там забавная феерия на черном фоне. И посмотрите, как разные люди пытались взаимодействовать с желтым шариком, которого вообще не существует в реальности! =)

Ну поехали!
https://tonite.dance/

Привет!

Сегодня мы откроем формат постов, в котором я буду кратко пересказывать видео-лекции дизайнеров (и не только) со всего мира. Разумеется, вы сможете перейти по ссылке и прослушать лекцию самостоятельно. Но если у вас нет свободных 30 минут времени, то можно пробежаться по тезисам и понять, насколько вам будет интересно смотреть видео целиком.

И начнем мы с лекции Paul Bakaus из Google, который рассказывает про особенности восприятия скорости в вебе, поднимая тему производительности – https://www.youtube.com/watch?v=g3P7Gy_2wOo

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

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

Причем важна не реальная производительность, а ощущаемая производительность. Все мы с вами знаем, что есть огромная разница между реальным временем и ощущаемым временем в зависимости от ситуации. Иногда минуты пролетают молниеносно, а иногда тянутся вечность.

И наверняка вы слышали фразу «живи в моменте», типа находись здесь и сейчас. Но на самом деле это не особо реально, потому что все мы с вами живем постоянно в прошлом. Наше с вами сознание отстает от реальности на 80 миллисекунд. Когда вы думаете, что что-то происходит, это на самом деле уже произошло.

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

Но, как оказывается, у нас проблемы не только с ощущением настоящего. Знаете, часто говорят фразу типа «Никогда не позволяй твоему прошлому определять твое будущее»? Но будущее не может существовать без прошлого, потому что все, что мы можем представить о будущем основано на нашем прошлом опыте. Люди, которые не могут держать в голове долгосрочные воспоминания не могут себе представить завтрашний день. Это факт.

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

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

И Пол приводит несколько величин, относящихся к восприятию времени, которые стоит учитывать при работе с интерфейсами:
- если действие быстрее 200мс, то оно воспринимается как мгновенное
- если действие быстрее 1 секунды, то оно воспринимается как немедленное
- если меньше 5 секунд, то все еще воспринимается как часть user flow
- до 8.5 секунд внимание все еще концентрируется на процессе
- выше 8.5 секунд – внимание пользователя потеряно.

И заключительная величина 10 лет назад составляла 10 секунд. Но как видите, клиппинговое мышление дает о себе знать, и это значение постоянно уменьшается.

Важно влияние контекста на восприятие времени. Если вы опаздываете на встречу, то задержка в 10 секунд уже раздражает. Если же вы включаете свою приставку, чтобы провести за ней следующие несколько часов, то ожидание в 1 минуту выглядит не таким напряжным.

Переключение канала на телике в 5 секунд – очень долго.
Приготовление шаурмы за 5 секунд – очень быстро.
Иногда слишком высокая скорость уменьшает значимость сервиса.
Если что-то делается быстро, значит это просто. Если это просто, значит это дешево.

Время течет значительно дольше в пассивном ожидании (примерно на 36 процентов). Поэтому наша задача, как дизайнеров, сократить время пассивного ожидания, заменив его активным ожиданием настолько, насколько это возможно.

Вот несколько способов, которые по словам Пола могут помочь:
1. Упреждающий старт. На самом деле в эту категорию подходят все действия, предполагающие последовательное взаимодействие, где каждый следующий шаг не зависит от предыдущего, но обязательно следует за ним. Если мы знаем, что мы в обязательном порядке проведем пользователя через несколько шагов, то логично сразу загружать второй шаг, пока пользователь занят выполнением первого шага, чтобы сократить время ожидания.
2. Раннее завершение – прогрессивный JPG. Когда мы стараемся показать пользователю пусть нефинальный результат, но максимально быстро, затем уточняя его.
3. Оптимистичный UI – Instagram. Когда мы лайкаем фотографию, то сердечко и обновление количества лайков отображаются мгновенно, хотя это может еще на самом деле не произойти. Например, если вы заехали на машине в туннель, в нем поставили лайк, и, предположим, оставили телефон в туннеле навсегда, то этот лайк так и не станет реальным, хотя интерфейс вам уже показал, что все ок.
4. Предвидение – если в iOS вы просвайпите контент и быстро остановите палец, то можете обратить внимание на еле заметное продолжение движения контента. Этот эффект возникает из-за того, что система для предотвращение лага пытается предугадать ваше следующее действие. Если вы ведете палец, то система в любом случае отстает от него на миллисекунды. Чтобы этого избежать, система начинает действовать наперед подвигая контент туда, где по ее мнению будет ваш палец через несколько миллисекунд.
5. Визуальная иллюзия – здесь Пол говорит об обычных анимационных изингах, которые тоже могут повлиять на восприятие.

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

Надеюсь, что этот формат будет полезен для вас. Если вы недавно находили какие-нибудь классные лекции, то скидывайте их мне @sergeyandronov

Кстати, архив постов за прошлую неделю вы сможете найти вот здесь - https://goo.gl/jeRBtN

Интересной недели всем! ;)

Когда-то давно у себя в фейсбуке я делал пост, в котором собрал 20 самых крутых западных продашкен-студий, которые специализируются на эффектных крутых решениях.

Прошел уже почти год, и список явно хочется актуализировать и дополнить новыми именами, так что держите новую подборку крутых студий и агентств:
1. merci-michel.com
2. www.epic.net
3. buildinamsterdam.com
4. wild.as
5. immersive-g.com
6. watsondg.com
7. aquest.it/en
8. activetheory.net
9. jam3.com
10. hellomonday.com
11. dogstudio.co
12. b-reel.com
13. unit9.com
14. resn.co.nz
15. mediamonks.com
16. digital.eleks.com
17. northkingdom.com
18. waaark.com
19. legworkstudio.com
20. rezo-zero.com/en

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

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

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

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

Формулировка, которую предлагают словари, звучит следующим образом: эффектность – свойство производить впечатление. Отсюда понятно, что производить впечатление можно не только графикой, но и множеством других способов.

На текущий момент для себя я выделил следующие виды эффектности:
1) визуальная – анимационные решения, нестандартные способы верстки, нестандартные статичные графические решения и так далее
2) смысловая – когда мы впечатляемся самой идей и концепцией проекта. Они могут быть обличены в разную форму, навороченную или очень простую, но эффект, произведенный самой сутью, явно ощутим.
3) функциональная – когда мы удивляемся, радуемся и показываем друзьям то, каким образом продукт, сервис, сайт помогает нам, как он необычно решает наши задачи.
4) коммуникационная – когда мы испытываем эмоции от того языка, на котором с нами разговаривает продукт или сервис.

Наверняка позже этот список дополнится и детализируется.

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

Завтра вечером (7 сентября) в 20:00 я буду делиться той информацией, которая собралась на текущий момент в Британской Высшей Школе Дизайна. Мы попробуем порассуждать, посмотреть конкретные примеры и приемы.

Видеозаписи и выложенной презентации, к сожалению не будет. Но это будет открытая бесплатная лекция, на которую вы спокойно можете прийти, просто зарегистрировавшись (отметившись) на странице мероприятия – https://www.facebook.com/events/1864441100540051

Так что приходите, если вы сейчас в Москве, познакомимся и пообщаемся!

Уже почти год назад ребята из музыкальной группы OK Go выпустили свой очередной безумный музыкальный клип «The One Moment»

Но помимо самого ролика очень интересно посмотреть процесс того, как он создавался https://www.youtube.com/watch?v=v8nc5wBl0dM

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

Если же говорить про клип «The One Moment», то несмотря на то, что он был сделан почти год назад, он получил золотого Льва на Каннских Львах в этом году и есть за что. Фишка клипа в том, что ребята сняли весь клип за 4.5 секунды! Запись производилась на камеру со скоростью 4000 кадров в секунду с помощью заранее запрограммированной роботизированной руки, которая четко провелка камеру в нужные моменты по нужной траектории.

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

Мы сегодня вечером будем обсуждать этот пример на моей открытой лекции в Британке, так что напоминаю, что вы можете запросто прийти, а я буду вам очень рад – https://www.facebook.com/events/1864441100540051/! 😉

http://nikecityfast.co.uk/ – мобильный сайт-игра для Nike. Знакомая механика и приятная графика, вероятно сделают его победителем в ближайшие пару дней на FWA.

Но говоря про этот проект, хочется еще немного затронуть тему Progressive Web App. В этом посте мы не будем изучать все технические особенности PWA, но поговорим о применимости формата к такого рода проектам как NikeCityFast.

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

И формат PWA очень круто может здесь помочь. Он позволяет сохранить сайт в виде отдельной версии к вам прямо на Home Screen в виде иконки. То есть у вас на экране появится иконка, такая же как у любого другого приложения, установленного из AppStore или Google Play. И теперь для того, чтобы вернуться к игре, вам достаточно просто тапнуть на иконку.

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

Думаю, что мы еще вернемся к теме Progressive Web App в других постах с конкретными примерами и техничекими особенностями, чтобы вы точно смогли принять решение о том, насколько такой формат будет полезен в вашей работе.

Ну а архив за прошлую неделю по традиции можно найти вот здесь - https://goo.gl/jeRBtN ;)