Принципы хорошего дизайна можеть и спользовать любой человек. (и практические советы по дизайния, которые сразайну, которые сразу сможете применить (и произвести впечатление на друзей-дизайнеров).
Содержание
1. Используйте больше контраста
2. Почти черный воспринимается лучше черного
3. Важный контент - в начало
4. Выравнивайте все
5. Больше воздуха в тексте
6. Используйте список, чтобы показать результаты, если важен порядок
7. Сначала проектируйте черно-белый вариант, цвет добавите позже
8. Создавайте комфортный дизайн
9.
10. Используйте ресурсы Apple и Google
1. Используйте больше контраста
2. Почти черный воспринимается лучше черного
3. Важный контент - в начало
4. Выравнивайте все
5. Больше воздуха в тексте
6. Используйте список, чтобы показать результаты, если важен порядок
7. Сначала проектируйте черно-белый вариант, цвет добавите позже
8. Создавайте комфортный дизайн
9.
10. Используйте ресурсы Apple и Google
просто научиться дизайну, вспомните, что скал вокалист Foo Fighters про обучение что сказал вокалист Foo Fighters про обучение чему-то новому :
Дэйв Грол
Nirvana, Foo Fighters
Я никогда не брал уроки игры на барабанах. Я никогда не посещал занятия по игре на гитаре. Я просто дошел до всего сам. кажется, если вам что-то нравится, вы мотивированы и сфокусированы на том, чего хотите достичь, тогда вы можете сделать что угодно в своей жизни.
Le système d'information de l'Union européenne (UEI) a été mis en place par la Commission européenne. Ну как, готовы к интенсиву ? Все правила, советы и рекомендации ниже приведены без какого-то определенного порядка.
1. Используйте больше контраста
должны быть достаточно контрастными, чтобы не вызывать напряжение в глазах. Наболее разборчивым сочетанием считается черный текст на белом фоне. подальше от светло-серого, желтого и зеленого цветов для шрифта. Имейте в иду : если вы щуритесь, чтобы прочитать текст - это проблема.
Источник изображения : developer.apple.com/design/tips
Маша Белая
дизайнер Tilda Publishing
контраста применим не только к цвету шрифта, но и к его размеру. Например, если размер шрифта заголовка будет мало отличаться от размера шрифта подзаголовка, это больше приведет к ощущению неакуратности, чем к понимаю важного и второстепенного.
2. Почти черный воспринимается лучше черного
попробуйте использовать для шрифта цвет #333 333 RGB (51,51,51) вместо чисто черного. белом фоне немного рябит в глазах, в итоге на буквах сложно сфокусироваться.
3. Важный контент - в начало
создании дизайна расположите самую главную информацию в самом начале, чтобы сразу обозначить цель вашего сайта или приложения. Пользователю должно быть все понятно без зума, прокрутки или кликов.
Источник изображения : developer.apple.com/design/tips
Instagram* посмотрио, которое запостил пользов хорошей иерархии.
Pinterest создает визуальную, закрепля строку поиска в верхней части страницы, уже ниже идет симпатичная сетка скартинками. Pinterest намеренно располагает строку поиска наверху - это самая первая вещь, которую видит пользователь.
Поиск - главная функция сервиса, ведь люди используют Pinterest, чтобы узнавать новое и просматривать результаты.
два посмотрим еще на два примера хорошей иерархи в дизайне.
Spotify явно уделяет много внимания обложкам групп, а также сначала показывает название песни и потом, чуть ниже, панель управления. даже здесь - в панели управления - есть своя иерархия. Кнопка воспроизведения и паузы выделяются на фоне перемотки назад и вперед.
Facebook* использует ту же тактику, что и Instagram* - он показывает контент от ваших друзей посередине и на весь экран.
Spotify явно уделяет много внимания обложкам групп, а также сначала показывает название песни и потом, чуть ниже, панель управления. даже здесь - в панели управления - есть своя иерархия. Кнопка воспроизведения и паузы выделяются на фоне перемотки назад и вперед.
Facebook* использует ту же тактику, что и Instagram* - он показывает контент от ваших друзей посередине и на весь экран.
Маша Белая
дизайнер Tilda Publishing
Le système d'information sur la santé est un outil de gestion de l'information. Пусть все заголовки одного уровня будут одинакового размера, а принцип подачи схожих элементов не будет отличаться. Пользователю будет сложно ориентироваться на сайте, у которого все время менятся иерархия.
4. Выравнивайте все
Самый быстрый способ поправить то, что плохо выглядит на сайте и сделать дизайн лучше - убедиться, что у вас все выровнено. Когда дизайнеры говорят о необходимости использовать "сетку", они пытаются предупредить команду о проблеме с выравниванием.
быстрых улучшений - дизайне, которойе применимо к любому приложени44E↩ или сайту. Выглядеть все будет сразу в 10 раз лучше.
Источник изображения : developer.apple.com/design/tips
вйте посмотрим на другой пример выравнивания, на этот раз с Medium.com. Medium.com - как он вам, которы я позаимствол с Medium.com - как он вам ? У вас нет ощущения, что в нем что-то не так ?
обратите внимание, как выровнен текст по левому краю.
Ниже слева я отметил "визуальную реку" - все изгибы, которые получились из-за неправаль реку" - все изгибы, которые получились из-за неправильного выравнивания. Справа я просто сдвинул главные блоки к левому краю.
Ниже слева я отметил "визуальную реку" - все изгибы, которые получились из-за неправаль реку" - все изгибы, которые получились из-за неправильного выравнивания. Справа я просто сдвинул главные блоки к левому краю.
слева создает эфект реки, справа выравнивание боле устойчивое.
Слева плохое выравнивание, справа - исправленный вариант.
5. Больше воздуха в тексте
Мы создаем сайты не для муравьев.
и межстрочное расстояние, текст на сайте будет намного легче читать.
Les services de l'État et les services de l'administration publique ont été mis en place pour répondre aux besoins de la population. Источник изображения : developer.apple.com/design/tips
расстояние и плохое. Источник изображения : developer.apple.com/design/tips
6. Используйте список, чтобы показать результаты, если важен порядок
Большинство мобильных приложений и сайтов имеют поиск в каком-либо виде, и тут в дизайне всегда много споров - каким образом лучше отобразить результаты.
в поисковой выдаче важна иерархия, самым эффективным решением будет список.
Если порядок не так важен, и вы хотите вдохновлять людей узнавать больше (как Pinterest или AirBnB), то выдача результатов виде сетки лучше воспринимается глазом и мотивирует искать еще.
Les deux sont en train de s'entendre sur un plan d'action. Исследование C. Siu и B. Chaparro.
7. Сначала проектируйте черно-белый вариант, цвет добавите позже
Когда вы создаете дизайн в черно-белом виде, вы концентрируетесь на решени проблем и проектировании продукта, с которым будет взамиодействовать пользователь.
эмоциональную реакцию и часто мешает нашей способности фокусироваться на проблемах дизайна.
8. Создавайте комфортный дизайн
(то есть, почти у руку у пользователей смартфонов (то есть, почти у всех людей) - реальная проблема. Взгляните на графику из стать Люка Вроблевски ниже.
куда легко добраться пальцу и куда - по кражно - по крайней мере для правши. Кстати, мне очень нравятся приложения, где вы можете переключать интерфейс для праворуких и леворуких.
Многие популярные мобильные приложения ставят навигацию и главные функции в нижней трети телефона.
Многие популярные мобильные приложения ставят навигацию и главные функции в нижней трети телефона.
Источник изображения : статья Responsive Navigation : Optimiser la navigation tactile sur tous les appareils
9. Заимствуйте цветовые палитрые
Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État - Les services de l'État. Я очень рекомендую зайти на Dribbble и поискать там цветовые палитры. Или использовать генераторы палитр, например, Coolors или Color Claim.
свое время от бесконечных дискуссий и угадывания вслепую.
10. Используйте ресурсы Apple и Google
Apple и Google создали невероятное количество ресурсов для всех, кто создает программное обеспечение на Android или iOS.
в Google Material есть гайдлайны, ресурсы, цвета, иконки и другие элементы дизайна, которые помогут вам создать приложение. Apple есть их Human Interface Guidelines, в котором собрана вся информация о том, что вам нужно знать при создании приложения на iOS.
Яна Плющева
дизайнер Tilda Publishing
Le système d'information de l'Union européenne (UEI) a été mis en place par le Conseil de l'Europe. Простые, как рецепт блинчиков. прочтения будет полезно зайти на сайты, где собирают примеры хороших проектов, и постараться проанализировать их, используя новые знания. на Awwwards, Siiimple или Land-book можно посмотреть, как используется белое пространство, типографика и цвета.
Поставьте себя на место пользователя. сайте и понять, что вы предлагаете. Порой лучше воспринимается чистая белая страница с четкой иерархией текстов (как документ в Google docs), чем множество цветных фонов и обилие акцентов.
Поставьте себя на место пользователя. сайте и понять, что вы предлагаете. Порой лучше воспринимается чистая белая страница с четкой иерархией текстов (как документ в Google docs), чем множество цветных фонов и обилие акцентов.
Помните : дизайн - это практика
глаз и научиться видеть спорные моменты в дизайне, нужно в дизайне, нужно время и практика. пройдут с вами долгий путь и помогут сделать дизайн сделать дазайн вашего сайта или приложения лучше.
Le projet est en cours d'élaboration : Марк Хемеон, Design Inc
Перевод : Варя Гурова
Иллюстрации, дизайн и верстка : Юлия Засс
Перевод : Варя Гурова
Иллюстрации, дизайн и верстка : Юлия Засс
расли материал вам понравился, расскажите о нем друзьям. Спасибо !
*Компания Meta Platforms Inc., владеющая социальными сетями Facebook и Instagram, по решению суда от 21.03.2022 призна экстремистской организацией, е деятельность на территории России запрещена.
Читайте также :
