Figma українською | Сітки. Для чого вони потрібні і як з ними працювати
Вставка
- Опубліковано 26 вер 2024
- Якщо вам корисні ці відео і вам сильно хочеться купити мені чашку кави чи кілограм яблук - ось створила банку, де це можна зробити: 5375411200366313 або send.monobank....
Сьогодні поговорила про сітки, у відео показала кууупу прикладів (хороших і поганих) для кращого вашого розуміння. Це все одно, звичайно, не уся інформація про сітки, але якщо ви стикаєтесь з ними вперше, ця базова інформація вам точно буде корисною :)
Почитати про сітки в продуктах, де використовують Material Design: cutt.ly/mN9LJLd
Якщо є запитання - пишіть, будемо розбиратись)
(таймстампи з'являться завтра))
декілька місяців тому, коли я лише починала вчити фігму, не було жодного толковго відео українською. дякую за вашу роботу, це дуже цінно, особливо зараз💙
дякую за такий зворотній зв'язок! тішусь, що мій канал знаходять люди, яким це потрібно :)
Дуже цікаво дивитись, все доступно і максимально зрозуміло для початківців. Дякую за вашу роботу
Так структуровано, чітко, зрозуміло, ще й з прикладами. Ви - скарб! У Вас явно є дар до викладання, все зрозуміло, без «води» і перескакування з теми на тему. Не втомлюсь дякувати!
Дякую за крутий урок!
Доброго дня, дякую Вам, дуже класні відео, просто супер, в мене немає слів!! Я просто "залипла" і за день продивилася всі відео! Чекаю з нетерпінням наступне! Ви молодчинка, так тримати! ще раз величезне спасибі!🌹🌹🌹❤❤❤
рада читати такі коментарі! наступні відео вже в процесі 🤫
продовжуйте знімати відео, дуже якісний україномовний контент
Дякую) Це така база, дуже цікаво було послухати
кайф, дякую! 🔥
Дякую за гарне пояснення так ще і українською!
Стільки прикладів, коментарів, все легко та зрозуміло😍 Дуже круто, дякую!🫶🏻
оу єа 💫💫💫
дякую-дякую 🥹
Дуже корисний матеріал, дякую!
Просто Богиня фігми))) Все зрозуміло і все по порядку)))) супер! Я у захваті)))
Дякую за корисні і цікаві уроки!
тішусь, що все це приносить користь 🐸🔥
Відоси супер, чекаю на нові випуски!
оу єєа, вони вже в процесі 🦾
Йой дякую дякую ❤
Доброго дня! Щиро вам дякую за таке пізнавальне відео❤❤❤дуже корисно, все детально і зрозуміло❤️❤️❤️
Окрема дяка за посилання.
Наразі я в ньому потонув. І не відомо, чи моя плата и процесор потягне (це метафора замість старої голови). Мушу зізнатись, що до цього контенту (ролику), мій потяг до нотатків був щиро як "зіроу".
Але все тиче, як вода з гори вниз і сподіваюсь не мине колись (ТНК). Поки що, це спільний нотатник з вивченням польської.
Папка на головному монітору вже палає від скринів).
Для зворотного "спічу" - для мене корисно знати
- що 360(мобильника) - рекомендовано 4 стовбці і оступи як внутрішні так і зовнішні однаково невеликі 16 точок
- що 600(це формат планшетного виміру) - і тут вже 8 стовбців, де внутрішні 24 (зразкові показники) і зовнішні можуть різнитися в бік збільшення.
- де розміщення окремих полів на загальному буде візуально сприйматись як щось цільне якщо простір мінімізований до 8 точок між деталями(зображенням чи блоком). І навпаки - збільшення проміжків буде віддаляти спостерігача від взаємозв'язку між "віконцями"
Вибачте, але мої вади лентюха не допомогли цей текст ще спростити!
В підсумку, моє розуміння дефіциту знань наполягає рекомендувати більш змістовний допис під цим роликом від автора.
Але цей час ще може прийде, у вигляді більш вмотивованому.
Наснаги Вам. Щиро вірю в стійкість ваших намірів. Це не прощання)
вам дякую! не треба коротших відосів
Дуже вам дякую за вашу роботу. все зрозуміло і дуже якісно подана інформація 💛💙
клааас, дякую, шо дивитесь 🥰
Дуже дякую! Дуже корисне відео!
Мені дуже добре заходять ваші відео по Фігмі, просто любов💙 Чи не могли б порадити курс по основам веб дизайну? Хочеться знати основні правила правила проектування
Дякую за змістовне відео! Чекаємо на нові🔥🔥🔥
кайф, дякую! ситуація зі світлом по-трошки покращується, то маю надію на те, що скоро зможу відмонтувати і закинути ще декілька відео, які вже відзняті 🤭
@@juli.and.designДякуємо! Ми навчаємося на курсах, та Ваші відео, це просто супер!!! Багато прикладів і все стає зрозумілим! Насправді, дуже приємно, навчатися українською!
@@olgakolesnichenko7927 клааас! а які курси проходите, якщо не секрет?)
@@juli.and.design Sourse it, від It Generation. Скинула в групу нашу посилання на Ваш канал, давно шукаємо такий контент.
@@juli.and.designЮля, було б дуже цікаво подивитися про адаптивний та респонсивний дизайн і взагалі Ваш особистий шлях, як дизайнера. Може якісь поради)
Юлічка!!!! Дякую!!!!!!!!!!!!!!!!!!!!!!!!!!!
Дякую! Все зрозуміло 👍
ура-ура! дякую :)
Адаптивні сайти - круто!
класно і зрозуміло, дякую!
Дуже дякую за україномовний сучасний контент. Скажіть будь ласка, чи існують якісь правила, стандарти, поради щодо відступів між окремими блоками, текстом і заголовком, тощо?
І навіщо купувати якісь курси якщо існує такий скарб як ваші відео😍😍😍. Неймовірна дяка🫶🏻
Дякую
рада, що корисно!
Після першого прикладу я випала на декілька хвилин з реальності
Дуже доступне пояснюэте. Супер Величезне вам дякую. Може у вас можна купити курс???
дякуюю :) я не планую робити ніяких курсів, ідея цього каналу в тому, щоб людям не треба було йти ні на які курси, щоб вивчити фігму))
я вірю, що фігму можна опанувати самостійно, мої відео лиш трошки допомагають людям)
тому все що треба знати про фігму я планую покрити на цьому каналі. якщо комусь хочеться підтримати мене фінансово - є номер банки під кожним відео, але я все одно робитиму цей контент безкоштовним для усіх)
Дуже корисне відео, величезне дякую
Дякую, дуже гарне пояснення! Виникло таке питання цікаве. В яких випадках можна відходити від сітки чи завжди строго по сітці має бути?
привіт, дякую за такий коментар і питання, насправді дуже важливе і класне питання!
Ні, не завжди все повинно бути по сітці, але хорошою ідеєю буде відходити від неї свідомо і для якоїсь причини. Наприклад, в онлайн-магазинах сітка дуууже важлива (користувачі не вдивляються в товари, а сканують їх і зручніше все сканувати, коли карточки товару організовані в колонки і рядки, а не хаотично розкидані по екрану), але якщо дизайнеру треба виділити якись один товар і привернути на нього більше уваги, він може це зробити різними методами: розміром (карточка-гігант, яка буде в умовні 4 рази більша за усі інші), кольором, обводкою, стрілочками або, зокрема, вибити цей елемент з сітки.
Якщо воно відрізняється від загального паттерну -> воно привертає більше уваги.
Або, наприклад, порушенням правил сітки ви будете комунікувати те, що ваш бренд супер бунтарний, має out of the box підхід і плює на усі правила)
Але якщо ви робите інтерфесне рішення для стереотипних бухгалтерів чи адвокатів, це може зіграти проти вас)) (хоча бачила супер креативні сайти для бухгалтерів хаха, тут все впирається в контекст і позиціонування компанії)
лонг сторі шорт: можна робити все, насправді можна навіть дизайн без сітки і він теж може бути крутим, але це все повинно бути осмислено, а не тому, що дизайнер просто не шарить в сітках)))
згадала класний приклад сайту, де це поєднано цікаво: wakawaka.world/ рекомендую заглянути у вкладку index (wakawaka.world/catalogue) і ви побачите спочатку 4 колонки з інфою, а при наведенні на текст, на екрані з'являтимуться зображення меблів в рандомних місцях, які тооочно не лежать ні в якій сітці і може навіть спочатку трохи збивають з толку, але це явно було продумано дизайнерами)
це досить крейзі варіант, але сподіваюсь, я донесла ідею про доцільне порушення правил сітки :))
@@juli.and.design ваааааау, дякую за таку розгорнуту відповідь ❤ тепер зрозуміло !)))
@@marie.ruzhytska клас, рада, що все тепер зрозуміло :)
Але якщо Layer зʼявився але сама сітка не зʼявилась
Юля, в мене таке питання до тебе. Який краще всього робити відступ по бокам якщо розмір екрану стоїть 1920х1080?
Привіт! На жаль, нема універсальних правил і все дуже залежить від сайту. Можна робити взагалі без відступів і сайт буде розтягуватись до країв екрану, а можна робити весь контент зібраним "в купку" по центру і вже відштовхуючись від кількості контенту і обраного леяуту, виставяти марджини)
Якби було одне-єдине правило, скоріш за все було б не так цікаво розглядати сайти, бо усі вони були б ідентичні :)
@@juli.and.design Дуже дякую)))
@@juli.and.design краще використовувати стреч чи центр коли робиш колонки?
Як ви зробили так, щоб червоні лінії з'являлись ще й відстань між об'єктами показувало?
з виділеним об‘єктом натисла альт і навела мишку на об‘єкт, до якого хочу подивитись відстань)
@@juli.and.design Дякую, це дуже гарна річ у використанні данного інструменту! У мене ще таке питання - як зробити відступи не тільки для тексту а й для об'єктів наприклад у форматі А4 де зліва та права буде 1 см, а знизу та зверху 2 см))
таймапси не з'явилися))))))))))))
всяке буває, я не люблю їх робити)))
Дуже дякую вам
дуже-дуже дякую!!!
Дякуууююю! )