design: итерация критика 1
Штамп первого экрана на непрозрачной подложке, цифры под мягким фильтром, зазор кнопка→фото 40px. Ленты-наклейки сняты, у штампов на этикетках разные повороты и сдвиги. Ряд цифр в «Кто обжаривает» заменён одной tag-строкой. Дескрипторы сортов — поля этикетки, «в месяц» после цены набрано Golos. Дрип-пакеты на десктопе: три зоны по центру с вертикальными линейками. Доставка в колонках 7–12, на мобиле без фото мешка. Интерес в форме — радиокнопки. Хелпер typo: неразрывные пробелы и дефисы. Скрипт скриншотов: кадр 390 со скроллом.
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
// Скриншоты для критика: полная страница и первый экран на 390 и 1440.
|
||||
// Скриншоты для критика: полная страница и первый экран на 390 и 1440, плюс кадр 390 со скроллом до y=1500.
|
||||
// node scripts/screenshots.mjs <url> <каталог>
|
||||
// Анимации доигрываются: страница прокручивается до низа, чтобы сработали IntersectionObserver.
|
||||
import { mkdir } from 'node:fs/promises';
|
||||
@@ -22,6 +22,13 @@ for (const width of [390, 1440]) {
|
||||
await page.waitForTimeout(800);
|
||||
await page.evaluate(() => window.scrollTo(0, 0));
|
||||
await page.screenshot({ path: `${outDir}/${width}-full.png`, fullPage: true });
|
||||
if (width === 390) {
|
||||
// третий кадр: середина страницы, видна липкая CTA
|
||||
await page.evaluate(() => window.scrollTo(0, 1500));
|
||||
await page.waitForTimeout(600);
|
||||
await page.screenshot({ path: `${outDir}/${width}-scroll.png` });
|
||||
await page.evaluate(() => window.scrollTo(0, 0));
|
||||
}
|
||||
const overflow = await page.evaluate(() => document.documentElement.scrollWidth - window.innerWidth);
|
||||
console.log(`${width}: ${outDir}/${width}-full.png, горизонтальный выход за экран ${overflow}px`);
|
||||
await page.close();
|
||||
|
||||
Reference in New Issue
Block a user