A master thesis project focused on increasing renovation rates in Germany through architectural solutions and a web app. This page highlights the interface design.
Encouraging homeowners to choose renovations through a user-friendly digital interface while ensuring it benefits building experts and supports government goals for sustainability.
Due to the lack of app-specific reviews, I explored customer pain points by analyzing discussions and feedback from internet threads to better understand their needs and challenges.
KfW Sanierungsrechner
An existing website application to roughly calculate the renovation cost.
Pros:
Collects simple data from users and provides improvement ideas like adding insulations, HVAC improvement, Windows, doors, rough estimation of costs and saving over long term.
Cons:
Since the cost estimations are given out, it would be nice to know the how long a material might last, which is missing in the calculation.
Observation:
I analyzed the user flow and found a major issue: the process is fragmented.
Cost estimation happens in the app, but users must handle other steps, like finding experts and filing loans, separately. The service lacks integration.
Die Hauswende
Pros:
The website takes through how to do small self -renovations around the house for users.
Cons :
The steps are all written wordy and step by step videos or images would be of great help.
TABULA Web tool
Pros:
Could find the typical building details and the ways to improve the performance of the enclosure, HVAC and Warm water solutions.
Cons:
It is much more difficult for common people to understand in first glance due to the user interface which is not so friendly. Also, the cost involved in these renovations are unknown.
I created a potential user persona to better visualize the target audience, streamline service design, and identify pain points effectively.
By mapping the user experience, I identified opportunities to uncover pain points and gaps in the process
- Interrupted long process
- Overuse of technical words
- Repetitive information
I generated feature ideas to enhance the app and organized them as titles. Then, I card sorted user feedback against these features for better alignment.
I mapped the features based on their importance and feasibility into four quadrants:
Step 1: High importance, easy feasibility
Step 2: High importance, hard feasibility
Step 3: Low importance, easy feasibility
Step 4: Low importance, hard feasibility
For the stage 1 development focused on the step 1 features.
- Fully integrated processes within a app
- Step-by-step guidance for simplicity
- Intuitive and familiar user interfaces
Ensuring the new user flow integrates all key processes like contacting expert or options to bank and information seamlessly within the app.
Designed an information architecture that allows users to:
- Create and save projects for future use.
- Input essential data about the building, site, and surroundings for accurate solutions.
- Explore improvement options with detailed documentation or instantly view results based on key data.
I translated the information architecture steps into rough screen layouts to visualize the flow, ensuring:
- Seamless integration of key processes
- Clear component placement for usability
- Logical transitions between steps
- Intuitive user interactions
I identified common components from the sketches to ensure reusability and created wireframes that:
- Replicate shared components for consistency
- Streamline the app flow for better user experience
- Ensure logical navigation across all screens
The Homepage enables users to:
- Create and save new projects for future access.
- Resume work on saved projects anytime.
- Ensure continuity without losing progress.
- Essential data inputs are broken down into key steps for a smooth process.
- Top progress bar helps users track completion time. Guided flow ensures users provide necessary details efficiently.
- Goal-based selection replaces long forms for a streamlined experience
- Pre-filled fields based on selected goals to reduce manual input.
- Simplified decision-making for users to focus on solving their problems efficiently.
- Editable process flow for users with specific needs.
- Option to add more details and variations for precision.
- Ensures accurate estimations tailored to individual requirements.
- Results displayed based on goals, with both standard and advanced ranges.
- Zoom button on title cards provides detailed steps for DIY options.
- Direct contact options for both the bank and experts who provided the solution.