Тултип | UX UI
645 subscribers
138 photos
73 videos
1 file
176 links
Буст насмотренности и эффективности в дизайне продукта

Связь @gorba4evgenii
Download Telegram
Refactoring UI| Adam Wathan, Steve Schoger

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

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

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

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

Расскажите в комментах, что последнего читали про дизайн и что можете порекомендовать 🤨

#книги

💬 Тултип
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍125🔥3🕊1
This media is not supported in your browser
VIEW IN TELEGRAM
Персонализация в приложениях

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

Как мы узнали предпочтения пользователей и сделали поиск одежды и обуви удобнее
Старший продуктовый дизайнер Авито, Илья Хлесткин, расскажет про то, как ребята решили упростить пользователям поиск одежды нужного размера и внедрили фичу Мой гардероб.

Разбираем интерфейс сервиса «Гараж» в приложениях авто-классифайдов
Дизайнеры из Noknok провели исследование авто классифайдов (Авто.ру, Дром и Авито.Авто), в котором изучали фичу Мой гараж. Это раздел, где можно добавить свой авто и сервис будет предлагать нужные для вас и вашего железного коня запчасти, расходники и аксессуары.

Напишите в комментах свой пример персонализации в сервисах, который считаете крутым 👍

Всем легкой пятницы 🕺

💬 Тултип
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5
DataPorn — подборка визуализаций, от которых сложно оторваться 😋

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

Сравнение танков в World of Tanks
Здесь собрана умная визуализация, которая позволяет сравнивать танки по самым разным характеристикам — от брони и урона до скорости и уровня пробития. Можно выбирать страну (СССР, Германия, США, Британия), тип техники (лёгкий, средний, тяжёлый танк или ПТ-САУ), уровень — и тут же смотреть, кто из «железяк» на что способен. Например, можно одним взглядом оценить, какой танк наносит больше урона за 10 секунд или у кого башня толще. На танках с помощью цвета показаны более или менее укрепленные места

Диаграмма экспедиций Амундсена и Скотта
Крутая, но трагичная визуализация на таймлайне двух экспедиций к Южному полюсу. Амундсен и Скотт стартовали почти одновременно, но их судьбы оказались диаметрально разными: один вернулся с победой, второй — погиб с командой. Это проект Бюро Артёма Горбунова, где вместо карты — временная диаграмма, показывающая путь экспедиций по дням. Амундсен — чёткое планирование, собаки, склады, успех. Скотт — мотосани, лошади, нехватка подготовки и трагедия всего в 18 км от спасения. Это не просто график, а рассказ о смелости, ошибках и цене решений, изложенный языком данных.

Карта землятрясений с 1898 года
Это визуализация под названием «Earthquakes since 1898», созданная Джоном Нельсоном из IDV Solutions. На ней отображены все землетрясения магнитудой 4.0 и выше, зарегистрированные с 1898 года. Каждый светящийся след — это толчок, а чем ярче точка, тем мощнее было землетрясение. Благодаря визуализации становится чётко видно, где проходят границы литосферных плит — особенно отчётливо это прослеживается в районе Тихоокеанского «Огненного кольца». Вся карта буквально светится линиями сейсмической активности, и они точно повторяют очертания тектонических границ.

Голы и явные голевые моменты чемпионатов Европы
14–15

Это крутая интерактивная визуализация от «Лаборатории данных», посвящённая футбольному сезону 2014–2015 (еще есть 15–16, но он неполный по моему). Тут можно увидеть все голы и яркие моменты прямо на поле — с точками ударов, траекториями мячей и, конечно, исходами эпизодов.
Можно фильтровать по матчам, командам, игрокам, а также выбирать типы моментов. Для фанатов футбола и тех, кто обожает разбирать игру, это топ

Все шайбы Александра Овечкина
Ну и самая хайповая визуализация в подборке. Посвящена она голам Александра Овечкина в НХЛ. Здесь у нас все заброшенные шайбы, включая точные места на площадке, типы голов и даже исходы матчей. Можно фильтровать информацию по сезонам, противникам и типам голов, а также отслеживать, как хокеист побил рекорда Уэйна Гретцки


💬 Тултип
Please open Telegram to view this post
VIEW IN TELEGRAM
3🔥1
1000+ бесплатных иллюстраций для твоих проектов

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

designs.ai
freeillustrations
opendoodles
storyset
undraw
pixeltrue (нет бесплатных, но есть большие паки за $1–2)


💬 Тултип
Please open Telegram to view this post
VIEW IN TELEGRAM
2🔥1🤝1
Slate — самый дешевый и полностью кастомизируемый электропикап из США

Американский стартап Slate Auto, за спиной которого (скорее всего) стоит сам Джефф Безос, врывается на рынок с моделью Slate Truck — и делает это громко. За цену в $20 000 они предлагают электропикап, который можно назвать самым доступным в мире.

Что у нас в меню за такую цену?
Если кратко — никакой роскоши: пластиковый неокрашенный кузов, ручные стеклоподъёмники, два сиденья и механические крутилки вместо сенсоров. Даже аудиосистему выкинули — всё ради доступности.

А если я хочу немного больше, чем в уазике?
Slate не просто удешевил свой пикап до предела — они построили вокруг него целую экосистему допов. Базовый Slate будет доступен в нескольких стартовых комплектациях, а дальше — больше: более 100 аксессуаров на любой вкус. Кастомизировать можно, что угодно — цвет авто, кузов, стереосистему, фары и даже наклеить спортивные полоски и добавить бейджики. Цвет авто можно менять в любой момент, так как тачка не краситься, а оклеивается пленкой. Стоит это удовольствие будет от $500

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

Что напрягает?
Цена в 20 штук баксов выглядит привлекательно для такого свежего зумермобиля, но за эту цену мы получим голый авто на который нужно будет навесить еще кучу допов на которые придется раскошелиться. Также у авто меленький запас хода — всего 240 км, а значит при ежедневной езде заряжать ее придется раза 1–2 в неделю.

Запуск ожидается в 2026, так что следим за развитием событий 👁


Смотреть сайт ▶️


💬 Тултип
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👀6👍4🤯1
This media is not supported in your browser
VIEW IN TELEGRAM
Ультимативная подборка ИИ для дизайнера

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

Изображения
krea.ai — генерация изображений в реальном времени с фокусом на контроль стиля и качества

midjourney (VPN) — генератор артов с художественным уклоном, даёт кинематографичные, атмосферные результаты

fooocus — локальный генератор на основе Stable Diffusion с простым интерфейсом и высоким качеством

comfy ui — модульный интерфейс для Stable Diffusion, гибкий для продвинутых пользователей

visualelectric — генерация визуалов с упором на редактуру и коллаборацию в команде

weights.gg — галерея и подборка моделей (weights) для Stable Diffusion, удобно искать стили

ideogram — генерация изображений с корректным текстом, уникальна поддержкой надписей

recraft (VPN) — рисует векторы, умеет делать паки картинок в единой стилистике. Проект из Лондона, но корнями из России

freepik ai — генератор в стиле стоковых иллюстраций, интеграция с ресурсом Freepik.

adobe firefly (VPN) — от Adobe, поддержка генерации по стилям бренда, встроена в Photoshop/Illustrator

dall-e 3 (VPN) — генератор от OpenAI, хорошо справляется с подробным промптингом и вставкой текста

magnific — AI-суперрезолвер: улучшает детализацию изображений

topaz gigapixel — апскейлер фотографий и артов с сохранением чёткости и текстур


Видео
hailuoai — китайская платформа, делает фотореалистичное видео из текста


runway — один из лидеров генерации и редактирования видео, удобен для креативных проектов


kling — свежая модель от китайского ByteDance, реалистичные и стабильные видео


Hunyuan Video — видеогенерация от Tencent, делает плавные, качественные ролики


luma labs — превращает видео и фото в 3D сцены, особенно полезно для продакшн-визуализаций


vidu — китайский аналог Sora, быстрый, точный и с глубоким контролем сюжета


sora (VPN) — модель от OpenAI (ожидается публичный релиз), обещает кинематографичную генерацию видео


ltx.studio — платформа от Runway для создания целых сцен и раскадровок с кастомизацией


pika.art — генерация коротких видео, активно развивается, фокус на стиле


heygen — видео-аватары и синтез речи, удобно для презентаций и инфовидео


Текст
deepseek — мощный LLM с точной генерацией кода и технических описаний

chatgpt (VPN)— универсальный ассистент на основе GPT-4, подойдёт для промптов, идей и текстов

mistral.ai — опенсорсная альтернатива, быстрая и лёгкая, подходит для локального использования

qwenlm.ai — китайская модель с хорошей логикой, используется в продуктах Alibaba

perplexity.ai — поисковик с ИИ, отлично подбирает источники и кратко отвечает на вопросы

claude ai (VPN) — ассистент от Anthropic, силён в логике и работе с большими документами, мастхэв для копирайтинга


Веб
relume — генератор лендингов и UI на основе текстового запроса, быстро создаёт сайты

framer — визуальный редактор с поддержкой генерации дизайна и кода; хорошо для прототипов

replit — cреда совместной разработки; включает ИИ-ассистентов для веб-разработки

cursor— продвинутый AI-код-редактор, интегрируется с репозиториями и помогает писать сложный код


3D
hyper3d.ai — превращает 2D-изображения в 3D-модели с текстурами

meshy — генерация 3D-моделей из текста, фокус на быстроте и качестве

tripo ai — генерация простых 3D-объектов, удобно для геймдевов и AR

hunyuan 3d — модель от Tencent для создания 3D-сцен и персонажей по описанию


Аудио
suno — генерация песен из текста, включая вокал и инструменты.

elevenlabs (VPN) — синтез речи высокого качества, поддержка эмоций и множества голосов

udio — конкурирует с Suno, фокус на креативной генерации музыки

adobe podcast — улучшение звука, подавление шумов, автоматическое выравнивание громкости

descript — монтаж аудио и видео через текст, идеален для подкастеров и видеообзорщиков

Каких еще сеток не хватает в этом списке для обретения полного дзена? 🧘‍♀️

💬 Тултип
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥73👍3😍1
OZON — как поменялась главная страница за 25 лет

На выходных я решил покопаться в архивах, а конкрентно на сайте webarchive. Там собраны слепки сайтов из различных временных промежутков. Мне стало интересно, как развивались и менялись гиганты индустрии. Первым в очереди стал Озон. Он был одним из самых интересных кандидатов так как существует он с 90-х годов и там точно есть, что посмотреть.
Я собрал скрины главной страницы с разницей в пятилетку, так как решил, что за такой промежуток точно должны были происходить кардинальные преобразования. Можете посмотреть сами и поискать отличия, а для тех кому лень напишу небольшой саммари

2000
Озон позиционирует себя исключительно как магазин книг, журналов и видеокассет. На главной реклама видеосерии про классическую музыку. Самое интересное, что уже тогда Озон задумывался о персонализации — на сайте можно поменять цветовую палитру, настроить шрифты и отключить графику. Внизу главной страницы новостная лента, а один из способов оплаты заказа — телеграфный перевод

2005
Меняется логотип, подсвечивается возможность заказа по телефону. Также появляется кнопка для расширения поискового поля. Скорее всего это первые попытки к расширенной поисковой выдаче

2010
Добавляются персональные рекомендации, ссылка на твитер и система баллов. В продаже теперь есть электроника, антиквариат, билеты на концерты, путешествия и модный бутик

2015
Опять меняется логотип, теперь в нем разноцветные кружки. Множество новых категорий товаров теперь раскрываются в мегаменю, появилось мобильное приложение. Теперь можно стать премиальным клиентом оформив подписку Ozon status

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

2025
Поздравляю, вы в настоящем

Ставьте 👍, если было интересно и пишите, кого хотели бы увидеть в следующем разборе

💬 Тултип
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍19🔥65