SNAK
Informative Website

Luceal Informative Website

Screenshot of Luceal's homepage showing the modern and professional design.
Duration: 1 month
Period: February - March 2025
Astro TypeScript Tailwind CSS AWS Amplify Cloudflare

Project Summary

Luceal needed a modern, accessible, and high-performance website to showcase its services, team, and experience. The website required security to prevent denial-of-service (DOS) attacks, so a firewall was integrated to block malicious bots.

Problem

Normally, the Luceal team, a company dedicated to providing electrical engineering solutions, used to send PDFs to interested clients to explain what they do. However, this was not an optimal way to showcase their work or reach new potential clients, since they constantly had to update the PDFs, send them manually, and new clients could not discover them through the web. In other words, they were limited to a static and not very accessible format.

Solution

Given this situation, it was decided to create an informative website that not only showcased Luceal’s services and team, but also served as a portfolio of their previous projects. This way, potential clients can see the work done, understand the services provided, and contact Luceal directly for more information. Additionally, by being a centralized source of information, the need to send multiple PDFs is eliminated and accessibility is improved.

Proposed Solutions

Given the need for an informative website, two solutions were considered:

  • Static Website: A static website that displays information clearly and accessibly, where the content shown to all visitors is the same.
  • Static Website + Contentful Management System (CMS): Integrate a CMS to allow content management without technical knowledge, making updates and maintenance easier.

Chosen Solution

A static website built with Astro, TypeScript, and Tailwind CSS was chosen.

  • Reasons:
    • Performance: Static pages are fast and efficient, improving user experience.
    • SEO: Static pages are easily indexable by search engines, improving online visibility.
    • Maintenance: With Astro, content can be managed simply and efficiently, without a complex CMS. Also, since changes to the site are minimal, a CMS is not required for content management.

Solution Development

Following a waterfall methodology, the solution was developed in different phases:

  1. Requirements Analysis: Through various meetings, the client’s needs were defined and the project objectives established.
  2. Page Design: Thanks to Gonzalo Herrera, a modern and professional UI/UX design was created that reflects Luceal’s identity.
  3. Development: The site was implemented using Astro, TypeScript, and Tailwind CSS, ensuring clean and maintainable code with Atomic Design.
  4. Deployment: The website was deployed on Amazon Web Services (AWS), adding a firewall to prevent DOS attacks. Access from different devices and compliance with functional and aesthetic requirements were also verified.

Pages

Different sections and their corresponding pages were developed:

  • Home: A summary of all other pages
  • About Us: Shows the company’s values and team members
  • Services: Display of main services offered
  • Projects: Portfolio of completed works
  • Gallery: Visual display of projects

Performance and SEO

Optimizations were implemented to ensure optimal performance and good visibility in search engines:

  • Generation of static sites with dynamic content
  • Advanced image optimization (lazy loading, .avif)
  • Core Web Vitals optimization

Security

To ensure website security, a Cloudflare firewall was implemented to protect against denial-of-service (DOS) attacks and malicious bots. This ensures the website remains accessible and functional for legitimate users.

Business Impact and Results

The implementation of the website exceeded the initial objectives, generating a tangible impact on Luceal’s business:

  • Increased Visibility: There has been a notable increase in web traffic, allowing Luceal to reach new potential clients who previously could not contact them organically.
  • Improved Operational Efficiency: The sales team no longer has to manage and send PDFs manually, allowing them to spend more time interacting directly with clients and closing projects.
  • Cost Optimization: A static solution was chosen that, in addition to meeting high performance and security requirements, represented a more economical long-term option compared to solutions requiring a CMS, minimizing hosting and maintenance costs.

Results

The Luceal website was deployed according to the user’s needs, both functionally and aesthetically. The website is modern, accessible, and high-performance, meeting the necessary security standards to prevent DOS attacks. Additionally, it has been optimized for SEO, improving its online visibility and making it easier for new potential clients to discover.

Contact Us

Have a project in mind? We'd love to hear more details and help you bring it to life!

Contact via Notion