Гайдлайны Google Material и Apple Human Interface. Android, iOS и Material You.
ฝัง
- เผยแพร่เมื่อ 11 ก.ค. 2024
- В этом видео мы поговорим о гайдлайнах Google Material Design и Apple Human Interface (iOS). Разберемся, что это такое, зачем нужны, и как их использовать в работе. Также рассмотрим некоторые частые заблуждения относительно гайдлайнов. пройдём по основным разделам Material Design, затронем тему кросс-платформенной адаптации и обсудим новый Material You.
00:00 - Что такое гайдлайны и для чего нужны
14:42 - Гайдлайны как ценный обучающий материал
16:03 - Material Design Components
18:44 - Базовые принципы Material design
23:08 - Система отступов Material design
29:29 - Навигация в Material design
31:17 - Цвет
33:54 - Типографика
38:19 - Иконки
41:54 - Motion
44:22 - Состояния элементов (States)
45:35 - Кросс-платформенная адаптация
49:13 - Human interface guidelines
54:34 - Material You
Подписывайтесь на соцсети:
Телеграм: t.me/uiux_dsgn
Инста: / disarto.digital
Behance: www.behance.net/Dexo
Dribbble: dribbble.com/Dexo
Спасибо большое. Информативно, понятно и полезно👍
Спасибо за работу и грамотную речь! Очень интересно=)
Легко, понятно, интересно) Благодарю за ваш труд. 🔥
офигенный разбор, посмотрела почти без перерывов )
Большое спасибо за такое видео! Просто находка - максимально полезно и понятно🔥
Максим, спасибо за полезное видео! я уже знаком с гайдлайнами и часто их использую в работе, но в любом случае подчерпнул для себя полезные моменты)
Отличное видео, правда очень забавно слышать "айось" вместо привычного "айос" xD
Айдос
Всё правильно, это старая школа прост :)
ВАУ, ВОТ ЭТО РАЗЛОЖИЛ. ВСЕ НАМНОГО ПОНЯТНЕЕ СТАЛО В МОЕЙ ЖИЗНИ) СПАСИБО
Случайно наткнулась на канал и нашла ответ на свои вопросы в этом видео. Спасибо огромное!
Понятно, грамотно и интересно. Спасибо 😊
Спасибо за обзор!
Ты лучший, классно рассказываешь!!! Большое спасибо за твой труд)
1 раз посмотрела, открыла Material Design и пересмотрела еще раз)) респект за видео
Круто чуввак. Самое интересно было послушать как нарушать эту систему !!!
Супер!
Благодарю за труд и хорошую подачу!
Когда нужно ускоренно пройти материал и вообще его хорошо усвоить - такое видео просто не заменимо.
спасибо за видео, для начального понимания что такое гайдлайны это видео очень кстати!
Очень полезно, честно. Спасибо! Долго сомневался все же как использовать эти UI-киты и прочее. Теперь больше понимания появилось.
спасибо большое за разъяснения по практическому использованию гайдов, а то посмотрела миллион видосов и все говорят одно, поверхностно и без примеров, желаю почаще снимать уроки, у вас хорошо получается, + очень понравились видосы по вариантам и компонентам в фигме
спасибо за видео, посмотрела от начала и до конца, очень понятно и полезно!
Количество полезной информации за конкретное время - просто поражает. Что не видео - подарок новичку. Подача прекрасная. Не понимаю, почему 25к... Я бы совершенно не удивился будь там еще пару нулей, коих я и желаю Вам.
Спасибо! Я рад, что нравится 🙂
Спасибо, это лучшее и самое подробное и понятное видео из тех, что я видела ☺
спасибо за очень полезную информацию и вдохновение дизайнить👍
Спасибо! Хотела узнать ответ на один вопрос, но появились новые вопросы) буду изучать.
Огромнейшее спасибо!
Не знал про Outline stroke... Так мучился!!! Спасибо!!
Спасибо большое за интересный ролик! ❤
Спасибо за ваше видео!))
Я не дизайнер, а разработчик и все равно полезно было все это посмотреть. Спасибо автору!
лучший, спасибо за обзор!)
Спасибо большое!) Лучшее, что видел на русском по гайдам. Внятно, ёмко, коротко. Отдельное спасибо за отсутствие долгого вступления и отбивок. Пора преподавать в Вышке или Британке)
Большое спасибо за видео.
Круто! Спасибо!
Спасибо, это видео дало большой толчок для изучения Material и Human, давно хотел начать, но никак не мог решить с какой стороны взяться. Хотя многие вещи делал правильно интуитивно, видимо насмотренность решает.
Спасибо за отличное и полезное видео
спасибо огромное за видео. наконец кто-то подсказал, с чего начинать и как правильно относится к этим библиотекам
Спасибо тебе огромное! 🤩
Спасибо большое за этот урок
Оочень полезно, спасибо!
Для того, чтобы отступать от правил, нужно эти правила хорошо знать. И понимать почему и для чего реализовано то или иное правило. Тогда - да. Чтобы лучше достичь поставленных целей можно отступать от них. А когда кто-то лепит потому что «я художник, я так вижу» - вот для таких и сделаны гайды.
Храни тебя господь, спасибо. Полезное видео, сняло лишний страх перед неизвестным
Круто. Спасибо.
Спасибо за разбор ;)
Спасибо большое за видео! Колоссальный труд и очень информативный. Если читаешь это сообщение хорошего тебе дня и успехов во всем!)
Спасибо!
Спасибо огромно!
Thanks bro. Love your videos.
Спасибо тебе чувак.
Спасибо что я вас нашла
Годнота
Большое спасибо за такой замечательный обзор и объяснения! Но начинающему в этой области трудно определить насколько можно отходить от этих стандартов в реализации своего дизайна...Надо насматриваться....
Вот блин, было такое заблуждение(( Точнее я думал, что есть некоторые вещи, такие как отступы по краям, размеры баров, иконок, шрифтов, которые нельзя менять (и другим рассказывал об этом, кто в первые начинал делать диз приложений). Радует, что это не ошибка, а просто лишнее и не обязательное самоограничение...эх, ну будем исправляться) Зато помню как разработчик мне сказал, что у него так классно реализовался мой дизайн, ему даже особо ничего адаптивить/править не нужно было, все четко на своих местах, потому что по размерам и отступам я следовал чисто по гайду)
Огромное спасибо за этот видос)
Спасибо ☺️
Отличное видео 👍
Как всегда, очень доступно и полезно.
С наступающим 2022!!!
Спасибо! И вас с наступающим 🎄
Спасибо , очень хорошо донес информацию
Кайф! Спасибо
Прекрасное видео, скажите пожалуйста, где можно подробно узнать о возможности изменения Alert уведомлений? Почему нельзя менять и тд?
Спасибо большое за такое полезное видео!
Здравствуйте! Спасибо за такой полезный разбор! А где можно взять такой UI-Kit? Очень нужен!) Буду очень благодарна за ответ, а лучше ссылочку)
Спасибо за видео! На счет Material You, думаю приложухи сделаные с помощью данного стиля будут иметь в основном развлекательный характер. Для сложных интерфейсов, пока это выглядит слабо.
спасибо огромное за видео, голосовала за него и очень ждала! Ответили на много вопросов которые остались после прохождения платного курса..( к сожалению). Правильно ли я поняла, если мы используем элементы из гайда но немного их кастомизируем ( меняем внутри отступы, шрифт и тд) то это уже не нативное приложение а кастомное?
кастомные элементы скорее, а не приложение
Нативное приложение - это приложение, спроектированное под определенное устройство. Т.е. любое iOS (или Android) приложение будет нативным. В противовес например веб приложению (оно не нативное, т.к. создавалось под веб, а не под iOS, к примеру). Так что qwerty верно заметил, что это элементы кастомные, а не приложение. И да, если вы отходите от гайдлайнов, то элементы становятся кастомными.
@@disarto.digital а если приложение кросс-платформенное, оно ведь не может быть нативным? В таком случае оно тоже кастомное?
@@user-if4qz3cq1e Может 🙂. Нативный переводится как "родной". Кросс-платформенное значит, что приложение сделано сразу под несколько платформ. И версия под каждую платформу является нативной. Это просто разные категории, они не лежат в одной плоскости и не являются взаимоисключающими.
@@user-if4qz3cq1e Может также быть ситуация, когда приложение сделано под iOS и под веб. В таком случае, если вы на Android запускаете веб-версию приложения, то пользуетесь не нативным приложением.
Тоже хочу иметь такой файлик с упорядоченными таким образом элементами.) Подскажите пожалуйста как сделать? А для некоторых элементов все таки нельзя отходить от стандарта?
айось : )
Максим, привет. А какой размер макета ты берешь для дизайна под айос приложение? И почему? Айфон СЕ? Или под восьмёрку? Если под 8, то интересно как отобразится приложение при разрешении 320...
Привет! Выбираю 375px x 812px как наиболее популярное разрешение под iOS на данный момент.
Добрый день. Где найти все эти KItы, которые Вы показываете?
Ссылки скиньте на юай киты, нам нужны ссылки на компоненты!!!
И еще в наборе компонентов я не увидел ,к примеру, клавиатуру в перевернутом состоянии, как понять ее размеры?
А можешь пожалуйста поделиться ссылкой на кит этих гайдлайнов?
аёсь))0)
Спасибо! А что это за сайт, где ты смотришь скрины интерфейсов различных приложений?
mobbin.design/
@@disarto.digital оп, спасиба 🥰
А можешь порекомендовать подобный сайт с веб интерфейсами?
Подскажите, если проектировать в Figme приложения под IOS, каким образом воспроизвести шрифт San Francisco (и нужно ли это) если работаешь на Windows ?
Шрифт San Francisco не нужно воспроизводить. Его нужно скачать и пользоваться им 🙂. Он устанавливается как и любой другой шрифт.
@@disarto.digital А его свободно можно использовать в разработке приложений на AppStore? что-то никак не могу найти инфу, везде она разнится :(
14:17
TableView.
Классное видео, спасибо) Есть вопрос: Обязательно ли использовать шрифт SF при разработки приложения под IOS?
Нет, не обязательно 🙂
как поведение покупателей в магазине, отличается от покупок в интернет магазине?
Аось аось аось
голос такой знакомый , я смотрела обучение по фигме Максим Кузнецов Это вы???
Максим Кузнецов это я 🙂
Ахахах
Вахаха, видео топ, абажаю тови ролики, спец в своем деле - сразу видно. У мня шутка на счет Chips
Артдир: Го чипсы сюда намутим!)
Диз: Не понял, ну давай, Leys?)
Артдир: Бл*****, что, вахахаха
смешно 👏
Почему никто не оставляет ссылки на гайды???
Спасибо, можете обьяснить почему фреймы андройда в Figma 360*640? Это из за того что они в dp представлены я правильно понимаю?
Верно, 360*640 соответствует самым популярным разрешениям экранов на Android.
@@disarto.digital Странно, когда я пытаюсь перевести разрешенме google pixel 2 в dp они не сходятся с разрешением фрейма google pixel 2 в Figma, почему так происходит?
Режет слух про «пиксели» у эппла, там все измеряется совсем не в пикселях.
Можно получить линку на Ui Kit IOS в Figma?👏🏻
www.figma.com/community/file/984106517828363349/iOS-15-UI-Kit-for-Figma
Ай оу эс, а не ай ось
На счёт аутлайна иконок - не правильная информация
Material You - явный закос под iOS
Открылся новый мир. Знаю, что ничего не знаю
По Material Y - автор вообще не понял, и испугался того, что не понял
Дизайнеры учите эту хрень чтобы потом с программистами не спорить.
Режет ухо колхозный язык, в остальном норм 🙏🏼
(Хозяйке на заметку) за кАстомные алерты, ничего тебе никто не сделает, а ui будет более консистентный
Спасибо!
Спасибо за отличное и полезное видео