All projects
Interactive Map for Živý Josefov
Areas:
UI/UX Design
Culture
Tools:
Figma
Client
Creative Dreamers Production s.r.o.
Year
2025
Summary
The goal of the project was to design a comprehensive user interface and user experience solution for an interactive map on the Živý Josefov website. This map serves as a user-friendly tool for exploring the historic district of Josefov and navigating to various points of interest.
The project encompassed designing the map controls, sidebar, and responsive versions. Additionally, an interactive prototype was created for presentation to the client. To facilitate implementation, a UI kit was also developed, which served as the foundation for developing the map itself.
About
"Living Josefov" is a project focused on the restoration of the fortified town of Josefov.
The project’s visual style was created by Creative Dreamers and is based on the town’s characteristic color scheme—particularly the combination of brick red and white. The map is based on an illustration of the historic part of Josefov, which was also created by the Creative Dreamers team.
The goal was to create a modern and intuitive digital interface that would naturally complement this illustrative visual style and allow visitors to easily navigate the map.
Problem
The main challenge of the project was to design a user interface that would be:
intuitive for browsing a large number of points of interest
visually consistent with the project’s illustrative style
fully responsive and customizable, since the solution was designed as an embeddable element for websites
Solution
Controls were designed for the map itself to enable navigation, zooming, and interaction with individual points of interest. A key element of the interface is the sidebar, which is used to browse individual locations on the map.
Points of interest are organized into categories in the panel and can also be searched. This allows users to quickly find a specific location or browse locations by type.
Clicking on a specific point of interest displays the object’s details, which include, for example:
opening hours
phone number
address
the option to open navigation in a map app
photos
a description of the location
relevant links
The interface was designed to be fully responsive so that it works well on both desktop and mobile devices. It was also optimized to be easily embedded into various parts of the website.
The project also included the creation of an interactive prototype, which was used to present the solution to the client and to validate the user flow prior to implementation.
A UI kit was also created for development purposes, containing individual map components, typography, colors, and other elements necessary for consistent implementation of the interface.
Results
The project resulted in:
a complete UI/UX design for an interactive map
a responsive interface optimized for both desktop and mobile devices
an intuitive system for browsing and searching for points of interest
an interactive prototype for presentation to the client
a UI kit to facilitate implementation and further development of the project
Key Takeaways
The project presented an interesting challenge in the form of designing a user interface that had to combine a visually striking map illustration with a modern and functional UI.
It was also important to design a system that would allow users to quickly work with larger amounts of information while maintaining the clarity of the entire interface.