Overview
This is the official website landing page for Perteawi (Perkebunan Bumi Pertiwi), an Indonesian premium tea producer. The page is built as a Vue.js 2 application with TypeScript, using Bootstrap-Vue and following atomic design patterns.
Landing Page Structure
| Section |
Position |
Purpose |
| Tagline Hero |
Top |
Hero banner with full width imagery featuring the brand's core message: PUCUK - PUCUK TEH PILIHAN PERKEBUNAN BUMI PERTIWI |
| Our Values |
Below Hero |
Communicates the 3 core company principles |
| Golden Flush Tea |
Mid Page |
Explains the premium tea production standard used by the brand |
| Tea Origins |
Lower Mid |
Presents plantation location information |
| Our Products |
Bottom |
Showcases available product line |
1. Core Values
The brand is built on these three pillars:
✅ Premium Quality Tea - Uses only selected high-grade tea leaves
✅ Traditional Plantation Revitalization - Sustains heritage farming practices
✅ Farmer Welfare - Ensures positive social impact for traditional tea farmers
2. Product Standard
Perteawi uses Golden Flush / Peko grade tea:
- Only harvests closed tea buds (peko) plus the top 2 adjacent leaves
- Uses Camelia sinensis cultivar
- This is the industry definition for premium grade tea
3. Design & Technical Implementation
- Fully responsive design optimized for mobile, desktop and large 4k+ displays
- Responsive image loading (WEBP + PNG fallbacks with 1x / 2x pixel density)
- Modular atomic component architecture (Atoms / Molecules / Organisms / Sections)
- Bilingual support (Indonesian + English) with inline i18n
- SCSS styling with design system variables and mixins
- Bootstrap grid layout system
Business Positioning
This landing page positions Perteawi as an ethical premium Indonesian tea brand that combines high product quality with social responsibility towards traditional farming communities. The visual design uses natural earth-tone branding, authentic plantation photography and clean minimalist layout.