Ilifielt
A product-focused website for automotive lining materials, combining a structured felt catalogue with a linear-metre estimate calculator.
Client work CATALOGUE 2026
Context
Ilifielt presents self-adhesive and non-adhesive felt materials for camper vans, commercial vehicles and interior lining applications.
- Ilifielt
- Automotive materials
- Product catalogue and calculator
- Client work
- In development
- 2026
Problem & objective
Visitors need to distinguish material types, understand applications and estimate the required quantity before making an enquiry.
- Distinguish self-adhesive and non-adhesive materials clearly
- Estimate quantity in linear metres from dimensions
- Keep provisional business data separate from confirmed information
Create a straightforward digital product experience that helps users choose a material and calculate an estimated purchase requirement.
(03) Plates
Solution & decisions
A static Astro catalogue with a distinctive material-led hero, product presentation, application information, installation guidance and an interactive calculator for linear-metre estimates.
Architecture
The site is organised around the product: a material-led hero introduces felt by the linear metre, product and application pages explain where each material is used, installation guidance supports the decision, and a calculator converts requested dimensions into an estimated order.
Design
A dark, material-led hero and restrained product presentation keep attention on the felt and its applications. The interface stays practical around the calculator rather than becoming decorative.
-
Static-first Astro architecture
Product and guidance pages are generated statically, keeping the catalogue fast and simple.
-
Native JavaScript for calculation
The linear-metre estimate runs without a framework to keep the interaction light and self-contained.
-
Product information separated from provisional data
Confirmed product information is kept apart from business details that remain under development.
Astro, TypeScript and Tailwind CSS provide the static build and responsive layout; native JavaScript powers the linear-metre calculator.
Implemented scope
- Product catalogue and material presentation
- Application and installation guidance
- Linear-metre estimate calculator
- Supporting documentation and enquiry routes where configured
Verification & outcomes
The current implementation provides an organised foundation for product exploration and cost estimation. Final business details, documentation and parts of the content and design remain under development.
- Publicly reachable at ilifielt.es
- Product, calculator, application and installation sections render
- Astro
- TypeScript
- Tailwind CSS
- JavaScript