Плaгин Higherframer — позволяет превратить детализированные экраны в вайрфреймы одним кликом! Выберите экран, настройте параметры — и готово.
Handmade Wireframe Kit
UI Kit с базовыми формами и компонентами в скетчевом стиле, чтобы быстро собирать симпатичные вайрфреймы. Пригодится и на старте проекта, и для оформления в портфолио)
#прочее
Людочка, дизайн – ресурсы для дизайнеров
Немного больше ниже:
⠀
Во-первых, мы все путаем вайрфрейм и прототип. Прототип - это КЛИКАБЕЛЬНЫЙ макет дизайна сайта, в нем есть интерактивность (в отличии от вайрфрейма, который показывает структуру блоков). Не перепутай!
⠀
Кернинг от трекинга отличается тем, что в первом регулируется расстояние между определенными символами в тексте, а во втором - между всеми одинаково.
⠀
Чекбокс позволяет выбрать один или несколько объектов сразу, или не выбирать вообще, в радиокнопка - только один и никак иначе.
⠀
В типографике много своих терминов:
⠀
асцендер - часть буквы, которая выходит за верхнюю границу высоты строчных букв, например, буква "h"
десцендер - за нижнюю, например буква "р"
⠀
В дизайне много умных слов, но ты привыкаешь к ним и используешь каждый день. А какие слова ежедневно используешь ты и никто тебя не понимает?
Продуктовая страница. 2025
Сегодня приступаем к новой задаче — разработка продуктовой страницы.
01
Мой бенч — сайт эпл. Следуя за лучшим всегда получаешь хороший результат. По этому, для практик выбираем аналог. Что актуально в рынке у нас? Где есть открытые вакансии дизайнеров? Что можно полжить в портфолио и постучть с таким кейсом в работодателя?
02
СберДивайсы, Умные колонки от Яндекс, продукты ВК и mail. Колонки, капсулы, часы, телевизоры, умный дом. Умный дизайнер идет туда, где тренд.
03
Выбираем продукт, например — колонку SberBoоster и делаем для нее лимитную серию. Поводов полно: версия Pro или лайт, дополнительная функция или ограниченный цвет, серия городов или для дня города, рождения, себя или компании. Выбрав продукт и тему уникализации можно создавать лендинг, который представит продукт во всей красе.
04
Фреймворк вот:
1. Фич-лист
2. Сторителлинг
3. Контент (структура)
4. Рефы для варфрейма
5. Варфрейм
6. Рефы для дизайна
7. Дизайн-концепт (итерация 1)
8. Дизайн доработка (итерация 2)
9. Финализация
10. Секретный ингридиент
05
Профессиональный дизайнер в 2025 году для первых трех пунктов использует нейронки. Работу с рефами мы уже проходили и знаем как их искать быстро. Вайрфрейм, об этом расскажу подробнее. Концепт дизайна в первой итерации делаем по выбранным референсам. Всё как всегда просто.
06
Буду делиться ходом работы здесь. Вместе с Оксаной делаем крутую продуктовую страницу для дизайнеров.
А как вы создаёте лендинги? Какой фрейм или план используете? Когда подключаете нейросети? Делитесь в комментариях)
