Что такое findslide.org?

FindSlide.org - это сайт презентаций, докладов, шаблонов в формате PowerPoint.

Для правообладателей

Обратная связь

Email: Нажмите что бы посмотреть 

Яндекс.Метрика

Презентация на тему Дизайн-системы для девелоперов

Содержание

Что мы узнаем?Что такое дизайн система?Какие есть инструменты для разработчиков?Как общаться с дизайнерами?
Practical Design Systems for DevelopersПрактические Дизайн Системы для Девелоперов Что мы узнаем?Что такое дизайн система?Какие есть инструменты для разработчиков?Как общаться с дизайнерами? Что такое дизайн система? A design system is a collection of reusable https://designsystemsrepo.com/design-systems/Какие есть системы? Разработчик должен понимать как организовать систему в проектеhttps://medium.com/uxcollections/design-system-resources-d8985ae689b4 Atomic design - Атомический Дизайнhttp://atomicdesign.bradfrost.com/chapter-2/ Написание CSShttp://getbem.com/introduction/https://smacss.com/ SASShttps://www.sitepoint.com/architecture-in-sass/https://sass-lang.com/ Practical Cases of SASShttps://hugogiraudel.com/2015/06/18/styling-react-components-in-sass/https://medium.com/@kswanie21/css-modules-sass-in-create-react-app-37c3152de9 Webpack setup?https://hackernoon.com/a-tale-of-webpack-4-and-how-to-finally-configure-it-in-the-right-way-4e94c8e7e5c1 PostCSS?https://www.postcss.parts/https://www.sitepoint.com/an-introduction-to-postcss/ CSS-in-JShttps://hackernoon.com/all-you-need-to-know-about-css-in-js-984a72d48ebc Libraries (React)https://www.styled-components.com/docshttps://github.com/jxnblk/styled-system Альтернативыhttps://emotion.sh/https://alligator.io/react/css-in-js-roundup-styling-react-components/https://jsramblings.com/2017/10/17/things-to-consider-when-choosing-a-react-styling-framework.htmlhttp://www.npmtrends.com/ Документацияhttps://storybook.js.org/basics/introduction/https://www.docz.site/ Tecтированиеhttps://storybook.js.org/testing/react-ui-testing/https://www.creativebloq.com/features/the-5-best-visual-regression-testing-tools ДизайнеRыhttps://zeplin.io/https://www.figma.com/file/oj3taaBNJX8PCVegyDpwAF/Sample-Filehttps://framer.com/ Спасибо!TwitterInstagramMedium@riittagirl
Слайды презентации

Слайд 2 Что мы узнаем?
Что такое дизайн система?
Какие есть инструменты

Что мы узнаем?Что такое дизайн система?Какие есть инструменты для разработчиков?Как общаться с дизайнерами?

для разработчиков?
Как общаться с дизайнерами?

Слайд 3 Что такое дизайн система?
A design system is a

Что такое дизайн система? A design system is a collection of

collection of reusable components, guided by clear standards, that

can be assembled together to build any number of applications.
Design System – the complete set of design standards, documentation, and principles along with the toolkit (UI patterns and code components) to achieve those standards.

Слайд 4 https://designsystemsrepo.com/design-systems/
Какие есть системы?

https://designsystemsrepo.com/design-systems/Какие есть системы?

Слайд 5 Разработчик должен понимать как организовать систему в проекте
https://medium.com/uxcollections/design-system-resources-d8985ae689b4

Разработчик должен понимать как организовать систему в проектеhttps://medium.com/uxcollections/design-system-resources-d8985ae689b4

Слайд 6 Atomic design - Атомический Дизайн

http://atomicdesign.bradfrost.com/chapter-2/

Atomic design - Атомический Дизайнhttp://atomicdesign.bradfrost.com/chapter-2/

Слайд 7 Написание CSS
http://getbem.com/introduction/
https://smacss.com/

Написание CSShttp://getbem.com/introduction/https://smacss.com/

Слайд 8 SASS
https://www.sitepoint.com/architecture-in-sass/

https://sass-lang.com/

SASShttps://www.sitepoint.com/architecture-in-sass/https://sass-lang.com/

Слайд 9 Practical Cases of SASS
https://hugogiraudel.com/2015/06/18/styling-react-components-in-sass/
https://medium.com/@kswanie21/css-modules-sass-in-create-react-app-37c3152de9

Practical Cases of SASShttps://hugogiraudel.com/2015/06/18/styling-react-components-in-sass/https://medium.com/@kswanie21/css-modules-sass-in-create-react-app-37c3152de9

Слайд 10 Webpack setup?
https://hackernoon.com/a-tale-of-webpack-4-and-how-to-finally-configure-it-in-the-right-way-4e94c8e7e5c1

Webpack setup?https://hackernoon.com/a-tale-of-webpack-4-and-how-to-finally-configure-it-in-the-right-way-4e94c8e7e5c1

Слайд 11 PostCSS?
https://www.postcss.parts/

https://www.sitepoint.com/an-introduction-to-postcss/

PostCSS?https://www.postcss.parts/https://www.sitepoint.com/an-introduction-to-postcss/

Слайд 12 CSS-in-JS
https://hackernoon.com/all-you-need-to-know-about-css-in-js-984a72d48ebc

CSS-in-JShttps://hackernoon.com/all-you-need-to-know-about-css-in-js-984a72d48ebc

Слайд 13 Libraries (React)
https://www.styled-components.com/docs

https://github.com/jxnblk/styled-system

Libraries (React)https://www.styled-components.com/docshttps://github.com/jxnblk/styled-system

Слайд 14 Альтернативы
https://emotion.sh/
https://alligator.io/react/css-in-js-roundup-styling-react-components/
https://jsramblings.com/2017/10/17/things-to-consider-when-choosing-a-react-styling-framework.html
http://www.npmtrends.com/



Альтернативыhttps://emotion.sh/https://alligator.io/react/css-in-js-roundup-styling-react-components/https://jsramblings.com/2017/10/17/things-to-consider-when-choosing-a-react-styling-framework.htmlhttp://www.npmtrends.com/

Слайд 15 Документация
https://storybook.js.org/basics/introduction/

https://www.docz.site/

Документацияhttps://storybook.js.org/basics/introduction/https://www.docz.site/

Слайд 16 Tecтирование

https://storybook.js.org/testing/react-ui-testing/
https://www.creativebloq.com/features/the-5-best-visual-regression-testing-tools

Tecтированиеhttps://storybook.js.org/testing/react-ui-testing/https://www.creativebloq.com/features/the-5-best-visual-regression-testing-tools

Слайд 17

Слайд 18 ДизайнеRы
https://zeplin.io/
https://www.figma.com/file/oj3taaBNJX8PCVegyDpwAF/Sample-File
https://framer.com/


ДизайнеRыhttps://zeplin.io/https://www.figma.com/file/oj3taaBNJX8PCVegyDpwAF/Sample-Filehttps://framer.com/

Слайд 19

  • Имя файла: dizayn-sistemy-dlya-developerov.pptx
  • Количество просмотров: 98
  • Количество скачиваний: 0
- Предыдущая Жедел көмек дәрігер тәжірибесіндегі гипотензивтік препараттар
Следующая - Рыба и морепродукты

Похожие презентации

Учебная презентация по теме Предмет информатики. Основные блоки компьютера Учебная презентация по теме Предмет информатики. Основные блоки компьютера 109
Операторы цикла в среде программирования Pascal ABC Операторы цикла в среде программирования Pascal ABC 150
Создание электронных тестов Создание электронных тестов 124
Правовые и этические нормы использования интернета. Правовые и этические нормы использования интернета. 182
Архиваторы Архиваторы 131
Информатика и математика Информатика и математика 124
Алгебра высказываний Алгебра высказываний 100
ИКТ в образовательном процессе ИКТ в образовательном процессе 118
File systems and directories. (Chapter 11) File systems and directories. (Chapter 11) 84
Super RAVANIO bros Super RAVANIO bros 88
Анимация в PowerPoint (шутка) Анимация в PowerPoint (шутка) 113
Проект и основные этапы его разработки Проект и основные этапы его разработки 122
хмарні технології як засіб інклюзивеного навчання хмарні технології як засіб інклюзивеного навчання 106
Условный оператор. Оператор выбора Условный оператор. Оператор выбора 99
Внеклассное мероприятие по информатике 8 класс Внеклассное мероприятие по информатике 8 класс 136
Презентация Первые шаги в Blender Презентация Первые шаги в Blender 256
Кодирование информации с помощью знаковых систем Кодирование информации с помощью знаковых систем 80
Презентация Передача информации, проводной и беспроводной способ Презентация Передача информации, проводной и беспроводной способ 172
Вы скачали файл… Вы скачали файл… 96
Алгоритм обнаружения графических примитивов типа окружность при обработке изображений в реальном времени Алгоритм обнаружения графических примитивов типа окружность при обработке изображений в реальном времени 125
СИСТЕМЫ СЧИСЛЕНИЯ (9 КЛАСС) СИСТЕМЫ СЧИСЛЕНИЯ (9 КЛАСС) 98
Безопасность в Web Безопасность в Web 82
Презентация по информатике на тему Выполнение алгоритмов для исполнителя Презентация по информатике на тему Выполнение алгоритмов для исполнителя 117
Использование ИКТ в развитии ребенка презентация презентация по информатике Использование ИКТ в развитии ребенка презентация презентация по информатике 137
Представление и кодирование информации Представление и кодирование информации 99
Защита персональных данных в сети Интернет Защита персональных данных в сети Интернет 252
Использование ИКТ в начальной школе презентация к уроку по информатике (1, 2, 3, 4 класс) Использование ИКТ в начальной школе презентация к уроку по информатике (1, 2, 3, 4 класс) 119
Шифрование с открытым ключом. Алгоритм RSA Шифрование с открытым ключом. Алгоритм RSA 134
ФОРМАТИРОВАНИЕ ТЕКСТА ФОРМАТИРОВАНИЕ ТЕКСТА 332
Zend Framework. Общие сведения. Реализация паттерна MVC в Zend Framework Zend Framework. Общие сведения. Реализация паттерна MVC в Zend Framework 121