Case 02 Ancient LLC Jul 2026 – Present
PepsiCo Pepviz
Marketing landing pages for PepsiCo's Pepviz, built with one international designer. Each article ships as hand-authored HTML, one SCSS file and a few lines of vanilla JavaScript, staged on CodePen so the client can paste it into their own CMS.
- Sass
- CSS
- JavaScript
- Pages
- Seven article landing pages, LP1 to LP7
- Hand-off
- CodePen, with minified and readable CSS
- Team
- One international designer and me
01
Notes from the build
01 / 02
Built to be pasted
No framework, no build step, no npm. The client re-implements each page in its own CMS, so every page keeps the same markup patterns, naming and breakpoint from version to version.
02 / 02
Desktop and mobile art
Charts, tables and infographics ship as separate desktop and mobile SVGs, swapped at 767px, with footnotes linked from superscripts inside the charts.
02
What it's written in
- SCSS 50%
- JavaScript 50%
Estimated from the stack, not measured from the source. Measured figures replace this once the repository is counted.
03
The stack 8
Markup and style
- HTML semantic, one .phyg wrapper per page
- Sass one flat SCSS file per page, BEM-style names, CSS custom properties
- CSS native nesting in the minified build
- Image maps superscript hotspots on SVG charts, one map per breakpoint
Script
- JavaScript vanilla, one small file per page
- Splide the one carousel, on LP2
Delivery
- CodePen Pro asset hosting; the client copies markup, SCSS and JS from the pens
- Figma assets exported per breakpoint