Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Алексей Авдеев (Mish) — Как подружиться c фронт...
Search
Ozon Tech
February 20, 2023
Design
0
2k
Алексей Авдеев (Mish) — Как подружиться c фронтенд-разработчиком
Ozon Tech
February 20, 2023
Tweet
Share
More Decks by Ozon Tech
See All by Ozon Tech
Анастасия Писнова, «Текст как проект»
ozontech
0
28
Светлана Каюшина, Автоматизируем документирование и внедряем ИИ
ozontech
0
31
Павел Костромитин, «Что случилось у UXW T-Банка в 2024 »
ozontech
0
44
Сергей Горшенин, «Конвертация данных Ozon»
ozontech
0
38
Юрий Гуреев, «Интеграция 1С с внешними системами. Проблемы и их решения»
ozontech
0
65
Артём Нургалиев, «Кэш на кэш: как ускоряли автобиддеры»
ozontech
0
27
Анна Мария Попова (Х5 Tech) – Фантастический техпис: может ли опыт создания художественных книг помочь в написании документации
ozontech
0
210
Александр Мачулин (Gramax) – Справочник фантастических тварей из Docs as Code
ozontech
0
210
Мария Смирнова – Дзен и искусство работы с документацией: как использовать принципы буддизма в работе техписа
ozontech
0
140
Other Decks in Design
See All in Design
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
1
210
How to get a Tiger to Tulsa
mcduckyart
0
110
無自覚なランクとその影響を紐解くワークショップ / Unpacking Unconscious Privilege Workshop
spring_aki
4
290
DC Style Redesign
mcduckyart
0
130
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
240
真・altはつけるだけじゃなくて -alt属性の考察 2025年版-
securecat
5
1.6k
マンガで分かるサービスデザインガイドライン
senryakuka
1
900
誰もがAIエージェントを"操作"したがる〜AIエージェントに求められるUX〜
ikeyatsu
2
1.8k
デフォルトの16:9(960*540px)のケース / Google Slide Size Test
arthur1
0
2.9k
AIの実践とコミュニケーションデザインの意義 / AI practice and the significance of communication design
bebe
0
620
読書シェア会 vol.5 / Yumemi.grow 20250526
rakus_dev
0
1.6k
AI時代に、僕たちデザイナーはどう歩むか
kazuhirokimura
0
260
Featured
See All Featured
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
60k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
940
Mobile First: as difficult as doing things right
swwweet
223
9.7k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.3k
Bash Introduction
62gerente
614
210k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
53k
Music & Morning Musume
bryan
46
6.6k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
500
How to Think Like a Performance Engineer
csswizardry
24
1.7k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.3k
Transcript
1
2
3
4
5
6
None
8
9 Дистанция
Как стать ближе? 10
9 Компоненты 11
None
None
None
None
None
Компоненты
Проектируйте, а не рисуйте 18
8 Адаптив 19
Веб адаптивен по-умолчанию 20
None
Сколько брейкпойнтов? 22
None
None
Только то, что изменяется 25
None
CSS Container Queries 27
None
None
None
None
None
Flexbox .block { display: flex; flex-flow: row wrap; justify-content: flex-end;
} 01. 02. 03. 04. 05. 33
Auto Layout
Продумывайте адаптив 35
7 Платформа 36
Закон Якоба 37
None
None
None
Не проектируйте заново нативные 41
6 Шрифты 42
None
url("/fonts/OpenSans-Regular-webfont.woff2") @font-face @font-face { font-family: "Open Sans"; src: format("woff2"); }
h1 { font-family: "Open Sans" } 01. 02. 03. 04. 05. 06. 07. 08. 44
None
None
47
Стек системных шрифтов 48
Sans-serif font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica
neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif; 01. 02. 03. 49
Преимущества Быстрая загрузка Отличная поддержка Привычный пользователям 1. 2. 3.
50
Изучайте популярные шрифты 51
5 Скролл 52
None
60 кадров в секунду (FPS) 54
None
None
Минимум вычислений на скрол 57
4 Состояния 58
None
None
None
None
Сверьтесь с чеклистом 63
None
3 Контент 65
None
67
Работайте с контентом 68
2 Рефакторинг 69
None
None
Смотрят чаще, чем редактируют 72
None
None
None
None
None
None
None
None
81
82
83
84
Уменьшайте дизайн-долг 85
1 Разработка 86
None
None
Представляйте конечную цель 89
90
Идеальный конечный результат 91
92
Нет разработчика — нет проблем 93
94
None
None
None
None
None
Изучайте разные инструменты 100
Сокращаем дистанцию
None
Проектируйте макеты, будто верстать их будет склонный к насилию психопат,
который знает, где вы живете 103
👏 Спасибо! 👨 Алексей Авдеев 🌐 github.com/avdeev 🌐 twitter.com/avdeev_alexey 🌐
Продуктовая лаборатория Mish — — — — 104