Четыре карточки не подменяют напиток вариантом с молоком и отдельно показывают состав каждой версии.
О проекте
Задача
В одной серии есть черный чай, чай с молоком, какао и какао с дополнительным сиропом. Названия без вариантов привели бы к неверному ожиданию состава.
Решение
Я разделил базовый напиток и вариант с добавкой собственными ID. Теплая палитра объединяет серию, крупное название помогает быстро выбрать вкус. В служебной строке указана масса смеси, а состав молочной и карамельной версий написан полностью.
Результат
Четыре рецептуры дают по 300 г смеси. При общей сетке каждая карточка сохраняет свой состав: молоко выделяет вторую позицию, карамельный сироп — четвертую. Читателю не приходится искать различие в сноске.
Что передано заказчику
- index.html
- source.json
- source.csv
- result.json
- result.csv
- engine.js
- checks.json
- style.css
- menu.svg
- specifications.json
Инструменты и подход
Навыки
Содержание 3
Готовая работа
Один формат стакана, разные составы
Четыре напитка рассчитаны на массу 300 г, но одинаковый итог не означает одинаковый рецепт. Я показал компоненты отдельными строками и собрал меню в узкую колонку: стакан, название и состав читаются как одна карточка. Молочная и безмолочная позиции остаются различимыми без поиска мелкого пояснения внизу листа.
Разбор и материалы
Вклад и команда
Я собрал вертикальное меню четырёх напитков и связал каждый стакан с его составом и массой.
Ссылки и материалы
- index.html
- source.json
- source.csv
- result.json
- result.csv
- engine.js
- verify.cjs
- checks.json
- style.css
- menu.svg
- specifications.json
- Сезонные напитки: базовая версия и добавка различаются в карточке — исходная таблица.csv
4 ситуаций для сравнения.
- Сезонные напитки: базовая версия и добавка различаются в карточке — проверка.txt
Критерии проверки этого решения.
- Сезонные напитки: базовая версия и добавка различаются в карточке — паспорт.json
Контекст, ограничения, решение и данные.
- Сезонные напитки: базовая версия и добавка различаются в карточке — инструкция.html
Как открыть и проверить рабочий разбор.
Загружаем комментарии…