Личное портфолио
Редакторское портфолио, задуманное сдержанным и осознанным, а не броским. Контент живёт как типизированные объекты данных, которые автоматически питают маршруты, карту сайта и связанные ссылки, а вся дизайн-система — это один файл CSS-токенов, так что и текст, и внешний вид меняются в одном месте, а не разбросаны по разметке. (Этот сайт.)
- Роль
- Единственный дизайнер и разработчик
- Год
- 2026
- Статус
- В процессе
- Категория
- Дизайн
- Инструменты и технологии
- Next.jsReactTypeScriptTailwind CSSFramer Motion
- Ссылки
- GitHub
Проблема
Большинство шаблонов портфолио вплетают контент в разметку и разбрасывают стилизацию по компонентам, так что любая правка превращается в раскопки. Этот подход относится к сайту как к небольшому продукту: типизированный контент как источник истины, дизайн-система в одном файле и переиспользуемые шаблоны для кейсов и статей.
Контекст
Личный проект, расширяющий основу из Figma, — структурно завершённый и типизированный, но ещё до деплоя.
Ключевые решения
Контент отделён от представления
Типизированные объекты данных (проекты, статьи, опыт, сайт) питают маршруты, карту сайта и связанные ссылки, так что добавление проекта или статьи — это одно добавление данных, а не правка разметки.
Дизайн-система в одном файле
Каждый визуальный токен — цвет, плавная шкала шрифтов, отступы, радиусы, тени, движение — задан один раз в globals.css в @theme из Tailwind v4, так что полное перекрашивание — это правка одного файла.
Результаты
- Полный статически отрендеренный сайт (шесть разделов плюс шаблоны кейсов и статей по слагу), где добавление записи — это одно добавление данных.
- Доступность и SEO решены у источника: поддержка сниженного движения, формы с ARIA, Open Graph, sitemap/robots и структурированные данные JSON-LD.
Извлечённые уроки
- Отложить недоступный источник, изолировав его за одним файлом, превратило неизвестность в однострочную сверку, а не в блокер, — решение, которое не дало сборке остановиться.
Похожие работы
Room of Horror
VR-«комната ужасов», где студенты-медсёстры ищут ошибки ухода в виртуальной больничной палате, а преподаватель настраивает и наблюдает за каждой сессией вживую из браузера.
AOG Moldova
Рабочий лендинг для круглосуточной аварийной логистики авиазапчастей в Молдове — с трёхъязычным интерфейсом и бессерверной формой заявки, которая направляет срочные запросы прямо в операционную команду.