The Challenge
Bringing consistency to a complex product ecosystem
The products contained dense workflows, operational information, tables, forms, statuses, and actions used throughout the company.
The challenge was not simply redesigning individual screens. It was creating a system flexible enough to support different products without losing consistency, clarity, or usability.
The experience needed to work for teams managing customers, installations, payments, tickets, infrastructure, agents, and support conversations.
Core challenges
- Create consistency across different products
- Simplify complex operational workflows
- Improve hierarchy in information-heavy interfaces
- Design reusable patterns for desktop and mobile
- Make frequent tasks easier to understand and complete
- Support future product growth without redesigning everything again
ImageFinance DashboardDesign System
Creating a shared product language
I created a design system to establish a consistent foundation across the G-Network ecosystem.
The system defined how products should look, behave, and communicate. It helped align typography, spacing, colors, components, interaction states, and reusable interface patterns.
The goal was to create a visual language that could scale across internal tools, mobile experiences, and customer support products.
The system included
- Color and typography foundations
- Spacing and layout rules
- Buttons and form controls
- Tables and data presentation
- Modals and side panels
- Statuses, alerts, and feedback states
- Navigation patterns
- Empty, loading, and error states
- Responsive component behavior
ImageComponentsG-Force
Making complex operations easier to navigate
G-Force is the internal product used to manage G-Network’s daily operations.
The platform supports multiple areas of the company, including customer management, installations, finance, tickets, infrastructure, agents, teams, schedules, and system settings.
Key areas redesigned
- Customer registration and management
- Installation orders and scheduling
- Financial reconciliation
- Tickets and support operations
- External infrastructure management
- Agents, teams, and schedules
- Productivity and reporting
- System settings
Design approach
I standardized recurring patterns such as tables, filters, forms, actions, statuses, and modal workflows.
This made the experience more predictable and reduced the need for each module to solve the same interaction problems differently.
ImageChat DashboardMobile Application
Extending the ecosystem beyond desktop
The mobile application brought key G-Network experiences into a smaller and more accessible format.
The challenge was not to shrink the desktop product, but to identify what mattered most on mobile and redesign those experiences around limited space, touch interaction, and faster access.
I adapted the visual language and components from the design system while preserving the identity of the wider ecosystem.
Design focus
- Clear mobile navigation
- Simplified information hierarchy
- Touch-friendly actions
- Reusable mobile components
- Consistent statuses and feedback
- Focused flows with fewer distractions
ImageMobile App ScreensG-Office Chat
Giving support teams the context they need
G-Office Chat was redesigned to help support teams manage conversations while keeping important customer information visible.
The experience was structured into three connected areas:
- Conversation list
- Active customer conversation
- Customer summary and operational context
This allowed agents to communicate with customers without constantly leaving the conversation to search for information elsewhere.
Customer context included
- Customer information
- Active contracts
- Outstanding debt
- Tickets and requests
- Service status
- Conversation history
Supporting interactions
- Pin conversation
- Mark as unread
- Mute conversation
- Quick responses
- Conversation statuses
- Empty states
- Agent and team management
- Productivity and response-time metrics
ImageChat ConversationsKey Design Decisions
Designing patterns that work across products
Rather than creating isolated solutions, I focused on reusable patterns that could work across the ecosystem.
Consistent actions
Primary and secondary actions follow the same hierarchy across products.
Predictable data presentation
Tables, filters, statuses, and metadata use shared structures to reduce unnecessary learning.
Context without interruption
Important information is shown close to the task, reducing the need to navigate between multiple screens.
Scalable components
Components were designed to support new modules, workflows, and product requirements without losing consistency.
ImageAdmin PanelOutcome
A more connected product ecosystem
The result was a more consistent and scalable experience across G-Network’s digital products.
The design system created a shared foundation, while the redesigns made complex operational workflows easier to understand and manage.
Instead of treating G-Force, Mobile, and Chat as unrelated products, the work established them as connected parts of the same ecosystem.
Scalable components
- A shared visual and interaction language
- More consistent workflows across products
- Clearer information hierarchy
- Reusable components for future features
- Better alignment between design and development
- A stronger foundation for the ecosystem to grow
ImageSidebarsRetrospective
Designing the system behind the screens
The most important part of this project was understanding that consistency is not achieved by making every screen look identical.
Each product had different users, workflows, and constraints. The challenge was to create enough structure to make the ecosystem feel connected while allowing each experience to solve its own problems.
This project strengthened my ability to work across complex systems, collaborate with multidisciplinary teams, and design foundations that can support a product beyond a single release.
