MOBILE APP DESIGN
WEB DESIGN
UX Result
The redesigned QuiLivorno app now offers an intuitive and efficient news-reading experience tailored to the needs of Livorno residents. By restructuring its information architecture, improving navigation, and implementing a scalable design system, user engagement and satisfaction have significantly improved. The app now provides a seamless, accessible, and customisable experience for all age groups.
Project Context
QuiLivorno is a local news app designed to deliver timely and relevant information to the residents of Livorno, Italy. The original app struggled with unclear navigation, an undefined user flow, and low engagement, which limited its effectiveness as a news platform.
Identifying Challenges
Unstructured Information Architecture: Users struggled to find relevant news due to a lack of categorisation and logical organisation.
Unclear User Flow: The navigation system was unintuitive, making it difficult for users to locate important updates.
Low Engagement: The app failed to provide an engaging experience, leading to decreased retention and lower interaction levels.
Setting Objectives
Enhance Information Architecture: Implement a organised structure that enables quick and effortless news discovery.
Improve Navigation: Create a user-friendly interface that allows smooth transitions between categories.
Boost Engagement: Design interactive and visually appealing elements to encourage user interaction.
Develop a Scalable Design System: Build a reusable framework that can be adapted by other local editorial platforms.
Ensure Accessibility: Optimise the app for users across different age groups and enhance usability across mobile devices.
Research & Insights
Preference for a Clean Interface: Users wanted a distraction-free reading experience, emphasising clarity and simplicity.
Importance of Fluid Navigation: Participants expressed frustration with the existing navigation and requested a more structured approach.
Need for Readability: A strong visual hierarchy was crucial, particularly for older users or those unfamiliar with digital platforms.
Desire for Personalisation: Many users sought customisation options to tailor their news feed to their interests.
Design Process
Structuring the Information Architecture
Created a hierarchical categorization system for news content.
Implemented a tagging system for filtering articles based on user interests.
Optimized backend content delivery to improve loading times.
Wireframing and Navigation Testing
Developed low-fidelity wireframes to establish an intuitive navigation layout.
Conducted usability testing with real users to refine category placement and overall user flow.
Establishing a Scalable Design System
Designed a modular UI system with reusable components.
Defined typography and color guidelines for visual consistency.
Ensured the system was adaptable for other regional news apps.
Implemented Solutions
Optimised Reading Experience
Established a clean visual hierarchy with well-structured headlines and improved typography.
Reduced unnecessary elements to enhance focus on content.
Intuitive Navigation
Introduced a simplified navigation bar with clearly defined categories.
Integrated a filtering system for personalized news curation.
Reusable Design System
Developed a scalable UI kit for consistent design across editorial platforms.
Ensured easy implementation for future news apps.
Accessibility Enhancements
Implemented WCAG-compliant design elements for readability and usability.
Optimized for both iOS and Android devices to ensure cross-platform compatibility.
Conclusion
The redesign of the QuiLivorno app successfully transformed the platform into an intuitive and engaging local news source. By focusing on structured information architecture, clear navigation, and accessibility, we significantly improved user experience and engagement. Additionally, the scalable design system enables other regional publishers to adopt the same framework, ensuring a consistent and high-quality news experience for local communities.
The new QuiLivorno app now empowers residents of Livorno with quick, seamless access to relevant news while providing journalists with an efficient platform to highlight key stories. The redesign serves as a model for local news platforms, setting a new standard for digital editorial apps.