В статье я дам несколько простых UI/UX микросоветов, которые помогут быстро усовершенствовать ваш дизайн.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/648c1503f11a9cf965b71d64_648c14ba78c037ab8e370915_1%20(1).webp)
Если вы умеете создавать эффективные, доступные и красивые пользовательские интерфейсы, требуются лишь самые незначительные доработки, чтобы сделать дизайн еще лучше.
Здесь вы найдете советы, которые помогут без особых усилий усовершенствовать не только дизайн, но и опыт взаимодействия.
Давайте же начнем!
1. Принцип близости — ключевой принцип дизайна. Используйте его правильно.
Принцип близости. Один из многих дизайн-принципов, которые помогают нам создавать более эффектные и понятные интерфейсы.
Он гласит, что родственные элементы должны быть размещены рядом. В свою очередь, такое расположение сигнализирует о взаимосвязи между объектами и помогает пользователям быстрее воспринимать информацию в процессе взаимодействия с вашим сайтом или приложением.
Используйте принцип близости регулярно и правильно.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/648c154d4afbd29c4fd8cf86_648c14bbbe88fa270a88bd77_1%20(2).webp)
2. Позаботьтесь о том, чтобы пользователям было легко отличить одни элементы от других
Чтобы взаимодействие человека с интерфейсом было эффективным, важные элементы интерфейса должны отличаться друг от друга.
Возьмем, к примеру, кнопки и уведомления.
Кнопки чаще всего имеют первостепенное значение, поэтому убедитесь, что они наиболее заметны на экране и их не спутаешь с другими компонентами, такими как уведомления.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/648c158569eede515daef32f_648c14bb39700a05b35550d6_1%20(3).webp)
3. Обратите внимание на эти шрифты без засечек — они идеально подойдут как для заголовков, так и для основного текста
Я знаю, что отличный шрифт может мгновенно улучшить дизайн и донести правильное сообщение до пользователей вашего сайта или приложения.
Я много раз применял эти замечательные шрифты без засечек: они одинаково хорошо подходят как для заголовков, так и для основного текста.
Вы можете найти их на сайте fonts.adobe.com.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/648c1614c9222b861d2dcc62_648c14bb2acf21f4e3c0fed9_1%20(4).webp)
4. Обратите внимание на эти шрифты с засечками — они идеально подойдут как для заголовков, так и для основного текста
Как я уже отметил в предыдущем пункте, отличный шрифт — один из ключевых элементов, способных превратить дизайн из среднего в крутой. Моя подборка шрифтов с засечками поможет вам в этом.
Я постоянно использую некоторые из них как для заголовков, так и для длинных текстов и могу от души порекомендовать их вам.
Вы можете найти эти красивые шрифты с засечками на сайте fonts.adobe.com.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/648c160177d4c5d9b6f5f0be_648c14bb5ba5eec896fca38c_1%20(5).webp)
5. Вам нужно быстро найти отличную комбинацию шрифтов? Используйте суперсемейства.
Я уже рассказывал о суперсемействах ранее, но хотел бы упомянуть их еще раз, поскольку они могут стать настоящим спасением, когда нужно быстро найти отличную шрифтовую пару.
Суперсемейства — наборы визуально гармоничных гарнитур шрифтов, как с засечками, так и без, разработанных для совместного использования.
Если вы хотите эффективно комбинировать гарнитуры, не беспокоясь о том, что выбранное сочетание окажется не слишком удачным, суперсемейство — отличная отправная точка для решения этой задачи.
Вы можете найти классные суперсемейства здесь.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/648c16634e568ec4028903af_648c14bb348f0091698e9ecf_1%20(6).webp)
6. Тени: делайте их еле заметными или не делайте вообще
Едва заметные тени могут играть роль эффективных визуальных подсказок.
Помните: в реальном мире тени практически всегда незаметны. Вы должны стремиться воспроизвести этот тип поведения в своих интерфейсах.
Либо делайте тени деликатными, либо не добавляйте их вообще.
![](https://cdn.prod.website-files.com/60a35497ea15cf45782248b1/648c167b87bf7647e3114c2c_648c14ba4f6e6b847cccc7ea_1%20(7).webp)
Я надеюсь, что эти простые советы продемонстрировали вам, как небольшие изменения могут значительно улучшить конечный результат.