и продолжит сегодня @yujinajina

Алоха! Уже теплее 😋

Отличный сайт для изучения сетки и строгой композиции, ритмов и как работают с вниманием пользователя 👀
https://kurppahosk.com

А это прекрасная компания Arrival. Очень цепляет стиль, элементы взаимодействия и композиция. Чувствуется бренд/продукт на сайте.
https://arrival.com

#grid #composition #design #elements #communication #typography #trendwatching

мы сегодня, как нетфликс — выпускаем сразу пачкой, но на пока точно всё :)

отличная подборочка от @Zel1010. кстати, формат описаний кейсов понятный, @asyati подхватывай. хотя хотелось бы сразу еще скринами подогреть интерес)

play2.studiogusto.com — Сайт с подборкой интересных фильмов, которые составляли людям компанию, когда компания была самой важной вещью. Сайт понравился своей глубиной, интересными решениями по анимации и хорошими фильмами.

rinnai.jp/microbubble — Промо-страница для запуска нового продукта Micro Bubble Bath Unit. Контент конечно на непонятном языке, но здесь привлекает плавная динамика анимаций, дымчатые эффекты, эффекты появления и в целом лёгкая вёрстка.

experiments.p5aholic.me — Сайт-проект по графическому дизайну японского веб-разработчика. Здесь конечно оочень привлекают разнообразные решения по JS. Возможность задать разную палитру сайта, ну и также коллекция из 34 разнообразных, залипательных эффектов. Своего рода библиотека для JS решений.

#design #animation #trendwatching

а вот и очередной #trendwatching подъехал. в этот раз от @asyati:

Наверняка многие уже видели этот сайт, с коллекцией сайтов на вордпрессе, так как он из свежей подборки muzli. Но на всякий случай добавлю его в свои находки, я заценила типографику и, вообще, с удовольствием поскролила его до конца. Кажется, что такое сделать не очень сложно и выглядит вполне достойно. Ну и про саму коллекцию — все эти шаблоны можно купить, причем недорого (это меня уже скорее расстроило)
https://bridgelanding.qodeinteractive.com/tour/

Эта коллекция уже точно мелькала в нашей группе, опять хочу продублировать, особенно в предверии разговора на тему 1000 и 1 блока. Здесь собраны шаблоны для типовых блоков сайта, можно брать что-то за основу своих блоков и дальше уже подключать фантазию
https://www.niceverynice.com/components

этот сайтец у меня висит во вкладочке "Вдохновение", люблю не могу я эти обводочки маркером, текст от руки (только латиница, увы), всякие подчеркивания. Вот только почему-то ни разу это прилично воплотить в жизнь у меня не получилось, но этот пример нравится))
https://culture.basicagency.com/

#components #typography #elements

Полезная статейка: Адаптация таблиц под мобильные устройства #mobile #table #guide

Сегодня к нам в #trendwatching включился некий Сергей @ssbortsov и накатал мне в личку большую телегу — спешу делиться:

1) https://www.driveplaza.com/special/ouchifesta/
сайт-стенгазета по лучшим едальням и популярным местам из 6 префектур Тохоку (это регион походу проще говоря). тяжело авто загружает первый раз, но чудесная няшная японская стилистика, приятные микроанимации, шторки переходов, которые стоит взять на заметку и шумы на заливочных элементах, которые создают ощущение аналоговости носителя. Отлично подогнан под мобилку.

2) https://umamiland.withgoogle.com/en/world/main-rice-street
Продолжаем тематику Японии и еды (я голоден). Гугл сделал максимально милашный и интерактивный путеводитель по японской кухне: сразу можно узнать что такое онигири, углубиться в продукт, перейдя на выдачу в гугл-поиске по запросу и, конечно, найти места поблизости (в рашке даже срабатывает!). С мобилки так вообще оттуда выходить не хочется — всё чётко летает как атомные часы. Великолепные микроанимахи попапов. Потрясающе передана (дружно пересматриваем любой фильм Миядзаки) стилистика изображения еды, от которой слюнки так и текут.3) https://artsexperiments.withgoogle.com/diving-into-an-acidifying-ocean/ у Гугла есть отдельная лаборатория с сайтами-экспериментами судя по всему. Это из их подборки спецпроектов и интерактивов. Сайт затрагивающий экоголjгическую проблему и рассказывающий таймлайном эволюцию микроорганизмов через анимацию мелких шейпов. Летает шикарно везде.

3) https://artsexperiments.withgoogle.com/diving-into-an-acidifying-ocean/
Сайт-путешествие, затрагивающий экологическую проблему и рассказывающий таймлайном эволюцию микроорганизмов через анимацию мелких шейпов. Летает шикарно как с мобилки, так и с компа. у Гугла есть отдельная лаборатория с сайтами-экспериментами судя по всему. Это из их подборки спецпроектов и интерактивов.

4) https://artsandculture.google.com/experiment/sgF5ivv105ukhA

Исследуй теории Кандинского о цвете и звуке и о взаимосвязи между формами. Можно послушать составленную версию картины, созданную с помощью машинного обучения (нейронки наше всё). Можно заморочиться и создать свою собственную музыкальную картину, выбрав заготовленные алгоритмы эмоций.

Этот проект является результатом сотрудничества Центра Помпиду и Google Arts.


#design #ai #animation #creative

Классная статейка, хоть и для новичков, но со ссылками на ресерчи про Эффект эстетики в юзабилити. Или как UI дизайн интерфейса позволяет прощать ошибки в UX дизайне

и новая подборочка под кофе по #trendwatching от @Dmitrymon

1. https://levonaronian.com/ru/ - сайт на русском языке, посвященный армянскому гроссмейстеру шахмат Ароняну Левону. Сайт не пестрит цветами, но отлично справляется с информационной функцией из-за понятной подачи и простоты форм. Отдельно понравились рефлекты на 3д фигуре Ферзя.

2. https://www.squadeasy.com/en/ - Сайт рассказывает нам о мобильном фитнесс-приложении, которое пытается взглянуть на спорт сквозь призму дружбы и взаимопомощи. Призывает пользователей объединяться в хабы со своими друзьями или коллегами, проходить совместные челленджи и поддерживать друг друга на этом сложном, но интересном пути.
Мы тут только ради анимация собачки, которая не только следит за вами, но и попытается съесть курсор доверчивого пользователя. Сразу представил тут голову Бориса Биокадовского.

3. https://myriad.video - агентство видео-продакшена Myriad, которое специализируется на технологиях и работают с клиентам по принципам всесторонней эмпатии, которая и является движущей силой креативности.

4. https://skvot.io/ru/blog/zakony-psikhologii-dlia-dizainera - переведенный на русский язык сайт продуктового-дизайнера Джона Яблонски, где добавлены варианты с его основными идеями и примерами в психологии UX-дизайна.

5. Поиграться и покататься - https://bruno-simon.com

вот и настала моя очередь поделиться ссылочками под утренний кофе.
#trendwatching


1. Тут явно ребята устали от всего и немного решили расслабиться. в итоге получилась "кисленькая" история. Несколько разных нестандартных приемов в одном месте объединенные одной далеко не комм. идеей и собранные в лендинг — все завязано на скролл, что-то точно можно брать, как инспирейшен на проекты. или если тоже от всего устали, то можно им написать и добавить свою лепту в эту колбасу :)

https://iamtired.online/


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

https://www.johnsonbanks.co.uk/


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

https://hhey.studio/

а сегодня у нас #trendwatching от Даши @darimur:

Всем доброе утречко🌝

Конеечно же, всеее всёё видели, наверное. Но посмотреть под утренний кофе все равно приятно. Делюсь интересностями💃🏻

1) https://zajno.com

приятный сайтец с дерзкими пасхалочками, их можно найти не сразу, поэтому подсказка: нужно долистать на главной до руки с рыбой и удержать кнопочку "Keep away" и сайт заиграет новыми красками)

2) https://nathan.tokyo

маленький рай спецэффектов по ховеру на позалипать)

3) Так как у нашего отдела особая любовь к сайтам с бутылочками и банками, то не смогла пройти мимо милейшего сайта про пиво:

https://lowfivebrewing.com/

4) а вот тут не про красоту, а про спецпроекты и идейки для них. Сайт с пиньятой в виде Ковида) он ведь действительно нам всем надоел и так приятно его попинать и порассматривать конфетти потом.

https://covidpinata.ooo

5) Ну и напоследочек. Сайт-игра, она уже тоже мелькала в нашем инфополе. Но она прекрасна механикой, что помимо сайта на десктопе, вы можете играть вдвоем пройдя по QR-кодам со своих телефонов. Играть против друг друга и смотреть на десктопе, превратив ваши телефоны в джойстики. Однажды мы со вторым проджектом (Катей Граф) залипли в эту игру и играли в нее, расшарив экран в Зуме)) такова онлайн жизнь🤷‍♀️🌚

https://crumbskees.com/

Всем нежного дня❤️

Пока в Калифорнии компании обязывают убрать из флоу темные паттерны, можно почитать о том, как они работают в принципе во всем известных приложениях


а бонусом можно почитать про лучшие практики UX в e-com
#ux #research

Всем доброго дня! Очередная порция интересных местечек для #trendwatching. В этот раз от Ильи :)

1. bermat.it — Производитель двухместных спортивных автомобилей, полностью настраиваемых онлайн по дизайну и характеристикам.
Хочется верить, что они действительно выйдут на рынок с таким интересным продуктом.
Сам сайтец нравится своей динамикой, простыми решениями, завёрнутыми в обёртку интересных анимаций.

2. fledge.tv — Студия, которая занимается производством короткометражных фильмов и видео.
Здесь создаётся впечатление, что шагая от страницы к странице - будто у тебя не фиксированное разрешение окна, а где-то 10000 рх в каждую сторону)))
Плюс интересная шрифтовая пара (не для частого использования, но как вариант)

3. fabricofthenation.com — Проект, который если вы не видели, то точно задержитесь здесь на некоторое время.
В данном проекте можно записать и поделиться своими голосами, увидеть и услышать чужие записи.
Я не могу выделить здесь что-то конкретное. Даже прелоадер какой-то особенный)) Тут просто с какой стороны не посмотреть — всё замечательно спроектировано)) Спасибо создателям))

Эстафету желаю передать @ama1endu или @Natalia_Katerova ,если конечно есть желание поделиться своими наблюдениями и закладочками)
Если же нет, то будем рады посмотреть очередную порцию от @trvrc ☺️

понедельничная подборочка от Артура @ama1endu по #trendwatching

Дорогие, сорри, что припозднился. Трэндвотчинг в студию))

1. Обожаю, когда дизайнер черпает вдохновение из внешнего мира и переносит опыт взаимодействия в цифровую среду. Наслаждаемся эстетикой 60-х, перебираем пластинки и слушаем.
https://music.zajno.com/

2. Не смотря на то, что он уже был тут(да-да я слежу за чатиком😅), я не смог пройти мимо портфолио лондонского архитектурного бюро. Минимализм, ломаная сетка, приятные анимации. Конечно же красивые проекты в духе Йозефа Эйхлера.
https://prb-a.com/

3. Платформа для разработки и внедрения программного обеспечения для промышленных роботов. Классные трехмерные анимации, говорящие просто о сложном. Как вы относитесь к разрядке строчных букв?🤪
https://rtr.ai/

4. Голливудское агентство, помогающее людям с профориентацией и поиском себя. Лендинг яркий, с приятными цветами и анимацией. Чувствуется теплота и забота. Надпись на главном экране гласит «Оставь свой след в этом мире» и на месте курсора появляются отметки.
https://platform-seven.com/

Всё о interactive components в Figma

Подборочка интересных статей от Ветрова #research #ux

Usethics: юзабилити-тестирование через клик-тесты скриншотов интерфейса.

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

предостерегают от использования в опросах слов вроде «всегда» (преувеличение), «могли бы» (сложно определить грани) или «вы» (непонятно, речь о респонденте или, например, его семье).

простые и чёткие формулировки вопросов при проведении опросов.

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

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

ля-я-я, вы щас умрете, смотрите, что есть: https://designtools.club/ — сборник инструментов дизайна и не только в одном месте. но пользоваться, конечно, этим не будем) #ux #tools

отличная подборочка от Наташи @Natalia_Katerova
#trendwatching отдельный лайк за финальную историю про пасхалку)

Всем привет!
Врываюсь к вам со своей подборкой. Я не дизайнер, поэтому смотрю под своим углом и с разных сторон. Надеюсь, что что-то интересное и то, что ещё не видели будет в списке)

1. https://www.callbruno.com/en/culture - здесь сильно нравится история с горизонтальным скролом. Я часто встречаю сейчас это в трендах. Мне кажется, что такой прием хорошо ложится на модную историю сторителинга. Хочется попробовать данный прием где-то реализовать. По идее планируем его на одном из разделов для сайта агентства SETTERS.

2. https://leonard.agency/en/contact - нравятся цвета, типографика и графика, приятный сайт.

3. https://www.fixnothing.com/ - нравится история с тем как показали персонажей и элементы некой геймификации, вовлекает пользователя.

4. https://vedro2-0.tilda.ws/ - после этого копирайтинга я захотела купить себе ведро. Мы только сейчас начинаем встраивать UX-копирайтинг в отделе WEB SE и вообще больше обращать внимание на тексты. Поэтому не могла пройти мимо.

5. https://polka.academy/ - нравится прием с полкой книг: удобный и приятный для пролистывания. На мой взгляд залипательный, но при этом функциональный блок получился у ребят. Очень нравится типографика, выдержана в стилистике направления.

6. https://universalfavourite.com.au/ - этот сайт нашла не я, его нам закидывал Дима Швец, но мне очень понравился и запомнился. Разные графичные ховеры запали в душу.
Интересная идея с навигацией вверху, супер просто и очень понятно. Вот наши работы, а вот о нашей студии. Очень нравится форма для связи с контактами в левом нижнем углу, такая дружественная и логичная.

А щас небольшой прикол прошлой недели из WEB SE)
В последнем кейсе один из ховеров - это глазик. И тут я вспомнила интересный инсайт из нашей веб-аналитики с отделом маркетинга.

В метрике на одном из наших лендосов мы обнаружили, что люди протерли до дыр один из графических элементов дизайна - это стикер с глазом!
Вот этот лендос, стикер глаза на первом экране в правом нижнем углу: https://setters.education/courses/vizualiziruj-i-prezentuj
Мы решили, если делать дальше такой стикер, то спрятать за ним пасхалки) людей влекут глаза)

Всем хорошего дня)