Energética Garraf Website

Table of Contents

1. Overview
2. Role
3. Problem
4. Goal
5. Solution
   • Understanding User Needs
   • Core Features
   • Design and Development Process
6. User Testing
7. Challenges and Learnings
8. Final Thoughts

Overview

Energética Garraf is a modern website designed for an energy consulting business that helps families and businesses optimize their electricity and gas bills. Founded by María Luque, the platform provides personalized energy advisory services, working with the leading energy companies in Spain. Built with Astro, Tailwind CSS, and TypeScript, the site offers an intuitive experience that makes it easy for clients to understand their savings potential and request free consultations.

Role

Lead Developer and Designer

Problem

The energy consulting business faced these challenges:

1. Difficulty in explaining complex energy savings to potential clients online.
2. Lack of a digital platform to showcase their expertise and client testimonials.
3. No easy way for clients to request energy analysis and consultations.
4. Limited online presence despite having over 10,000 satisfied clients.

Goal

1. Develop a professional website to explain energy advisory services clearly.
2. Implement a client testimonials section to build trust and credibility.
3. Build an intuitive contact system with WhatsApp integration for immediate communication.
4. Showcase partnerships with major energy companies (Naturgy, Iberdrola, Repsol, Endesa, etc.).

Solution

Understanding User Needs

To better understand the needs of homeowners and businesses looking for energy savings, we conducted research and gathered insights:

• Transparency: Clients want to understand how much they can save and how the process works.
• Trust Building: Users need to see real testimonials and company partnerships.
• Quick Contact: A fast way to reach the consultant increases conversion rates.
• Clear Services: Users expect to understand what services are offered and the benefits.

Core Features

1. Services Section: Detailed breakdown of energy advisory services (personalized consultation, bill optimization, renewable energy solutions).
2. Statistics & Results: Showcasing impressive numbers (+10,000 satisfied clients, 25% average monthly savings).
3. Partner Companies Display: Visual presentation of partnerships with major energy companies.
4. Testimonials Section: Real client reviews with ratings to build credibility.
5. Team Section: Introducing María Luque and the professional team behind the business.
6. FAQ Section: Answering common questions about the service.
7. WhatsApp Integration: Quick contact button for immediate consultations.
8. Contact Form: Multi-channel contact system with form and direct WhatsApp link.
9. Responsive Design: Optimized for desktop, tablet, and mobile users.

Design and Development Process

1. Frontend: Built using Astro for optimal performance and SEO.
2. Styling: Designed with Tailwind CSS for a professional and modern look with a distinctive blue-green gradient.
3. Interactivity: Used TypeScript for smooth form validation and dynamic elements.
4. SEO Optimization: Structured metadata and content to improve search rankings for energy consulting services.
5. Performance: Optimized images and lazy loading for fast page loads.

User Journey

1. Hero Section: Clear value proposition - “Reduce el coste de tu factura energética” with direct call-to-action.
2. Services Section: Explanation of the four main services offered.
3. Partner Companies: Building trust by showing collaborations with recognized energy brands.
4. Team Section: Personal introduction to María Luque and the team.
5. Statistics: Impressive numbers that validate the business success.
6. Testimonials: Real client stories that demonstrate value.
7. FAQ Section: Addressing common concerns and questions.
8. Contact Section: Multiple ways to get in touch (WhatsApp, email, form).

User Testing

We tested the website with potential clients and gathered feedback:

• Clarity: 9/10 users understood the value proposition immediately.
• Trust: 8.5/10 users felt confident about the service after seeing testimonials and partner companies.
• Navigation: 9/10 users found the site easy to navigate and information well-organized.
• Contact: Most users appreciated the WhatsApp integration for quick consultations.

Challenges and Learnings

1. Complex Information Simplified: Making energy consulting easy to understand for non-technical users required careful content strategy.
2. Trust Building: Integrating real testimonials and partner company logos was crucial for credibility.
3. WhatsApp Integration: Implementing seamless WhatsApp communication improved lead generation significantly.
4. Multi-location Strategy: The business expanded to multiple offices (Les Roquetes, Torredembarra, Vilaseca), requiring clear communication of geographic coverage.
5. Local SEO: Optimizing for both local Catalonia searches and nationwide Spain coverage.

Final Thoughts

Energética Garraf successfully transformed the business’s digital presence, making energy consulting accessible to clients across Spain. The website effectively communicates the value proposition, builds trust through testimonials and partnerships, and facilitates easy contact through multiple channels. The result is a professional platform that supports the business growth and helps clients understand how they can save on their energy bills.

Key Metrics:

• Clean, professional design that reflects the business values
• Multiple contact channels with WhatsApp integration
• Comprehensive service explanation
• Strong trust-building elements (testimonials, partnerships, statistics)
• Responsive design optimized for all devices