PNUD Perú
Client: PNUD
Role: UI Designer
Year: 2019
The United Nations Development Programme (UNDP) is the United Nations' global development network. It promotes change and provides countries with access to the knowledge, experience, and resources needed to help people build a better future.
Project Goals
Design an adaptable interface for the Territorial Planning module, prioritizing information accessibility and seamless content integration. The design should project an attractive and modern aesthetic, while maintaining intuitive navigation, specifically designed for professionals such as cartographers and direct users who require precision, agility, and clarity in data access.
This design wanted to project a modern and professional aesthetic, generating a balance between geographic exploration and informative content. The layout remains clear and direct, avoiding visual distractions to facilitate user understanding.
Big attention was paid to the legibility of each component, from taglines to buttons, prioritizing a quick connection with the user and reinforcing the page's communicative purpose.
One of the main challenges was adjusting the content and exploring different presentation and interaction strategies so that the information was not only visually appealing but also accessible and easy to understand.
Another key aspect was preserving the visibility of the interactive maps. To achieve this, strategic alternatives were chosen for the positioning of items and components, avoiding overlaps or visual interference.
I was also tasked with creating an infographic map of the country that would project the most relevant issues and/or disasters by region. For this task, various animated illustrations were developed that represented each current situation in a direct, dynamic, and visually expressive way.
These icons not only serve a representative function but also act as connectors to specific external sections of the internal website.
Secondary brand colors were used, as the goal was not to establish a direct association with the commercial branding. Also, the applied palette sought to generate a "nature" tone.
Popups, modals, and tooltips were key resources for optimizing space, maintaining map visibility, and organizing content efficiently. Additionally, scrolling functionality was integrated into these elements, allowing for better customization of the information distribution within each component.
The design was made exclusively for desktop use, considering that access to the platform is restricted and limited to internal company use. Adobe XD was used as the primary tool for building wireframes and interactive prototypes, and Adobe Illustrator was used to create graphic assets, icons, and illustrations.
