Case Study
Scaling TDS -
Website Redesign & Design System
Led the redesign of the TDS marketing website across desktop, tablet, and mobile while creating a design system that established a scalable foundation for future digital experiences.
Overview
Modernizing TDS's digital presence with a responsive website and scalable design system.
TDS wanted to modernize their digital presence with a responsive marketing website while establishing a unified design language that could scale beyond a single product. Alongside redesigning the website, I created a design system that standardized visual foundations, reusable components, design tokens, and documentation, enabling greater consistency and a smoother collaboration between design and engineering.
Client
TDS Telecom
Role
Senior Visual Designer
Duration
4+ Months
Platforms
Desktop, Tablet & Mobile
Deliverables
Responsive Website, Design System, Component Library, Design Tokens, Documentation, Developer Handoff
The Challenge
01
The existing experience lacked consistency across pages and offered little scalability for future enhancements. The project required redesigning the website while simultaneously creating a design system that could support future products and accelerate development.
Redesign the entire website for desktop, tablet, and mobile
Create reusable components instead of page-specific designs
Establish a scalable visual language
Build a design system while development was already underway
Improve accessibility, usability, and consistency across the experience
Process
02
UX Audit & Discovery
IA & Layout
Responsive UI Design
Design System
The project followed an iterative workflow involving design reviews, stakeholder collaboration, and close coordination with engineering. Every decision was validated across all responsive breakpoints while ensuring components could be reused within the design system.
Website showcase
03
Before
After
The redesigned website introduced a cleaner visual hierarchy, improved readability, consistent layouts, and responsive interactions across desktop, tablet, and mobile.
Responsive Design
04
Every page was designed responsively instead of adapting desktop layouts afterwards. Components were built to scale naturally across all breakpoints.
Design System
05
Alongside the website redesign, I created a comprehensive design system that standardized UI patterns, visual foundations, reusable components, and implementation guidelines. The system was designed to improve consistency, accelerate future product development, and simplify collaboration between designers and developers.
Foundations
Color Tokens
Typography
Spacing System
Components
Variants & States
Documentation
Developer Handoff
Design System Highlights
06
Foundations
Color, Typography, Spacing, Grid, Elevation and Icons.
Components
Reusable responsive components with variants and interactive states.
Design Tokens
Variables powering colors, spacing, typography, radius and layouts.
Documentation
Comprehensive guidelines, annotations and implementation references.
My Contributions
07
I was responsible for:
UI Design
Responsive Design
Design System
Design Tokens & Variables
Component Architecture
Component Documentation
Accessibility
Design QA
Developer Handoff
Cross-functional Collaboration
UX Strategy Review
Gallery
Outcome
08
Responsive Design
Seamless experience across desktop, tablet, and mobile breakpoints
Scalable System
Design system with reusable components and foundations
Developer Ready
Comprehensive documentation and developer handoff guidelines
Future Ready
Modular architecture designed for long-term scalability and growth
Reflection
09
The project demonstrated the value of designing a product and its design system together. Building reusable foundations alongside the website ensured long-term consistency, simplified implementation, and created a scalable framework for future digital experiences.
Next Case Study
{Your Next Project Name}
Case Study
Scaling TDS -
Website Redesign & Design System
Led the redesign of the TDS marketing website across desktop, tablet, and mobile while creating a design system that established a scalable foundation for future digital experiences.
Overview
Modernizing TDS's digital presence with a responsive website and scalable design system.
TDS wanted to modernize their digital presence with a responsive marketing website while establishing a unified design language that could scale beyond a single product. Alongside redesigning the website, I created a design system that standardized visual foundations, reusable components, design tokens, and documentation, enabling greater consistency and a smoother collaboration between design and engineering.
Client
TDS Telecom
Role
Senior Visual Designer
Duration
4+ Months
Platforms
Desktop, Tablet & Mobile
Deliverables
Responsive Website, Design System, Component Library, Design Tokens, Documentation, Developer Handoff
The Challenge
01
The existing experience lacked consistency across pages and offered little scalability for future enhancements. The project required redesigning the website while simultaneously creating a design system that could support future products and accelerate development.
Redesign the entire website for desktop, tablet, and mobile
Create reusable components instead of page-specific designs
Establish a scalable visual language
Build a design system while development was already underway
Improve accessibility, usability, and consistency across the experience
Process
02
1. UX Audit & Discovery
2. Information Architecture
3. Responsive UI Design
4. Design System
The project followed an iterative workflow involving design reviews, stakeholder collaboration, and close coordination with engineering. Every decision was validated across all responsive breakpoints while ensuring components could be reused within the design system.
Website showcase
03
Before
After
The redesigned website introduced a cleaner visual hierarchy, improved readability, consistent layouts, and responsive interactions across desktop, tablet, and mobile.
Responsive Design
04
Every page was designed responsively instead of adapting desktop layouts afterwards. Components were built to scale naturally across all breakpoints.
Design System
05
Alongside the website redesign, I created a comprehensive design system that standardized UI patterns, visual foundations, reusable components, and implementation guidelines. The system was designed to improve consistency, accelerate future product development, and simplify collaboration between designers and developers.
Design System Highlights
06
Foundations
Color, Typography, Spacing, Grid, Elevation and Icons.
Components
Reusable responsive components with variants and interactive states.
Design Tokens
Variables powering colors, spacing, typography, radius and layouts.
Documentation
Comprehensive guidelines, annotations and implementation references.
My Contributions
07
I was responsible for:
UI Design
Responsive Design
Design System
Design Tokens & Variables
Component Architecture
Component Documentation
Accessibility
Design QA
Developer Handoff
Cross-functional Collaboration
Gallery
Outcome
08
Responsive Design
Complete experience designed across desktop, tablet, and mobile.
Scalable System
Component library and design foundations.
Developer Ready
Comprehensive documentation and implementation guidance.
Future Ready
Scalable architecture supporting future website growth.
Reflection
09
The project demonstrated the value of designing a product and its design system together. Building reusable foundations alongside the website ensured long-term consistency, simplified implementation, and created a scalable framework for future digital experiences.
Next Case Study
{Your Next Project Name}
Case Study
Scaling TDS -
Website Redesign & Design System
Led the redesign of the TDS marketing website across desktop, tablet, and mobile while creating a design system that established a scalable foundation for future digital experiences.
Overview
Modernizing TDS's digital presence with a responsive website and scalable design system.
TDS wanted to modernize their digital presence with a responsive marketing website while establishing a unified design language that could scale beyond a single product. Alongside redesigning the website, I created a design system that standardized visual foundations, reusable components, design tokens, and documentation, enabling greater consistency and a smoother collaboration between design and engineering.
Client
TDS Telecom
Role
Senior Visual Designer
Duration
4+ Months
Platforms
Desktop, Tablet & Mobile
Deliverables
Responsive Website, Design System, Component Library, Design Tokens, Documentation, Developer Handoff
The Challenge
01
The existing experience lacked consistency across pages and offered little scalability for future enhancements. The project required redesigning the website while simultaneously creating a design system that could support future products and accelerate development.
Redesign the entire website for desktop, tablet, and mobile
Create reusable components instead of page-specific designs
Establish a scalable visual language
Build a design system while development was already underway
Improve accessibility, usability, and consistency across the experience
Process
02
1. UX Audit & Discovery
2. Information Architecture & Layout
3. Responsive UI Design
4. Design System
The project followed an iterative workflow involving design reviews, stakeholder collaboration, and close coordination with engineering. Every decision was validated across all responsive breakpoints while ensuring components could be reused within the design system.
Website showcase
03
Before
03
After
The redesigned website introduced a cleaner visual hierarchy, improved readability, consistent layouts, and responsive interactions across desktop, tablet, and mobile.
Responsive Design
04
Every page was designed responsively instead of adapting desktop layouts afterwards. Components were built to scale naturally across all breakpoints.
Design System
05
Alongside the website redesign, I created a comprehensive design system that standardized UI patterns, visual foundations, reusable components, and implementation guidelines. The system was designed to improve consistency, accelerate future product development, and simplify collaboration between designers and developers.
Design System Highlights
06
Foundations
Color, Typography, Spacing, Grid, Elevation and Icons.
Components
Reusable responsive components with variants and interactive states.
Design Tokens
Variables powering colors, spacing, typography, radius and layouts.
Documentation
Comprehensive guidelines, annotations and implementation references.
My Contributions
07
I was responsible for:
UI Design
Responsive Design
Design System
Design Tokens & Variables
Component Architecture
Component Documentation
Accessibility
Design QA
Developer Handoff
Cross-functional Collaboration
Gallery
Outcome
08
Responsive Design
Complete experience designed across desktop, tablet, and mobile.
Scalable System
Component library and design foundations.
Developer Ready
Comprehensive documentation and implementation guidance.
Future Ready
Scalable architecture supporting future website growth.
Reflection
09
The project demonstrated the value of designing a product and its design system together. Building reusable foundations alongside the website ensured long-term consistency, simplified implementation, and created a scalable framework for future digital experiences.
Next Case Study
{Your Next Project Name}
