Your needs, Your combo — Create a Telecom package that fits you
Vivo is one of Brazil’s largest telecommunications companies, and this project was designed to serve as a central hub where customers can explore and purchase individual or combined telecom products tailored to their preferences.
The platform offers flexibility, allowing users to either choose from pre-made combos or create personalized combinations across three categories: phone, cable TV, and internet.
Additionally, users have the option to purchase products individually, such as cable TV, phone, or internet, providing a fully customizable experience.
Understanding the Problem
Vivo, a subsidiary of the Spanish telecommunications company Telefónica, is the largest telecom provider in Brazil, offering services in mobile telephony, broadband internet, and pay-TV.
As of 2023, Vivo serves approximately 100 million customers across Brazil, making it the market leader in the country. The company’s strong presence and continuous innovation in digital services and technology have been key to its success.
Customers often face challenges in choosing the right telecom product combination to fit their specific needs—particularly because most plans do not offer customization options.
Our goal was to develop a platform that provided users with a clear and flexible way to explore and purchase products, whether they preferred pre-made combos or wanted to create their own unique solution.
Vivo’s Product Team had already identified some issues with the “Build Your Combo” flow on their website. When I joined the team, a previous designer had created initial screens, but the flows were incomplete and didn’t account for many scenarios. This required us to take a step back, map out what was missing, and review the existing designs to ensure full coverage of all use cases.
Responsibilities & Tools
— Research & User Testing
— Product Design
— UI Design and creation of Prototypes in Sketch
— Visual design & Art Direction for marketing assets
— Creation of Wireframes in Axure
— Design System Development
Tools used: Sketch, Invision, Axure
Design Process
— Stakeholder Workshops & User Flow Mapping:
We kicked off the project with workshops alongside stakeholders to align on goals and understand the needs of the business. We then mapped out the user flows, first during the meeting using post-its and then using Axure to create wireframes and prototypes that represented the different scenarios and user paths.
— User Interface & Prototyping:
Both mobile and desktop versions were developed in Sketch, with a total of 240 screens across multiple resolutions. User flows and scenarios were carefully mapped to ensure ease of navigation, and we created designs that represented each interaction step on mobile and web.
— User Testing & Iterations:
Prototypes were created and tested with real users, gathering feedback through usability interviews. These findings helped us refine the design, improve usability, and address any pain points users encountered during their journey.
— Collaboration & Development:
Throughout the project, I collaborated closely with the product team to define the business rules for this project, a development team to ensure that the design was implemented accurately and a UX Writer to ensure that the Brand tone was consistent.
I focused on the UI design, while my pair, Carmen de Andrade, concentrated on the UX aspect. Despite our specific focuses, we both participated in all stages of the process, ensuring a holistic approach.
— Design System:
We utilized Vivo’s Design System, making adaptations and creating new components as needed. All newly created components were reviewed and approved by the Design System Team.
Solution
The Build Your Combo platform offered a flexible, user-friendly experience that empowered customers to create their ideal telecom combinations. Below are some of the key features:
— Customizable Combos:
Users could choose from pre-made combos or create personalized combinations across phone, cable TV, and internet categories.
— Information on Channels and Products:
Detailed descriptions of all available services and channels were provided, making the selection process easier and reducing confusion.
— Individual Purchases:
Customers could purchase products individually, such as cable TV, phone, or internet services, depending on their needs.
— Mobile & Desktop Compatibility:
Over 240 screens were designed for both mobile and desktop, ensuring a consistent experience across devices. At the time, the product was accessible via Vivo’s main website (the current design has since been updated as of 2023).
— User-Centered Design:
The platform was developed and iterated based on extensive user testing, ensuring it aligned with customer needs and preferences.
Through workshops, testing, and close collaboration with the development team, we simplified decision-making and gave users control over their purchases.
All work displayed on this page, including designs, text, and images, is the intellectual property of Vivo and its associated companies. Unauthorized reproduction, distribution, or use of any materials without explicit permission is strictly prohibited. All interface text was written by Vivo.
For this project, I was part of Accenture’s team within Vivo, collaborating closely with my partner, Carmen de Andrade.
— Date: June/2018 — March/2019
— Platforms: Web responsive app
— Language: Portuguese
— Learn more: vivo.com.br