2025
Building for a Flexible and Efficient NGINX entry point on Google Cloud Platform
DELIVERABLES
UX strategy
User Flows
Wireframes
User Experience
User Interface
TIMELINE
6 months / 4 milestones
Sep 18, 2025 -> EA release
Oct 13, 2025 -> GA release
Designing a Unified Console for Multi-Cloud Management
NGINXaaS for GCP is a standalone NGINX suite that centralizes management of NGINX instances across locations and environments. From a single console, teams can configure services, manage SSL certificates, monitor performance, and address security issues without manual infrastructure work.
As the lead product designer, I defined the UX strategy and structure, and partnered with PM, Engineering, Documentation and Google Cloud teams to deliver the MVP in 6 months through 4 key milestones: provisioning, domain/TLS setup, routing, and observability.
THE PROBLEM
Scalable Cloud Entry Points Beyond Azure
NGINX had a native, tightly integrated onboarding flow on Azure, but no equivalent for other public clouds. To support multi-cloud expansion, we needed a standalone onboarding suite that could scale across platforms—starting with Google Cloud, then extending back to Azure and beyond.
Without this shared entry point, users were forced to piece together manual, error-prone setups for IAM, DNS, TLS, and routing—slowing adoption and creating inconsistent experiences.
UX Challenge
Build a clear, guided entry experience for GCP that could scale across clouds and match the polish of Azure’s native integration.
Limited Entry Points
NGINX had a native onboarding flow on Azure but no equivalent for other public clouds.
Scalable UI
We needed a reusable framework and scalable UI that could support Google Cloud first, then extend to other major providers.
THE VISION
Unified NGINX Experience
Create a unified NGINX experience across clouds—a single console and onboarding framework that feels consistent whether users start on Google Cloud, Azure, or beyond.
THE GOAL
Migrating and Optimize the NGINX User Experience
NGINX powers nearly 40% of the web, but its current cloud experience is fragmented and tied closely to Azure.
With NGINX SaaS for Google Cloud, the goal was to create a unified, standalone platform that could scale across all major public clouds in the future.
WAYS OF WORKING
Go To Market Collaboration
This project moved fast, so tight collaboration was everything. I worked hand-in-hand with PM, engineering, and docs through four structured milestones — from provisioning all the way to observability.
With PM, I shaped the UX strategy and broke down the work into clear phases. With engineering, I shared early design drafts, explored constraints together, and adjusted flows as we built. With docs and marketing, I synced closely with the writer to make sure the documentation site reflected what we shipped — with clear definitions and instructions so users could actually understand the new experience.
Timeline
March 2025
June 2025
Sep 2025
October 2025
Milestone 1
Deployment
Creating NGINX instances on Google Cloud.
Milestone 2
Configuration
Managing NGINX instances on Google Cloud.
Milestone 3
EA
Fully managed, scalable, and secure solution.
Milestone 4
GA
User management, billing, geo control, monitoring.
Collaboration with
PMs
-
Shaped UX strategy and milestones
-
Broke work into clear phases
-
Aligned on priorities throughout
Engineers
-
Shared early drafts for feedback
-
Explored constraints together
-
Iterated flows during build
Docs & Marketing
-
Synced closely with writer
-
Ensured docs matched shipped flows
-
Clarified definitions and instructions for users
THE SOLUTION
NGINX SaaS for GCP
Key Features:
-
Create and manage NGINX deployment on Google Cloud
- Managed configuration and security certificates of NGINX deployments
- Frictionless subscription and onboarding experience
- Advanced features: geographical controller, account management
New User Sign up / Log in
New user will need to go through Google Cloud sign up flow
Welcome message and guided walkthrough for a new user
Dashboard
Metrics to monitor based on requirements from PM and Engineering
Empty state of the dashboard
NGINX Deployment
List of NGINX deployments on Google Cloud.
Create new NGINX deployment on Google Cloud.
NGINX Configuration
NGINX Configuration allows one-click quick deployment.
Configuration versions can be published to any existing deployment.
NGINX Certificates
SSL Certificates and CA bundles can be deployed to specific deployments.
Cert versioning allows easy management
Account & User Management
Account management associated with organizations.
Allow user management within each account.
Challenges
CHALLENGE 1
Aligning Growth Initiatives with Market Needs
Build Consensus
This initiative came from the PM team, and we went through several planning sessions to align on priorities.
At NGINX, we’re still a relatively small team within a larger organization, so much of our early wayfinding relied on customer consumption patterns and observation rather than formal processes. We also leaned on Gartner research to understand market positioning and opportunities in the enterprise server provider space.
Terminology Evolution
“Composition profile –> Server Profile –> Server Group –>Resource Class –> Instance Type”
These terminology changes reflect underlying conceptual shifts and the company’s positioning of the composer in the market. Our goal was to achieve simplicity, ensuring ease of understanding while conveying a sense of novelty.
Reframe the Solution
Between internal releases 2 and 3, the new executives challenged me to improve the clarity of our novel concepts. I accomplished this by reframing our conceptual metaphor, simplifying workflows without reducing functionality. We were fortunate to simplify these concepts early. Making such a change after the product launched would have been resource-intensive.
Sitemaps and Concept maps
CHALLENGE 2
Environment Redesign
Feedback Loop
We built our feedback loop mainly from development team, design team and product stakeholder.
After the MVP launch, our internal stakeholders, particularly engineers, shared feedback that the environment page wasn’t easy to navigate. One of the founders also highlighted challenges in navigating through lists and cards to find specific instances.
To address this, I conducted interviews with two engineers to gather their insights on the environment. Additionally, I received feedback from an interview conducted by other UX team members with one of our customers.
Key Insights From Interviews
Collected feedback from a Fungible Field Engineer
”I like the folder structure in VMware vSphere. It shows resources clearly.
Observed a QA engineer go through an ideal user workflow
”The server profile creation is a key point where we should educate the user what his choice could lead to.
Other team members interviewed one of our customer
”I didn't realize environment template exists and don't know how to create an environment template.
Evaluation of the current design
Based on the feedback, I started an iteration process to figure out the pain points in the current UI.
Problems within the existing design
- There is no quick link to instances from the environment overview
- The server profile and instance relationship is not clear
- Scalability issues, i.e. thousands of instances
- Action buttons not indicating the correct information hierarchy
Environment Tree Navigation
This informed me to start working with the founder to explore environment navigation.
Option 1 – Make Instances more important
Option 2 – Make server specification more important
Option 3 – Using tree navigation for a single environment
Final Design
- Flatten the environment structure to make the concept more clear.
- An expandable list can make the environment more scalable.
- Designed a dashboard to monitor the workload performance.
- Added instance overview and a quick link to instances.
CHALLENGE 3
Environment Creation Form & Flow
In my design process, I prioritized several considerations for numerous iterations and explorations:
- Clarity: Emphasizing simplicity in the UI and minimizing structural layers to prevent confusion.
- Efficiency: Streamlining the user experience for faster environment deployment with fewer clicks, reducing the likelihood of errors.
- Development Effort: Minimizing the need for custom components to optimize development efforts.
Internal Release 3 – “preview and bind” exploration
Backlogged due to the complexity and development effort.
FDC 1.0 – card layout
Simplified the card and reduce any unnecessary functionality
FDC 2.0 – two-columns “checkout” layout
Added a preview column similar to the cart during online shopping checkout
FDC 3.0 Evolution
Functionality
- Expanded specification categories to include GPU, boot source, and Cloud-init.
- Maintained a comfortable information density.
- Increased flexibility by providing more options to add instance types.
- Added numbers to inform users about the resources to be provisioned, reducing cognitive load.
Visual
CHALLENGE 4
Environment Template Evolution
I made significant changes to the environment templates and introduced two major advancements with FDC 3.0.
Template Sharing & Promotion
- Integrated a promotion flow into the template marketplace.
- Introduced the template marketplace to Data Center Admins (DCAs).
Tenant Admin – Promote to data center template catalog
Data Center Admin – Review and approve promotion, manage tenant access to a shared template
Version Control for Tenant Environment Templates
- Enabled Tenant Admins to save their test environment as a template version.
- Introduced version control for updates and rollbacks in tenant environment templates.
FDC 1.0 – basic template info and edit actions
FDC 3.0 – Tenant admin can save an environment as a new template or a version within an existing template. This is especially helpful when users want to maintain multiple versions of the same application.
Design System Component – Template Card
Information Architecture: Trimmed unnecessary details from the template specification, enabled users to input custom descriptions, and concealed action buttons for a cleaner look.
Visual Exploration: Incorporated icons and tokens, and fine-tuned card layout for improved aesthetics.
Design System Pattern: Enhanced the scalability of the design pattern for a more robust and adaptable system.
TOOL & UX COLLABORATION
Improve Figma Workflow
I explored ways to enhance our Figma workflow, including things like how we organize files, manage projects, and set up project templates.
The UX team seamlessly adopted the new workflow, resulting in improved internal collaboration, reduced miscommunication, enhanced project alignment, and smoother handoffs to the developers.
Each team roughly maps to our cross-functional product teams (pods).
To start a project, create a new Team and create projects.
Each team has five main types of projects (or “folder”):
Master Wireframes, 🏗 In Development, 🏆 Work In Progress, 🏝 Future, 🗃 Archive
LAUCH & IMPACT
Product Launch & Positive Results
🥳 FDC 1.0 celebrated a successful launch in August 2020.
📈 10+ Customers:
The product gained traction with over 20 acquired customers, spanning university computing labs, government organizations, and private companies.
👍 Positive Feedback:
The product demos received positive and impressive feedback, earning praise from VPs of several major tech companies.
➡️ Significant Move:
In August 2022, Fungible was acquired by Microsoft, just before FDC 3.0 was about to roll out. Unfortunately, due to shifts in business goals, FDC underwent retirement and organizational restructuring.
TAKEAWAYS
Lessons Learned
Simplicity Matters: Keep your initial design simple and clear. In innovative products, user education might be needed to adapt to novel concepts. Leveraging industry-common patterns helps users get started quickly.
Start Small, Think Big: Embrace iterative and incremental development. Avoid a Big Bang delivery for complex and innovative products. Prioritize small, achievable steps to refine and enhance the product gradually.
Flexibility is Key: Design with flexibility to accommodate evolving requirements. In the journey of product development, some features might be backlogged or thrown into the parking lot. A design solution must be adaptable to future needs.
Thorough Consideration: Be thorough in your design process. Explore fail-safe solutions and provide users with recovery paths from potential failures. Offer necessary guidance to reduce the room for mistakes and enhance the overall user experience.
