Placar UOL
A soccer app designed from the ground up to handle all types of tournaments, starting with the 2018 FIFA World Cup and evolving with accessibility improvements.
Context:
Placar UOL is a soccer app that covers major Brazilian and international championships. The app was outdated, built in Objective-C, and lacked the flexibility to handle different types of tournaments, especially the 2018 FIFA World Cup. After the World Cup, the app needed to continue serving users for other championships.
Project Overview
Objective:
Redesign the app in Swift to provide comprehensive coverage of the 2018 FIFA World Cup, including live updates, notifications, and news.
Adapt the app to handle other championships, ensuring it remained modular, scalable, and user-friendly for future tournaments.
Duration:
2017-2019
My Role:
Led the user research process, conducting interviews and analyzing user data.
Designed the user interface and user experience, focusing on modularity and accessibility.
Collaborated with front-end and back-end developers to implement the new app in Swift.
Key Contributions:
Redesigned the app to be modular and scalable, allowing for easy updates and customization.
Introduced real-time notifications and personalized content to improve user engagement.
Ensured the app was accessible to all users, including those with visual impairments.
Outdated Technology:
The app was built in Objective-C, making it difficult to maintain and update.
The navigation was not optimized for different types of tournaments, especially those with knockout stages.
The Problem
User Experience Issues:
The app lacked modularity, making it hard to add new features or adapt to different tournament formats.
The interface was not user-friendly, and the app struggled to provide a seamless experience for soccer fans.
2018 FIFA World Cup:
UOL needed an app that could provide comprehensive coverage of the World Cup, including live updates, notifications, and news.
Post-World Cup Challenges:
After the World Cup, the app needed to adapt to other championships, requiring a flexible and scalable design.
Phase 1: World Cup MVP
Modular Design:
The app was designed from the start to be modular, allowing for easy updates and customization.
A card-based interface was implemented, enabling the app to handle different tournament formats and features.
World Cup UI:
The first delivery focused on the 2018 FIFA World Cup, with a specific UI tailored for the event.
Features included live updates, real-time notifications, and personalized content for users following their favorite teams.
Plan B:
A backup plan was in place to ensure the app could deliver the World Cup coverage even if some features were not fully ready.
This included a simplified version of the app that could still provide core functionality.
Process
Phase 2: Expanding to All Championships
Post-World Cup Adaptations:
After the World Cup, the app was expanded to handle other championships, including Brazilian leagues and international tournaments.
The modular design allowed for easy updates and customization, ensuring the app could handle different tournament formats.
Ongoing Improvements:
New features were added based on user feedback and analytics data, such as more detailed match statistics and enhanced customization options.
The app continued to evolve, ensuring it remained relevant and useful for soccer fans.
Phase 3: Accessibility Improvements
Voice-Over Support:
The app was updated to include voice-over support, making it accessible to users with visual impairments.
All text and interactive elements were optimized for screen readers.
Color Adjustments:
The color scheme was adjusted to improve contrast and ensure the app was usable by colorblind users.
A new palette was introduced to enhance readability and visual appeal.
Responsiveness:
The app was optimized for different screen sizes and devices, ensuring a consistent experience across platforms.
The interface was refined to be more intuitive and user-friendly.
Real-Time Updates:
Users could receive live updates on matches, including scores, goals, and other key events.
Notifications were customized based on user preferences, such as following specific teams or tournaments.
Solution
Modular Design:
The app was built using a card-based interface, allowing for easy updates and customization.
New features could be added or removed without requiring a full app update.
Accessibility:
The app was designed with accessibility in mind, including support for voice-over and improved color contrast for colorblind users.
The interface was optimized for low-vision users, ensuring that all content was easy to read and navigate.
Customization:
Users could follow their favorite teams and receive personalized content, such as news and match updates.
The app allowed users to customize their home screen, prioritizing the content they cared about most.
Improved User Experience:
The new app received a 4.6 rating on the App Store, up from 3.7 for the previous version.
Users praised the app for its modern design, real-time updates, and ease of use.
The Impact
Increased Engagement:
The app saw a significant increase in user engagement, with more users staying on the app for longer periods.
Notifications for match events drove higher user retention and engagement.
Scalability:
The modular design allowed the app to easily adapt to new tournaments and features, ensuring it could grow with user needs.
Accessibility:
The app became more inclusive, with features like voice-over and color adjustments making it accessible to a wider audience.
Modular Design:
This project taught me the importance of designing for scalability and flexibility. By creating a modular app, we were able to easily adapt to new features and user needs.Accessibility:
This was my first deep dive into accessibility, and it reinforced the importance of designing for all users. The app’s accessibility features were well-received and set a new standard for future projects.User-Centric Design:
By focusing on user needs and pain points, we were able to create an app that truly resonated with soccer fans. The positive feedback and increased engagement were a testament to the success of this approach.