How I designed a future-ready design system and visual guidelines that makes complex infrastructure easier to understand, evaluate, and trust in the competitive market.
CATEGORIES
Documentation & developer handoff
User Research
UI/UX Design
Prototyping & Interactions
Design Systems
INDUSTRY
Cloud infrastructure / IaaS
CLIENT
DashRDP
AUDIENCE
Developers, IT professionals, automation users, businesses & infrastructure buyers
Challenge
DashRDP provides cloud infrastructure, including RDP, VPS, VPN and dedicated servers to customers worldwide. Its website also serves as a discovery, evaluation, and purchase touchpoint.
DashRDP had built a capable infrastructure business, but its digital experience didn't reflect the quality of its services.
Goals
Simplify: Make complex infrastructure easier to understand and compare.
Build trust: Create a clearer, more credible experience that supports confident decisions.
Scale: Build a maintainable design foundation for future pages, themes and business growth.
Constraints
SEO was DashRDP's primary marketing strategy, so existing website content could not be substantially altered without coordination with the SEO team.
Startup-level resources and timeline.
Cart page cannot be changed.
Project flow
I followed a structured design process from discovery to handoff, revisiting earlier decisions as new insights and feedback emerged. The process provided direction while leaving room for iteration.
User Research
So, who are we designing for?
Website analytics helped a lot to understand the audience and their background. I came to know few additional behaviors of the users.
Where the users are located?
Where users are routed from
User sessions
Average scroll depth
Homepage exit rate
Pages/session
Qualitative research
I interviewed representative users to understand how they discover infrastructure services, evaluate options, and decide which providers to trust. These conversations helped me look beyond analytics and investigate the reasons behind user behavior.
Branding
I redesigned the wordmark to give DashRDP a more distinctive identity while retaining its technical character. The form draws from terminal interfaces, with monospaced typography and carefully balanced geometric details.
I extended the visual identity beyond the website through social media graphics, blog covers, interface styling, and technical explainer diagrams. These applications demonstrate how the brand can remain consistent across different communication formats.
Website redesign
I translated research findings into user personas, prioritized pain points, and a journey map to connect user needs with design opportunities. These helped me focus on the barriers users faced when discovering services, understanding technical offerings, and comparing plans. The goal was to make the experience clearer for users with different levels of technical knowledge while supporting confident decisions.
Design
I explored the landing page as a connected experience, refining its hero, navigation, product explanations, service walkthrough, and pricing. Each section addressed a specific challenge: helping users understand DashRDP's offering, find relevant products, learn how services work, and compare plans. Throughout the process, I balanced usability and visual clarity with business requirements, SEO constraints, and client feedback.
Design system
I converted repeated design decisions into reusable tokens, components, pictograms, guidelines, and light and dark themes. This created a shared foundation for consistency across pages and responsive layouts.
Using AI alongside Figma helped me explore and compare design directions before developing the strongest options further. The system also reduced the time required to design a page across two themes and three breakpoints by approximately 25%, improving efficiency as it matured.
Refining
I reviewed progress with the client weekly through Google Meet, shared designs through Figma, and documented decisions in Notion. Each review helped identify adjustments to information hierarchy, content density, navigation, component behavior, and visual emphasis.
Rather than applying feedback automatically, I evaluated it against user needs, business goals, technical constraints, and design principles. This allowed the experience to evolve through informed iteration while keeping the client involved.
Making trade-offs
The redesign involved balancing usability, visual quality, business priorities, and implementation constraints. For example, navigation needed to expose a growing product catalogue without becoming unnecessarily complex. I used these trade-offs to guide decisions rather than optimizing for aesthetics alone.
Accessibility & Handoff
I incorporated accessibility considerations into the design system, including WCAG AA contrast as a baseline, defined interaction states, consistent navigation cues, and reusable semantic tokens. I also documented components and specifications to help developers implement the designs consistently.
These measures informed the design and handoff process; full accessibility conformance would still require validation of the implemented experience.
Impact
The redesigned experience is still being tested, so final business outcomes cannot yet be measured. The project has, however, delivered clear design-level improvements:
A less homepage-dependent experience
The homepage accounted for roughly 90% of sessions in the earlier dataset, compared with about 24% in the later period. More traffic is now distributed across product and location pages, indicating broader exploration of the website.
A clearer product structure
Reorganized the product catalogue and navigation to make products easier to discover and understand.
A more scalable design foundation
Built reusable tokens, components, and patterns across 19 designed pages, supporting responsive layouts and light/dark themes.
Faster design iteration
The design system reduced page design time across two themes and three breakpoints by approximately 25%, with efficiency continuing to improve as the system grows.
Accessibility built into the system
Established standards for contrast, typography, navigation, interaction targets, focus, and feedback rather than treating accessibility as a final-stage check.
Reflection
Designing for complexity
I learned to make technical infrastructure easier to understand without oversimplifying the product.
AI as a design workflow
Using AI alongside Figma helped me explore more directions, iterate faster, and build more systematic workflows.
Systems over screens
Building the design system reinforced that consistency comes from shared rules and relationships, not just reusable components.
Design is collaboration
Working with stakeholders, developers, and SEO taught me to balance user needs with business and technical constraints.
Thank you for reading
DashRDP is still evolving, and so is the work.
Thank you for taking the time to follow the process, decisions, and lessons behind the redesign.