Updates react and wa description

interview/sections/system-design-web.md

@@ -1,22 +1,27 @@
 # Секция по дизайну для WEB направления
-## Формат секции
-- Продолжительность: 60 минут
-- Формат: Будет использоваться сервис похожий на https://excalidraw.com/ в котором можно будет "порисовать" систему
-- Кто проходит секцию: синьоры или выше
+## Как проходит секция
+Данную секцию мы проводим для разработчиков уровня middle+ и выше. Цель интервью — узнать твой опыт проектирования и сопровождения веб-приложений, а также твои способности решать задачи связанные с проектированием систем. 
 
-На этой секции мы хотим узнать ваш опыт проектирования и сопровождения Web приложений, а так-же как вы можете решить задачи связанные с проектированием систем. Фокус секции будет на Web приложении.
+Для визуализации процесса проектирования используется онлайн-доска [Sketchboard](https://sketchboard.io). Для упрощения работы с обширной палитрой данного инструмента в ходе секции рекомендуется пользоваться только элементами раздела Software Sketching. К сожалению, у данного сервиса нет демо-версии, но если хочется познакомиться с подобными инструментами поближе, можно попробовать [excalidraw.com](https://excalidraw.com/) — он очень близок по функциональности. Шаринг экрана не потребуется.
 
-### Этапы секции
-- Сбор требований - будет дана задача и на этом этапе проверяем как кандидат может собрать требования. Можно и нужно задавать вопросы и выяснить основные, критичные момент которые потребуются дальше
-- Проработка верхнеуровнего дизайна - оцениваем опыт в организации инфрастуктуры для WEB приложений. Какие системы используются, чтобы пользователь мог увидеть результат в браузере?
-- Проработка структуры приложения - оцениваем опыт в проектировании приложения на выбранных кандидатом технологий. Как будет приложение разбито на компоненты/модули
-- Проработка данных - оцениваем опыт в организации общения между клиентом и сервером, а так-же где и как будут храниться данные в приложении.
-- Производительность/Безопасность - оцениваем опыт в улучшении производительности приложений, так и исправления/учитывания особенностей связанных с безопасностью
+Постарайся записывать или схематически зарисовывать (если это возможно) всё, что говоришь вслух.
+
+Продолжительность секции — 60 минут.
+
+## Этапы секции
+В ходе интервью тебе будет будет предложен набор функциональных требований к системе. Тебе нужно будет:
+
+* Формализовать задачу: уточнить требования, выяснить основные сценарии работы системы. Что требуется от системы? В каких условиях будет существовать система?
+* Наглядно описать компоненты системы и их взаимодействие между собой: схематически изобразить компоненты, показать связи между ними. Схема должна наглядно показывать, какие системы будут использованы для того, чтобы пользователь мог увидеть результат в браузере. При этом нет необходимости глубоко погружаться в бекенд.
+* Спроектировать компонентную структуру фронтового приложения, формализовать API, спроектировать модель данных. По итогу должно быть понятно, как, где и какие данные хранятся и передаются между фронтовым приложением и бекендом.
+* Идем глубже:
+    * Оценить узкие места в системе, рассказать, какие оптимизации можно применить для снижения нагрузки на бекенд, для ускорения доставки данных до клиента, для улучшения performance-метрик.
+    * Критически оценить систему на предмет безопасности, убедиться, что закрыты все основные уязвимости.
+    * Прочие моменты — UX, a11y, i18n, поддержка различных устройств и так далее.
+
+Как правило, часа не хватает для того, чтобы полностью и всеобъемлюще обсудить задачу — это нормально. 
 
 ## Материалы для подготовки
-- Подумайте о том, как устроены внутри типичные сайты/сервисы средних или крупных компаний
-    - Подумайте о верхнеуровнем дизайне сервиса и какие системы участвуют, когда заходит пользователь на сайт?
-    - Как разбита логика внутри и какие есть челенжи? (часто можно найти доклады в которых разработчики рассказывают о своем проекте и как он устроен)
-    - Как разбивают логику на компоненты, чтобы можно было поддерживать и реиспользовать?
-- [Front-End Engineer](https://www.youtube.com/channel/UC6YpkaZsAcAvPNt4rLiS7dg) - хороший канал с разбором базовых задач, с описанием формата
+- [Front End Interview Handbook](https://www.frontendinterviewhandbook.com/ru/front-end-system-design/) — сайт с описанием похожего формата собеседований, много ссылок на полезные статьи и материалы
+- [Front-End Engineer](https://www.youtube.com/channel/UC6YpkaZsAcAvPNt4rLiS7dg) - канал с разбором базовых задаx и описанием формата
 - Книга "Чистая архитектура. Искусство разработки программного обеспечения | Мартин Роберт"