Alto · Cycle через UI/UX Pro Max skill · 2026

Полный цикл итерации.
5 концепций через research.

Установлен skill UI/UX Pro Max (67 styles, 161 palettes, 99 UX guidelines). Прогнан research: landing patterns + style + UX rules. На основе выкладки сгенерированы 5 концепций. Все — на фирстиле alto: шрифт «Font», только weight 400, hairline 1px, без курсива.

← к остальным версиям research.md ↗ Прод ↗ UI/UX Pro Max ↗

1 · Research через skill

Landing patterns Minimal Single Column · Social Proof-Focused · Scroll-Triggered Storytelling · Immersive/Interactive. Все одобрены для B2B services. Source: landing.csv.
Styles Minimalism & Swiss Style (WCAG AAA, perf ⚡) · Exaggerated Minimalism (oversized type) · Social Proof-Focused. Source: styles.csv.
UX-guidelines (CRITICAL) Touch target ≥44×44px · Touch spacing ≥8px · prefers-reduced-motion · max 1–2 anim/view · ease-out входы · mobile-first. Source: ux-guidelines.csv.

2 · Применённые UX-правила

Touch targetВсе CTA — min-height 56px, табы — 44px. ≥44×44 везде.
Touch spacingGap 8–14px между интерактивами; hairlines между bullets ≥14px.
Reduced motionВ shared.css глобальный фолбэк + в каждой концепции локальный inline-блок.
Max 1–2 animКаждая концепция использует ровно 2 key animations (stagger reveal + одна доминирующая).
Ease-out входыcubic-bezier(.2,.7,.2,1) на reveal, cubic-bezier(.7,0,.2,1) на mask-reveal.
Mobile-firstВсе стили без max-width queries — стартуют с мобайла.

c1 · Single Column

Pattern: Minimal Single Column · Style: Swiss Minimalism

Один поток сверху вниз. H1 → лид → 3 hairline-бенефита с иконками-маркерами → большая CTA → meta «ответ за 1 день». Самый строгий single-CTA focus.

single
Открыть ↗

c2 · Oversized Type

Pattern: Minimal Single Column · Style: Exaggerated Minimalism

Massive whitespace. H1 clamp(40px, 11vw, 64px), eyebrow 10px, 80–96px вертикальных отступов, один CTA + телефон с hairline-underline. Mask-reveal на H1 + stagger.

type
Открыть ↗

c3 · Social Proof

Pattern: Social Proof-Focused · Style: Swiss Minimalism

Доверие сверху. 3 counter-up метрики → hairline-testimonial с аватаром (без italic-цитаты!) → logo grid 6 клиентов с hover → CTA. Звёзды заменены на цифру 4.9.

proof
Открыть ↗

c4 · Story Chapters

Pattern: Scroll-Triggered Storytelling · Style: Swiss Minimalism

3 главы: Проблема · Путь · Решение. Sticky progress-bar под nav (синяя fill на scrollY). Hairline-разделители между главами. Climax CTA внизу.

story
Открыть ↗

c5 · Interactive Reveal

Pattern: Immersive/Interactive · Style: Swiss Minimalism

3 таба: B2C / B2B / Маркетплейс. Тап переключает hairline-panel с описанием сценария. CTA адаптируется. Skip option (по skill UX) обязателен.

tabs
Открыть ↗