История изменений

Розыгрыш

• Победитель определяется до начала движения. Вращение выбирает результат через crypto.getRandomValues с выборкой с отклонением, а затем анимация наводится на этот пункт. Сильный жест даёт лишь более долгое вращение, но никогда не меняет результат.
• Страница о честности. Алгоритм описан предельно открыто: код на странице — это именно тот код, который выполняется.
• Веса и повторы. Вес пункта — это его доля в розыгрыше, отображаемая в виде реального процента вероятности. Два пункта с одинаковым текстом остаются двумя разными пунктами, а список показывает число найденных повторов вместо того, чтобы тихо их объединять.

Колесо

• Двенадцать страниц. Каждая открывает уже заполненное колесо, и на каждой есть уникальный инструмент: диапазон чисел, алфавит, генератор команд, список класса, журнал бросков.
• Крутите жестом. Скорость движения при отпускании переходит в дополнительные обороты. Клик во время вращения останавливает его раньше времени; клавиши пробела и Enter запускают вращение без поиска кнопки.
• Звук и отклик. Щелчки, синхронизированные с разделителями, звук выпадения результата, отменяемый обратный отсчёт и вибрация на телефоне — всё это можно отключить, при этом текущее состояние переключателей всегда наглядно отображается.
• Режим презентации. Второстепенные элементы управления скрываются, колесо увеличивается до более чем 70% от меньшей стороны экрана, а результат выводится на высококонтрастную панель, удобную для просмотра из зала.
• Ещё два способа визуализации. Барабан слотов и полоса карточек — для тех случаев, когда круг не подходит по формату.

Сохранение и отправка

• Ссылки для отправки — это моментальные снимки. Параметры колеса кодируются прямо в URL, поэтому ссылка никогда не устаревает, а дальнейшее редактирование колеса не меняет то, что увидит ваш коллега.
• Сохранённые колёса, история и наборы весов — всё хранится в браузере и экспортируется в файл для переноса на другое устройство. Аккаунтов нет, поэтому экспорт файла — единственный способ передать данные между устройствами.

Под капотом

• Отрисовка переведена на canvas. Диск рисуется один раз при изменении данных, а вращение выполняется через CSS-трансформацию элемента, поэтому анимация вообще не нагружает процессор перерисовкой кадров. Список названий остаётся настоящим скрытым DOM-списком рядом с колесом: canvas — это лишь пиксели, а скринридеру нужен читаемый текст.
• Поддержка снижения движения. При активном prefers-reduced-motion: reduce анимация пропускается, и результат отображается мгновенно. Ни один из трёх протестированных конкурентов не учитывал этот параметр.
• Озвучивание результата. Итог попадает в live-region в виде выделяемого текста, а не просто нарисованных на колесе пикселей.

TossWheel начинался как шаблон для SaaS-проекта, и большая часть работы в этот день заключалась в избавлении от лишнего.

Удалено

• Аккаунты, дашборд, админка и настройки. Здесь некуда входить и нет закрытого контента, поэтому интерфейсы удалены насовсем, а не скрыты: оставленный выключенным флаг функции всё равно тащит за собой код.
• База данных, хранилище файлов и кэш «ключ-значение». У Worker теперь вообще нет внешних привязок. Списки живут в вашем браузере, а общее колесо передаётся прямо внутри ссылки.
• Оплата, рассылка и ИИ-инструменты. Ничему из этого здесь не было применения.

Принятые решения

• Направление А, «инструмент». Было создано три подробных прототипа, из которых выбран один: колесо слева, список рядом, действие под колесом, при этом колесо — единственный цветной объект на странице.
• Ограничение до запуска. Каждый ответ содержит заголовок noindex, пока не выполнен чек-лист запуска, чтобы полуготовые страницы не попадали в индекс и их потом не приходилось оттуда удалять.

Зачем это зафиксировано

Возврат базы данных или авторизации в будущем стал бы изменением концепции продукта, а не технической деталью. Именно благодаря этому ограничению колесо здесь не требует аккаунта и не хранит копии ваших списков.