Overview
An application for the smart working citizens of Milano provided by the municipality to offer vacant buildings and multipurpose spaces. Citizens can browse spaces based on different space types, work modalities and amenities. La Chiave also highlights the sustainability of spaces, expressed through a “Green Score” based on international standards like air quality, carbon footprint, energy efficiency, or decibel levels.
Challenge
How can a platform be developed for citizens of a given neighbourhood to have remote working spaces offered by companies that are located in the same neighbourhood, avoiding going to the office but having adequate connections and infrastructure?
Role
UX Research, wireframing, UI design, user flows, prototyping. usability testing, report writing, video editing
Tools
Framer, Figma
Project Collaborators
Intellera Consultancy and 4 group members
Year
2022
Methodology
An iterative process where all steps were recurrent and informing future steps whereas any discoveries in ascending steps informed iterations of the previous steps in the process.
What is La Chiave?
La Chiave is the key to opening up workspaces around you, and is developed to match
municipal supply with people’s demand for smart working. It is a public service that offers Milanesers a change of space between working from home and their office by letting them browse available workspaces in the community, suggesting sustainable alternatives.
Research Outcomes
The starting point for this project was to understand how concentrated the requirement is within a region of Milan. In order to address the sustainability pov we started off by focusing on the pedestrian access to POI in 15 Minutes within Milan region.
Furthermore, research on relevant criteria for coworking spaces was essential to define the amenities and space type to users within the service and cater to their needs from the space.
Who
Citizens of Milan, Municipality
bridge the connection between citizens and municipality
What
Provides Milanesers with a sustainable
smart working alternative
Let citizens browse spaces provided by municipality
Why
Match demand and offer, unproductivity at home, stronger community
Sustainable offices, adequate facilities, connection between citizen and municipality
Market Analysis
This phase helped find design opportunities amongst existing solutions and positioning our service.
Design Objectives
For outlining the objectives for La Chiave we had to take into consideration of values and needs of our two main stakeholders: the smart working citizen and the municipality officer. Therefore, through interviews with our stakeholders we developed a core region of vlaues to bring through our solution.
User Journey
Defining Information Architecture
The initial information architecture was deduced from the tree testing results and later developed after final wireframe testing results. To improve on the usability, we actually defined the information architecture while simultaneously designing wireframes. We based all of our architecture and wireframes on the shortlisted tasks we already tested with tree testing.
Information hierarchy:
navigation
actions
nested functions
Testing 4 tasks:
1. filtered search
user freedom
help & support
settings
Hints:
1. different entry point for the same functions
revert to standard actions
Testing and iterations
Development from first paper sketches to high-definition interactive Framer prototype.
Our process was a mix between Waterfall and Agile, with heavy reliance on iterative design, but checkpoints used for validation where we moved on to the next development phase.
Crazy 8
We divided different screens of the app based on menu e.g. home, settings, map etc. and did quick wireframe sketches using crazy 8 !
Lo-fi prototype
We used this for validation of structure of information architecture and for initial testing of prototype to collect user feedbacks.
Testing
Used heatmaps for a number of tasks to evaluate the user experience. We were able to review user flows for each task and evaluate where the frictions existed. Moving forward, the next set of wireframes focused on limiting these frictions in interactions.
Apart from user tests feedback, we also got the chance to meet with our client and get feedback on the wireframes. According to their feedback, we removed the membership, payment and money aspects of the application. Our client wanted the focus to be on strengthening the link between the community and municipality and be able to provide services to the public without additional marketing or a fee attached to it.
Design System
From strolls through Milano, we learned what colours, shapes and textures define the city, and abstracted and extracted them for the screen.
We used colours of Milano, to emphasise the connection between our service and the city we operate in. If we expanded to future cities and regions, we could adapt the interface accordingly.
Interactive prototype
Try the La Chiave Hi-fidelity prototype!
Client Review
Link to ‘Community’ in bottom menu
Increase direct connection links to municipality
Approved recognisable Milan color palette
Peer Review
Enlarge tap targets
Differentiate between rating types
Make interactions consistent
Show contextual info only
These insights from user tests were then addressed in improving the user interaction for the current version of the application. The aim of implementing these redesign insights was to improve user experience with the application. Amongst our next steps for the study we aim to run a second test on the improved version and record user feedback and keep improving upcoming versions according to style and interaction needs.
Project Report
Read through the process in detail including the in depth understanding of the client needs, user research, service, concept and problem solving techniques.
View other works
Let's work together!