Sierra Ingenieros Consultores - Web Design & Brand Identity
Sierra Ingenieros had no active web presence. Their WordPress site had been abandoned since 2021, with an expired SSL certificate and outdated content. The client needed a modern website that clearly communicated two core services, real estate and industrial valuations and renewable energy consulting, while positioning energy projects as the flagship offering.
UX/UI Design · Information Architecture · Design System · Figma · Framer
Information Architecture
Based on research, I defined a sitemap that balanced both service lines while giving energy a visual hierarchy advantage. The navigation was kept minimal to reduce friction for high-intent users like bank officers and project managers.
Design System
The visual language was built around trust and technical expertise, a corporate palette with a deliberate color split: blue for valuations, green for energy. This color coding carries through every component, making it instantly clear which service area the user is reading about.
UI Components
Every component was designed with reusability and consistency in mind. Buttons, cards, badges, and navigation elements were built as a cohesive system in Figma, developed for desktop and mobile following the design system. This made scaling the interface across sections faster and ensured visual coherence throughout the entire site.
Final Wireframe & Prototype
The final wireframe & prototype made in Figma, is a single-page experience structured into six sections: Hero, Services, Projects, About & History, FAQ, and Contact, each following the company's value proposition in a logical narrative flow.
The hero section introduces both core services immediately, giving users a clear entry point from the first scroll. Energy-related sections use green accents to signal premium status and visually separate them from the valuation content, making the firm's key differentiator impossible to miss.
Throughout the page, a consistent card-based system with color coding, blue for valuations, green for energy, allows users to scan and find relevant information quickly without cognitive overload.
Development & Mitigation
With the final Figma prototype approved, the site was developed in Framer, chosen for its built-in SEO tools, automatic SSL, and intuitive auto-layout system that made responsive adjustments for tablet and mobile straightforward and efficient.
The initial plan was to host the site on the client's existing GoDaddy plan to avoid additional costs. The site was exported as HTML and uploaded, but GoDaddy's shared hosting plan didn't include SSL, a critical requirement for trust and SEO. I attempted to solve this by routing traffic through Cloudflare, which added SSL as a proxy layer, but DNS conflicts caused intermittent interference that affected site reliability.
After evaluating the tradeoffs, unreliable SSL, manual file uploads for every update, and limited SEO configuration, the decision was made to migrate fully to Framer hosting. This simplified the entire workflow: SSL is automatic, updates are published in one click, and SEO settings are managed visually without touching code.
Old WordPress URLs were properly redirected via Framer's redirect manager to preserve SEO equity and avoid broken links indexed by Google.
Framer · Cloudflare · Google Search Console · Google Business Profile · SEO
Key Learnings
This project reinforced how early research decisions shape everything downstream. Defining the sections at first and having two main services to spotlight at the hero of the site, despite it being a secondary revenue stream, was a strategic UX decision backed by the client's market differentiation. It also taught me how to navigate real-world constraints like legacy hosting, expired certificates, and DNS migrations while keeping the project moving forward.
