Этот сайт — продукт, и, как у любого продукта, у него есть принципы, по которым он построен. Здесь — список этих принципов и решений, на которые они опираются.
Это продукт, не лендинг
Я не делал визитку. Я не делал «сайт-портфолио». Я делал продукт.
Это значит, что у него есть билд (BUILD 3cd8687 в футере, кликабельный на коммит в GitHub), есть бэклог, есть релизы, есть пользователь и есть метрика успеха. Метрика не в посетителях и не в конверсии — она в том, насколько точно сайт отражает то, как я думаю и работаю. Если сайт перестаёт быть точным — я его правлю.
Это значит, что к нему применяются продуктовые правила: каждое решение должно быть оправданным, ничего «потому что у всех так», ничего «потому что красиво».
Хеш билда в футере — не украшение и не выпендрёж. Это та же сущность, что версия в About → iPhone или серийник на обороте калькулятора Braun. Кликнул — увидел, что именно было изменено в этом релизе. Сайт не прячет свою историю.
Десять принципов Дитера Рамса
Главный архитектурный референс этого сайта — Дитер Рамс, главный дизайнер Braun в 1955–1995 годах. К концу карьеры он сформулировал десять принципов хорошего дизайна. Они написаны для индустриальных продуктов, но переводятся на цифровую среду почти без потерь.
Принципы Рамса — это не чек-лист. Это набор вопросов, которые дизайнер задаёт себе.
- Innovative. Использовать новые технологические возможности — но в служении функции, не ради новизны.
- Useful. Дизайн должен подчёркивать пользу и убирать всё, что её ослабляет.
- Aesthetic. Красота как следствие правильной структуры, а не нанесённое поверх украшение.
- Understandable. Продукт должен сам объяснять, как им пользоваться. В лучшем случае — самоочевиден.
- Unobtrusive. Продукты — это инструменты, не художественные объекты. Они не «кричат».
- Honest. Не делать продукт инновационнее, мощнее или ценнее, чем он есть.
- Long-lasting. Не привязываться к моде. Не выглядеть «современно сегодня».
- Thorough down to the last detail. Ничто не должно быть случайным. Уважение к пользователю проявляется в тщательности.
- Environmentally friendly. Минимизировать ресурсы, минимизировать визуальный шум.
- As little design as possible. Weniger, aber besser — меньше, но лучше. Не путать с минимализмом как стилем.
Решения по слоям
Визуальный язык. Бежевая бумажная подложка, чёрные заголовки, моноширинные caps-метки, никакой декорации. Один акцентный цвет, ясная сетка, иерархия через размер и вес, а не через украшения.
Типографика. Шрифт IBM Plex — open source, выпущен IBM Design в 2017 году. Здесь сходятся три вещи: наследие IBM как одной из главных школ корпоративного модернизма XX века (Эллиот Нойес, Пол Рэнд, Имс), открытость лицензии (можно использовать без оглядки на бюджет) и одна из лучших в open-source кириллица. Plex Sans для тела, Plex Mono для caps-меток. Mono в caps — это терминальная эстетика, git log, README; читатель сразу считывает «передо мной технический документ, не маркетинговый лендинг».
Цвет. Оранжевый акцент как индикатор состояния. Та же семантика, что у переключателя mute на iPhone, у #FF6600 Hacker News, у оранжевой кнопки питания на калькуляторе Braun ET33. Линия родословной: индустриальный safety-orange → Braun → tech-стартапы → этот сайт. Оранжевый = attention, utility, state — не «фирменный цвет». Он используется ровно в четырёх местах: главный CTA («Написать в Telegram»), активный язык в переключателе («RU» подчёркнут), индикатор текущего места работы (точка рядом с «Yandex Uzbekistan»), активная тема в дропдауне. Везде — одна семантика: «вот это сейчас активно».
Иерархия CTA. Две кнопки рядом — «Написать в Telegram» (оранжевая, заливка) и «Чем могу помочь» (белая, обводка). Размер одинаковый, цвет разный. Иерархия через насыщенность, не через размер. Если у пользователя одна минута — он жмёт оранжевую. Если десять — белую.
Цифры вместо прилагательных и разбивка цифр. Каждая цифра разворачивается во вторую строку с контекстом. Цифра плюс разбивка — проверяемое утверждение. Никто не должен верить мне на слово; все цифры можно сверить с источниками.
Тот же подход в карьере. Не «масштабировал e-grocery», а Заказы: 400 → 10 000 в день за 3 года, Выручка: ×2 год к году при положительной EBITDA, CSAT: 4.2 → 4.5. Не «работал в EdTech», а Активировал 7M+ пользователей. Где нет цифр — там просто По контракту (Apple Russia, 2018–2019). Контрактная работа не имеет 7-летних KPI; натягивать их под формат — нечестно.
В разделе «Своё дело» — статусы без переупаковки: Запустили → не нашли PMF → на паузе, Запустили → стабилизировали → продали сотрудникам, Запустили → выросли до 3-х точек → закрыли. Четыре своих проекта, один продан, остальные — закрылись или на паузе. Это и есть статистика стартапов; имитировать что-то другое — обман читателя.
Двуязычность. RU и EN — две версии, не одна с переводом. Yandex Uslugi на RU становится Yandex Services на EN — потому что в Узбекистане сервис назывался Услуги, а англоязычная аудитория увидит сразу «сервисы». «Своё дело» → Ventures, «Чем могу помочь» → How I can help, «наст. вр.» → present. Разделители тысяч скроены под локаль: 5 831 ↔ 5,831, 1 139 ↔ 1,139. 82 600 просмотров ↔ 82,600 views. Перевод — это импорт смыслов, не подстановка слов.
Доступность. Четыре темы: светлая, тёмная, авто (по системной настройке), высокий контраст. Последняя — для людей со слабым зрением, дислексией, светочувствительностью, а также для чтения на улице под ярким солнцем. Это редкое решение для personal-сайта; для меня — обязательное. Дропдаун с темами открывается одним кликом по иконке солнца/луны; активная тема подсвечена оранжевой обводкой — снова семантика state, ничего нового.
Навигация. При скролле справа появляется столбик 01–07 — номера разделов. Текущий выделен, остальные приглушены. Это не sticky-меню и не TOC — это просто ориентир, как номер страницы в книге. Никаких подписей, никаких иконок, никакого «back to top» с анимацией. Стрелка ↑ живёт в правом нижнем углу, появляется когда нужно, скроллит без задержки. У Рамса это называется as little design as possible.
Чего здесь намеренно нет
- Аналитики, cookies, трекеров. Это проверяется через DevTools → Network.
- Popup-окон, exit-intent, чатботов. Никаких pattern interruptions.
- "Отзывов клиентов", лого в разделе "с нами работают" и прочих social proof.
- Видео и анимаций: не потребляет батарею и внимание.
- Кластера соцсетей.
- Просьб оставить почту для рассылок и прочей неуправляемой коммуникации.
- Тёмных паттернов.
- Рекламных баннеров и прочего маркетингового шума.
Всё это — осознанные решения, чтобы не отвлекать пользователя от контента.
Инструменты разработки
Сайт сделан с помощью Claude Code и Claud Design.
Сайт умышленно использует передовой подход к производству цифровых продуктов, что попадает в первый принцип Рамса.
AI не подменяет решение, а исполняет его. Философия и принципы были сформулированы до того, как был написан первый компонент. Если бы я попросил Claude «сделай мне personal-сайт» без брифа — получил бы что-то усреднённо-приличное. А я дал референсы (Рамс, Braun, IBM Plex, Hacker News), ценности (приватность, доступность, прозрачность) и тон (цифры вместо прилагательных) — и инструмент исполнил по партитуре.
Сайт не носит нашлёпки «Made with AI». Инновация спрятана в процессе, результат — функционален.
Этическая линия
Если собрать решения вместе, получается одна последовательная линия:
- Privacy. Никакой аналитики и трекеров.
- A11y. Высокий контраст как отдельный режим. Сайт работает для людей со слабым зрением.
- Transparency. Репозиторий открыт, build hash в футере кликабельный на коммит в GitHub. Каждый может увидеть, что и когда менялось. Аффилиатные ссылки на /uses помечены и раскрыты.
- Humility. Ссылка «Нашли опечатку?» в футере — приглашение к коррекции.
- Honesty. Статусы «Закрыл / Продал / На паузе» показывают реальный контекст без переупаковки. Цифры подписчиков разложены по платформам, а не свалены в одну. Срок ответа — не «отвечу скоро», а
обычно отвечаю в течение 10 рабочих дней.
Пять жестов, направленных на одного субъекта — читателя. Не на меня. Это, наверное, главное, что я хотел сказать этим сайтом: продукт устроен в интересах того, кто им пользуется.
Это живой документ
Сайт обновляется. Если что-то выглядит сломанным, читается странно или просто кажется неточным — напишите. Ссылка «Нашли опечатку?» сообщить об ошибке на почту. Репозиторий открыт; если хотите завести issue или PR — добро пожаловать.
Сайт — не финальный артефакт. Через год он, возможно, будет выглядеть иначе.