WEB DEVELOPMENT · WORK LOG

Web Developer & Senior Designer at UHS Holdings Nepal — Where Design Finally Met Code

By Sonu Kumar May 2025 – Aug 2025 UHS Holdings Nepal

The title "Senior Graphic Designer and Web Developer" at UHS Holdings was not merely a conjunction of two separate roles — it was a description of a genuinely integrated practice that I had been building toward throughout my entire professional career. At Skyline Tours, I designed for tourism and handed files to vendors. At Sama Publications, I designed for print and worked with printers. At UHS Holdings, for the first time in a professional context, I was both designing and implementing — building the digital experiences I had conceived from initial concept through to deployed production code. This convergence of design and development is something I had been preparing for through years of concurrent self-directed technical learning alongside professional design work, and the UHS role validated that preparation in the most direct possible way: by placing full responsibility for the output of both disciplines in the same hands.

About UHS Holdings and the Digital Transformation Context

UHS Holdings is a diversified holding company operating across multiple business verticals in Nepal, with interests spanning services, technology, and commercial operations. When I joined in May 2025, the organisation was in the midst of a significant digital transformation initiative — recognising that their digital presence and internal digital tools were not keeping pace with the scale and ambition of their business operations. My role was to lead the creative and technical execution of this transformation: redesigning the company's external-facing web presence, developing digital tools for internal operational use, establishing design standards and component libraries that would enable consistent digital output across the organisation, and mentoring internal team members in design and basic web implementation skills. It was, by far, the most comprehensive and strategically significant role I had held to that point in my career.

The Design-to-Code Workflow That Changed How I Design

Being simultaneously responsible for design and implementation changed my design process fundamentally. When you know you will be implementing the design yourself, you design differently — not less ambitiously, but more realistically and more precisely. I began designing in Figma with explicit awareness of the CSS systems I would be building: every spacing decision was a multiple of an 8-pixel base unit, because consistent spacing based on a mathematical scale produces both more visually harmonious outcomes and more maintainable CSS. Every colour in the design was a token in a design system that mapped directly to a CSS custom property. Every component in the Figma design was architected to correspond to a reusable React component. This bidirectional thinking — designing with implementation in mind, implementing with design intent as the constant reference — produced work that was simultaneously more coherent visually and more efficient technically than the standard design-then-implement workflow produces.

Building the Component Library and Design System

One of the first and most impactful projects I undertook at UHS was the establishment of a component library — a set of reusable UI components in both Figma and React that would form the building blocks of all digital interfaces across the organisation. The component library began with the foundational elements: a colour system defined in CSS custom properties and Figma styles, a typography scale covering all heading levels and body text variants, a spacing system, and a set of primitive UI components (buttons, inputs, labels, badges). From these primitives, I built more complex components: navigation systems, card components with multiple variants, data table layouts, form sections, modal dialogs, and notification patterns. Each component was designed and documented in Figma and implemented in React with accessibility attributes, keyboard navigation support, and responsive behaviour. The investment in building this library paid back rapidly: features that might previously have taken days to design and build from scratch could be assembled from existing components in hours. Consistency across the organisation's digital touchpoints improved dramatically, because everyone was drawing from the same system rather than making independent design decisions for every new interface.

Responsive Web Design and Mobile-First Development

Nepal's internet usage statistics mirror a global trend that is particularly pronounced in emerging markets: mobile devices account for the majority of web traffic. UHS Holdings' previous web presence was designed primarily for desktop viewing, with mobile adaptation that was inadequate and inconsistent. Redesigning with a mobile-first approach — establishing the mobile layout as the baseline and progressively enhancing for larger screens — required rethinking the information architecture and visual hierarchy of every page, not merely applying a responsive CSS framework on top of existing desktop layouts. This distinction between genuine mobile-first design and responsive retrofitting is important: the former produces experiences optimised for the primary use case, while the latter produces desktop experiences that happen to also work on mobile, often without the clarity or usability that mobile users need. Every layout decision I made at UHS was validated at 375px width before being extended to tablet and desktop breakpoints.

React Development and Modern JavaScript

The technical implementation of UHS's digital interfaces was built on React, which I had been developing proficiency in through personal projects and my Islington College coursework. At UHS, I applied React in a genuine production context — state management, component lifecycle, API integration, and the specific challenges of building maintainable codebases that other team members need to understand and extend. I adopted a functional component approach throughout, using React hooks for state management and side effects. For data fetching, I used the native Fetch API with custom hooks for standardised loading, error, and success state handling. Styling was handled through a combination of CSS custom properties and CSS Modules, keeping component styles scoped and preventing the specificity conflicts that global stylesheets generate at scale. I also implemented basic performance optimisations including lazy loading for images and React.lazy for code-splitting route-level components, ensuring that the initial page load delivered only the JavaScript needed for the visible content.

Internal Tool Development

Beyond the external-facing web presence, I designed and developed several internal digital tools for UHS's operational teams. These tools ranged from a simple but carefully designed reporting dashboard that aggregated data from multiple sources and presented it in a clear visual format accessible to non-technical management, to more complex workflow tools that digitised previously paper-based processes. Internal tool design is a distinct discipline from public-facing web design: the audience is known and their workflows are well-defined, which enables tighter optimisation for specific tasks. Discoverability — the ability for a first-time user to understand an interface without instruction — is less critical than efficiency for frequent users who perform the same tasks repeatedly. I applied task analysis methodologies to understand the specific workflows each internal tool needed to support before designing the interface, ensuring that the tool design matched actual working patterns rather than imposing a design-centric approximation of what those patterns might be.

Security Considerations in Web Development

My cybersecurity background had direct and practical application in my development work at UHS. Thinking like an attacker while building web applications surfaces security issues at the design and implementation stage — far cheaper and more effective than discovering them through later security assessment. I applied OWASP secure coding practices throughout: parameterised queries (or ORM-level protections) wherever database interaction occurred, output encoding to prevent XSS in any context where user-controlled data was rendered in HTML, CSRF tokens on all state-changing forms, proper security headers (Content-Security-Policy, X-Frame-Options, Strict-Transport-Security), secure cookie configuration (HttpOnly, SameSite, Secure flags), and input validation at both client and server sides. I also implemented dependency vulnerability scanning as part of the development workflow, using automated tools to detect known CVEs in NPM packages before they could be deployed to production. This integration of security thinking into the development process — DevSecOps in practice — produced more secure applications with minimal additional overhead, because security was designed in rather than bolted on after the fact.

Mentoring and Knowledge Transfer

My role at UHS included responsibility for upskilling internal team members who had limited prior exposure to modern design and development practices. I structured a programme of informal workshops covering the fundamentals of responsive web design, the principles of the component-based design system I had built, and basic HTML and CSS skills for team members who needed to make minor content updates independently. This mentoring dimension of the role was personally rewarding and professionally instructive — teaching technical concepts to people with no prior technical background develops a precision in explanation that serves me well in all communication contexts, from client presentations to academic writing to security report delivery. The ability to make genuinely complex ideas accessible without oversimplifying them is among the most valuable professional skills I have developed, and it develops most effectively through the practice of teaching.

Looking Back at the Full Journey

The UHS Holdings role represented the convergence of every strand of professional development I had been pursuing simultaneously: graphic design craft developed through Skyline and Sama, web development skills built through academic study at Islington and personal projects, and security thinking developed through TryHackMe, AWS training, and active offensive security research. The combination made me a practitioner who could operate credibly across multiple disciplines — not superficially, but with genuine depth in each. As I move further into cybersecurity as my primary professional focus, the design and development experience I accumulated through these roles remains actively valuable: it informs how I approach security architecture, how I communicate findings, how I build security tools, and how I think about the human factors that make security controls succeed or fail in practice. Every professional experience, even those that seem peripheral to a chosen path, contributes to a richer, more multidimensional practitioner.

> ABOUT SONU KUMAR

Sonu Kumar is a cybersecurity specialist, web developer, and graphic designer from Kathmandu, Nepal. Senior Graphic Designer and Web Developer experience at UHS Holdings. TryHackMe Top 1% globally. BSc (Hons) Computing at Islington College (London Metropolitan University).

Visit Portfolio →