Каждый начинает свой путьв дизайнекак новичок, и ваш эстетический вкус нужно тренировать, как и все остальное. Просмотр дизайнов на Dribbble может быть чрезвычайно полезным, но иногда вам просто нравится дизайн, и вы не понимаете, почему.
Нет идей. Плохие активы для работы. Понятия не имею, что проектировать. Все эти причины могут замедлить и расстроить вас, поэтому сейчас мы покажем вам 10 чрезвычайно простых дизайнерских приемов, которые не требуют особых навыков, а также способы улучшить ваши неудачные проекты.
Помните, что это не правила, а уловки, которые в большинстве случаев работают.
10) Выберете черно-белый дизайн
Нет идей? Нет хороших изображений? Просто сделайте дизайн черно-белым. С правильной композицией можно получить брутальный дизайн. Это поможет вам понять балансировку, пустое пространство и то, как использовать тексты и геометрию.
Давайте посмотрим на быстрый пример.
Простой, но эффективный.
9) Создайте «схему баланса»
Это черно-белая версия концепции, в которой можно использовать простые геометрические фигуры для замены контента.
Цель состоит в том, чтобы добиться одинакового количества черного как слева, так и справа, сверху и снизу. Если вы примените этот принцип к простому портфолио, вы получите что-то вроде этого:
Замена предметов черным прямоугольником.
Очевидно, нужно смотреть на глаз, но давайте посмотрим некоторые расчеты.
Черные прямоугольники в левой области составляют около
(236 * 138) + (934 * 132) + (313 * 69) + (674 * 44) = 207109 пикселей
В то время как большой правый прямоугольник:
446 x 446 = 198916 пикселей.
Они отличаются небольшой разницей: 3,9558%!
Примечание: да, чернильное пятно меньше прямоугольника, но его резкость и детализация привлекают больше внимания.
После многих лет практики это просчитывается автоматически, так как ваш глаз будет чувствовать неправильный баланс.
8) Представьте дизайн с фоном
Пример ранее представлен на сером фоне, но вы можете попробовать разные вещи. Это помогает придатьвашему дизайну некоторую глубину и контекст.
Но будьте осторожны: на реальном веб-сайте у вас не будет лишнего места, так что это всего лишь презентационный трюк!
Кофейные зерна придают глубину и контекст.
7) Используйте рекомендации по размерам
Хватит тратить время на эксперименты с размерами весь день. В конце концов, ваши абзацы будут иметь размер 14–18 пунктов, ваши субтитры — немного больше (24–36), а ваши заголовки — даже больше (от 96 до 144 пунктов). Размеры Figma по умолчанию очень хороши для типографики.
Они будут выглядеть слишком маленькими, но это нормально: вы не работаете в полноэкранном режиме.
Будьте осторожны: некоторые шрифты намного меньше или больше других. Вам следует использовать стандартные шрифты,такие как Roboto: если шрифт большой, как Roboto 14–18 пунктов, он идеально подходит для абзацев.
Абзац: 18, Навбар: 24, Заголовок 96.
6) Используйте Z-Index
Если у вас есть изображения с прозрачностью, вы можете использовать их для создания слоев. Если у вас их нет, вы можете использовать remove.bg
В качестве Z-индекса в CSS вы можете расположить изображение позади или впереди других элементов, создавая иллюзию трехмерности. Это очень эффективно.
Давайте посмотрим на один из простых дизайнов, в котором использовали эту технику.
Тукан, кажется, находится в зеленой зоне, но заходит в желтую.
5) Начните использовать пастельные тона
Яркие цвета прекрасны, но часто приводят к агрессивному дизайну и ужасным сочетаниям. Кроме того, пастельный дизайн в наши дни чрезвычайно моден, поэтому давайте начнем экспериментировать с новой областью нашей палитры цветов.
Красный прямоугольник содержит много интересных цветов.
Оба могут работать в правильном контексте, и это дело вкуса. Но если вы хотите сделать что-то другое, попробуйте пастель.
4) Сделайте так, чтобы дизайн дышал.
На наш взгляд, слишком много пустого пространства лучше, чем слишком мало. Загроможденный дизайн просто отстой. Дыхание можно получить разными способами:
- Держите тонны фона на виду.
- Избегайте эффекта стены текста с интервалом.
- Используйте изображения, которые не привлекают слишком много внимания.
- Сокращайте текст до смысла и сохраняйте запоминающиеся фразы.
Большое количество пустого пространства (в данном случае черного) очень помогает.
3) Откройте для себя силу шума
Часто, когда мы думаем о дизайне, мы думаем о таких понятиях, как чистый, гладкий, ясный. Но совершенство кроется в недостатках.
Шум — сильный друг в вашем дизайне, особенно если вы пытаетесь придать своему сайту элегантный или художественный вид.
Кроме того, применение легкого шума придает вашей композиции кинематографический вид, что очень хорошо работает с видео и динамическими веб-сайтами.
Вы можете получить текстуру шума, используя Photoshop и создавая гауссовский шум 2–4K на белом фоне, а затем применяя его поверх монтажной области.
Тонкий шум создает впечатление бумажного фона. Портрет Джессики Фелисио.
2) Начните искать хорошие шрифты
Очень много ужасных шрифтов, особенно тех, которые предустановлены на наших компьютерах. Чтобы найти хорошие, начните серфить в Интернете или посмотрите видеона YouTube,чтобы узнать о замечательных гарнитурах и шрифтах.
Но будьте осторожны: многие шрифты не бесплатны, и их использование без лицензии может привести к неприятностям. Не волнуйтесь: у большинства шрифтов есть бесплатная версия!
Существует множество различных семейств и стилей, но в целом мы делим их на три основные категории:
- Элегантные шрифты
- Современные шрифты
- Гарнитуры для основного текста
Часто первые два также являются отображаемыми шрифтами: их создатель хотел, чтобы вы использовали их в качестве заголовков.
Вы можете искать элегантные шрифты, такие как Abril Fatface, Playfair Display, Volux, Chalga и многие другие.
Современные шрифты включают Metropolis, ITC Avant Garde, Redwing, Takota, Gotham….
1) Используйте геометрию
Это, вероятно, самый сложный трюк в использовании, но при правильном применении он просто великолепен.
Использование геометрических фигур помогает закрепить концепции и порядок в макете, даже не требуя изображений. Найти правильную геометрическую форму сложно.
Один большой трюк — использовать буквы, числа и заголовки в качестве геометрии: сделать их гигантскими, но тонкимиили использовать какие-то буквы в качестве фигур (буква А отлично работает).
Буква А в этом описании приложения сработала идеально.
0 комментариев