Nov 11, 2025
Pacto Estudio
Overview
Pacto Estudio is an architecture firm that needed a modern, interactive portfolio to showcase their projects. The goal was to launch fast—they were attending an architecture expo in Milan—to validate direction with clients, and later scale the platform without the complexity of a custom backend.

Role
Lead Designer & Developer
UX/UI Design
Front-End Development (HTML, CSS, JS, PHP)
Lightweight “database” integration (Sheet.best)
Media hosting (Cloudinary)
📸 Image suggestion: Simple badge strip (roles, stack) or a small tech-architecture diagram.
Core Problem
The studio needed a quick release while keeping a clear path for future scalability. The challenge was balancing time-to-market and good design, with a flexible technical setup that avoided heavy infrastructure.
Constraints
We had a tight deadline and a limited budget. This was also a side-hustle for me, so time was scarce and complexity had to stay under control.
Solution
A two-step approach ensured both speed and sustainability:
Rapid MVP to test and validate early — using Sheet.best (Google Sheets as a simple backend) and Cloudinary (for media).
Scalable implementation — replacing Sheet.best and Cloudinary with PHP + a custom admin panel to improve performance, content management, and long-term maintainability, without building a heavy backend.
Rapid MVP

Final delivery

Process
1) Understand the Goal (WHY)
The client already had a site on Wix, but it was dated and off-brand. With Milan around the corner, I needed a direction quickly. I asked the team to collect top-tier architecture websites they admired, so I could align on information architecture and look & feel fast.
Because of the deadline, I skipped formal research steps like audience definition and in-depth context studies. We assumed most visitors would browse on mobile, so the site should be mobile-first. Ironically, moving too fast, I initially designed for desktop only—a rookie mistake I had to correct later.
Their old website

2) Align on Inspiration
I asked them to share inspirational sites. We focused on these:
https://big.dk/projects/the-plus-3837
https://baag.com.ar/producciones/es/
We chose the last one as the main inspiration to guide UI behavior, component interactions, and content presentation—while honoring Pacto’s brand guidelines.
3) Wireframing & Reviews
I created quick wireframes to align with stakeholders before their trip to Milan. We met in person, discussed how to capture the essence of the Pacto brand, and iterated. The first session was long and intense; by the second meeting, integrating feedback, we had a final direction.
I didn’t prototype at this stage due to time constraints; stakeholder validation and a clear goal mattered more. I also didn’t use a UI kit to preserve creative flexibility.

https://www.figma.com/design/sQyCImntjE5IFk8JkgEDHi/Pacto?node-id=0-1&t=2t2ZJuJz0bTFB9iV-1
4) MVP Development (Sheets + Cloudinary)
With UI direction approved (mostly desktop), I had one week to deliver a working site and a simple way to upload projects and images.
Building a backend in PHP from scratch would have taken too long. Instead, I used Sheet.best to turn a Google Sheet into a lightweight “database” and Cloudinary for media hosting. The content team could:
Add/edit project fields in Google Sheets
Upload images/videos to Cloudinary and paste the URLs into the sheet
See everything rendered on the site via a JS integration with the Sheet.best API
This let us ship fast and test real content: what information to show, how much of it, image count/weight, etc. The approach freed up time for polish, interactions, and animations, so the first release felt like a real product, not a demo.
We tested the MVP in the second meeting. The team loved it—they gave detailed feedback and could already edit content via Sheets.


https://docs.google.com/spreadsheets/d/1vCJe0p8Xjy48est1UIJccP7pxG3o-1IT5rM6qgjMt4s/edit?usp=sharing
5) Scale-Up (PHP + Custom Admin Panel)
Post-MVP, the team found Sheets limiting for editing data, organizing projects, and managing team details. For the second release, I rebuilt the site in PHP and added a custom admin panel to streamline content management and improve performance.
They returned from Milan with great feedback. We incorporated all the learnings from v1. The PHP + Admin version was adopted with no further changes—the team was very happy with both the UX and the improved day-to-day workflow.


Results
Shipped an MVP in ~1 week, enabling early validation ahead of the Milan expo.
Content autonomy from day one (v1 via Sheets), then streamlined operations (v2 via PHP + Admin).
Improved performance and maintainability after removing external dependencies.
High stakeholder satisfaction: v2 was approved without additional changes.
Conclusion
Key takeaways
Don’t let urgency erase fundamentals: remember the full design process—especially mobile.
A two-step approach (MVP → scalable build) lets you ship fast and then harden what works.
With tight budgets and timelines, simple infrastructure (Sheets + Cloudinary) can be a powerful bridge to a robust solution.
We first considered Framer or Webflow due to budget, but the client needed behaviors and management flows that were easier to deliver with custom code.






