The Spanish business daily Expansión requires a redesign of its application to optimise user interaction with the app. This change must be implemented in both operating systems, iOS and Android.

This project was developed in close collaboration with the UX team, who, after thoroughly analysing stakeholder needs, created functional prototypes. These prototypes were based on fundamental usability principles, with a clear focus on user experience. The goal was to ensure that the redesign would significantly improve user interaction and satisfaction with the application.

The design system of the application is based on the look & feel of the newspaper's website. This approach ensures consistency in visual and functional communication between the two platforms, allowing for an integrated user experience. By aligning the design of the app with the visual identity of the website, users feel more connected and identified with the brand, thus reinforcing their bond with the newspaper.

For the development, specific design guides for each operating system were used as a reference, such as: Human Interface Guidelines y Material design.

In addition to the fundamental design principles for the development of an application, it is crucial to consider an essential aspect: accessibility in terms of colour contrast for each element. Contrast accessibility ensures that all users, including those with visual impairments, can interact effectively with the application.

To assess and ensure that colour contrasts comply with accessibility standards, a specialised tool is used. A valuable resource for this task is WebAIM, which allows you to check contrast levels and verify that they are appropriate for all users. Implementing these practices ensures that the application is inclusive and meets accessibility requirements.

The design system is composed of several key elements that together ensure a coherent and effective user experience. These elements include:

This end-to-end design system ensures that all visual and functional aspects are aligned, facilitating a consistent implementation and optimised user experience across all platforms.

Below is an interactive prototype that illustrates some of the key functions integrated into the app's navigation. This prototype allows us to explore how users will interact with the various features of the app, including navigation between screens, access to key functions, and the overall flow of the experience.

By interacting with this prototype, a detailed view of the structure and functioning of the application can be obtained, providing a clear understanding of how the functionalities will be implemented in the final product.

To adapt the application to users' preferences in terms of viewing mode on their mobile phones, a specific visual layer has been implemented for dark mode. This adaptation ensures that the application offers an optimal and comfortable user experience in low-light environments, reducing eye fatigue and improving readability.

The entire colour palette, contrasts and visual elements have been adjusted to ensure that the content is clear and accessible in dark mode, while remaining consistent with the visual identity of the application.

The navigation project of the Expansion app is available for viewing and downloading in the app shops. You can explore and test the design and implemented functionalities by accessing the app through the following platforms: