Frog Private Cloud

The Problem

Cloud management applications often suffer from intimidating interfaces that create a high cognitive load. Users frequently struggle with technical configurations, such as IP management, security verification, and OS repository management. The platform needed a design that is not only visually appealing but also actively guides users to minimize errors (e.g., through clear form validation) without compromising strict security standards.

Target Audience

To ensure the platform serves its diverse user base effectively, I designed the interface to accommodate two primary user archetypes with different needs:

• General Users (SMBs & Beginners): Users who need an intuitive, friction-free experience for basic cloud hosting tasks. The design guides them through processes (like account creation and OTP verification) using conversational, friendly micro-copy without overwhelming them with technical jargon.
• Power Users (Sysadmins & Developers): Technical experts who require deep control, efficiency, and clear system feedback. For this group, I focused on streamlined task execution and precise error handling for complex configurations, such as CIDR IP management, PAM authentication, and OS repository tracking.

My Role

As a UI/UX Designer, I was responsible for the end-to-end design process. I received briefs and business requirements directly from stakeholders and translated them into intuitive visual solutions and user flows. I collaborated closely with the development team to annotate flows, ensuring every state (such as error handling and validation) aligned technically and that the application's functionality could be implemented exactly as designed.

The Features

To solve these problems, I designed several key features focusing on usability and clear micro-copy:

• Seamless Authentication Flow: Redesigned the Login and Register pages to build user trust, complete with a minimalist password validation system (using dynamic chips) and informative OTP error handling.
• Privileged Access Management (PAM): Simplified the credential verification flow for the initial platform setup to feel secure yet straightforward.
• OS & App Marketplace: Designed a repository catalog with clear visual morphing for download statuses, allowing users to monitor their Task Queue and downloaded assets without visual clutter.
• Smart IP List Management: Created a network input system with CIDR overlap detection that provides specific, actionable error feedback to users.

Component Library & UI Kit

To maintain visual consistency and bridge the gap between design and development, I built a comprehensive and scalable UI Kit based on atomic design principles, optimized for a Tailwind CSS environment.

• Reusable UI Elements: I designed modular components—such as Buttons (primary, secondary, outline variations), Inputs, Modals, and Badges—focusing on interactive states and clear validation feedback.