TakeProfit, каким бы его собрал Apple
Берём живой тирдаун TakeProfit (форк TV Lightweight + PixiJS WebGL2, плотный pro-терминал) и переосмысляем его по актуальным принципам Apple — HIG, Liquid Glass, WWDC26. Главный фокус — как Apple сшил бы мобильный и десктопный интерфейс в одно приложение.
Концепт/мнение на основе реверс-инжиниринга takeprofit.com и официальных гайдов Apple. Не аффилировано ни с Apple, ни с TakeProfit.
Главный сдвиг
TakeProfit сегодня — это десктопный терминал, ужатый вниз: плотные 20px-контролы, hover-reveal тулбары, докинг Lumino, максимум хрома. Apple зашёл бы с другого конца.
Apple не «ужимает десктоп в телефон». Apple проектирует одну анатомию, которая адаптируется: график — это контент во весь экран, а все контролы — тонкий стеклянный слой, который перетекает между формами под устройство и способ ввода.
Два слоя — буквально
Контент-слой = график во весь экран (свечи, объёмы, рисунки). UI-слой = Liquid Glass поверх: символ, таймфрейм, инструменты, таб-бар. Цвет бренда живёт в контенте, стекло его подхватывает.
Одна анатомия, три ширины
Те же элементы, та же логика — но раскладка адаптируется через size classes: compact (телефон) → regular (планшет) → expanded (Mac). Не три дизайна, а один, который тянется.
Mobile ↔ Desktop: как Apple бы их сшил
Сердце ответа. Не «версия для телефона» и «версия для ПК», а одно приложение, где элементы морфятся, а данные/раскладки синхронизируются.
Правило морфинга элементов
| Элемент | iPhone (compact) | iPad (regular) | Mac (expanded) |
|---|---|---|---|
| Навигация | Нижний таб-бар (стекло) | Таб-бар → разворачивается в сайдбар | Сайдбар + тулбар + меню-бар |
| График | 1 во весь экран, свайп между | 1 крупный + мини-список | Док из нескольких пейнов (как Lumino, но по конвенциям Apple) |
| Пикеры (индикаторы/символы) | Bottom sheet с поиском | Поповер / сайд-шит | Поповер у кнопки + меню-бар |
| Настройки объекта | Bottom sheet (detents) | Поповер | Правый инспектор |
| Инструменты рисования | Контекстная плашка + жесты + Pencil | Боковая плашка + Pencil | Тулбар + hover + правый клик |
| Watchlist | Отдельная вкладка | Сайдбар | Постоянный сайдбар |
| Плотность | 44pt цели, крупно | средняя | компактно + hover-уплотнение |
Что переносится между устройствами (Continuity)
Адаптация под способ ввода (а не под «размер»)
Touch (iPhone/iPad)
Цели ≥44pt, жесты (pinch-zoom, two-finger pan, long-press = контекст), bottom sheets под большой палец, Apple Pencil для точного рисования и магнита. Никакого hover-only.
Pointer (Mac/iPad+трекпад)
Компактные контролы, hover-уплотнение, правый клик = контекст-меню, полные хоткеи и меню-бар, drag-to-dock пейнов, точный курсор-кросхейр.
Мокапы: один экран, две формы
Один и тот же «Chart»-экран. Слева — iPhone (контент во весь экран, стеклянные плавающие контролы, нижний таб-бар). Справа — Mac (тот же график, но раскрыт в сайдбар + тулбар + инспектор).
- График — контент-слой во весь экран на обоих; контролы плавают в стекле сверху.
- На телефоне навигация — нижний таб-бар; на Mac она же раскрыта в сайдбар (watchlist) + тулбар + инспектор справа.
- Инструменты (ƒ𝑥 / рисование) на телефоне — плавающая контекстная плашка; на Mac — тулбар с теми же действиями.
- Цена и сигналы — семантический зелёный/красный (P3), но дублируются формой/иконкой, не только цветом.
Что бы Apple изменил (на основе тирдауна)
Конкретные «было → стало», привязанные к тому, что реально в TakeProfit сейчас.
Было · TakeProfit
Hover-reveal drawing-тулбар. Инструменты появляются по наведению мыши.
Стало · Apple
Always-reachable + контекст. Постоянная (сворачиваемая) плашка + long-press/правый клик; на тач hover не существует — иначе фичи недоступны.
Было
Контролы 20px, текст 12–14px вес 400, паддинг 0–2px. Плотно, но мимо пальцем.
Стало
Адаптивная плотность. На тач — цели ≥44pt; на курсоре — компактно + hover-уплотнение. Одна система, два режима.
Было
Цвет бренда на хроме местами; 15 тем с ручной настройкой.
Стало
Цвет → в контент, стекло подхватывает. Темы сводятся к системным (Dark Mode + accent + слайдер прозрачности Liquid Glass).
Было
Модальные пикеры индикаторов/символов, кастомная легенда с hover-корзиной.
Стало
Поиск-первый sheet/поповер; стандартное контекст-меню и инспектор объекта вместо самопальных контролов.
Было
IBM Plex Mono для цифр, IBM Plex Sans для UI.
Стало
SF Pro (UI) + SF Mono (цены/таблицы) — нативно, Dynamic Type из коробки.
Было
Данные графика — только визуально; доступность ограничена.
Стало
Audio Graphs + VoiceOver по серии, Dynamic Type, контраст, не только цвет — терминал становится доступным.
Было
Lumino docking — мощно на десктопе, но не переносится на тач.
Стало
Docking только в expanded; в compact — свайп между полноэкранными графиками + быстрый switcher. Та же модель данных.
Дизайн-система: дельта к Apple
Что поменялось бы в токенах относительно текущего TakeProfit.
| Слой | TakeProfit сейчас | By Apple |
|---|---|---|
| Шрифты | IBM Plex Sans / Mono / Nib Pro | SF Pro + SF Mono (+ New York для лонгрида) |
| Цвет | P3, 821 токен, 15 тем | Сохранить P3 + семантику; темы → системные роли (Dark/accent/Liquid Glass slider) |
| Радиусы | 4/8/12/24/36 + smooth 0.6 | То же + концентричность (вложенное повторяет контейнер) |
| Тени | 1px hairline (флэт) | Сохранить флэт; глубина — через Liquid Glass + элевацию |
| Контролы | h20–24, вес 400, паддинг 0–4 | Адаптив: 44pt (touch) / компакт (pointer) |
| Движение | .15s cubic-bezier(.4,0,.2,1) | То же семейство + Reduce Motion; материал-отклик стекла |
| Иконки | кастомный сет | SF Symbols (одни глифы на всех устройствах) |
Примеры сценариев
Как ключевые задачи выглядят на телефоне и на десктопе в этой модели.
Принципы (свод)
- Контент (график) — во весь экран; контролы — тонкий Liquid Glass поверх
- Одна анатомия → size classes (compact/regular/expanded), а не три отдельных дизайна
- Навигация морфится: таб-бар ↔ сайдбар; sheet ↔ поповер ↔ инспектор
- Фичи одинаковы на всех устройствах — меняется только способ дотянуться (touch/pointer/Pencil)
- Цель касания ≥44pt на тач; компактнее под курсор
- Цвет бренда — в контент; up/down — семантика + форма, не только цвет
- SF Pro + SF Mono; Dynamic Type; SF Symbols одни на всех
- Continuity: iCloud-sync раскладок/watchlist/рисунков + Handoff
- Доступность как дизайн: Audio Graphs, VoiceOver, контраст, Reduce Motion/Transparency
- Уважать слайдер прозрачности Liquid Glass и концентричность углов (WWDC26)
- Никаких hover-only паттернов как единственного способа доступа
- Сохранить хорошую инженерию TakeProfit: on-demand WebGL, P3, серверные индикаторы
Оговорки
Что это и чем не является.
Это дизайн-концепт и аргументированное мнение, синтез двух источников: (1) реверс-инжиниринга takeprofit.com (код-бандлы, живой терминал, дизайн-токены — см. остальной ресёрч на этом домене) и (2) официальных Apple Human Interface Guidelines + рекомендаций WWDC26 (Liquid Glass, size classes, концентричность, слайдер прозрачности). Мокапы — схематичные иллюстрации принципов, не пиксель-перфектные макеты и не продукт Apple. Не аффилировано ни с Apple, ни с TakeProfit; названия и торговые марки принадлежат владельцам.
Связанное: полный тирдаун и дизайн-система — на этом же домене одной лентой · оглавление.