Building Better Foundations
Changing The Experience of Bygglovsportalen
Client
Bygglovsportalen.se
Team
10 UX Designers
My Role
UX Researcher
UI Designer
UX Writer
Project Span
September-November
10 Weeks
Summary of The Project
The company Bygglovsportalen wanted to expand their business by creating a collection portal for everything needed to go through the building process in Sweden. They needed to expand their website and services to better fit the needs of the people doing building projects that are confused and lost about the process.
The result was an improved version of the website structure, as well as writing, where the focus shifted from selling to guiding the user through the process to get them to feel more secure. Having the information in a better structure, as well as working on the UX Writing to better inform where on the website they can find help and how Bygglovsportalen can do just that.
The Challenge
Bygglovsportalen approached me to expand their current services regarding helping the average person doing building projects. The company wanted to create a better experience of their website, that would lead to more users entering and buying products from them.
2%
of 2000 monthly visits lead to purchase
5%
of 2000 monthly visits lead to contacting a
contractor
When I entered the project, the economic model only included creating and selling documents needed for the Swedish building process, as well as being a contact point for contractors in the building process.
Looking at the analytics, only 2% of all the visits to the website lead to purchase of documents, and only 5% of visits lead to contact of a contractor. There was a clear need for improving the flow of reaching these products. I was therefore put in charge of redesigning the original website.
Initial User Tests
First look at Bygglovsportalen
When I first started clicking around in Bygglovsportalen’s website, I immediately found a couple pointers. To confirm my suspicions, I lead simple user tests where I let the user click around on the website and tell me their initial thoughts. I guided them with simple prompts, such as “Find information about the building process”.
Occuring Problems With The Website
“The landing page is like “Sell, Sell, Sell!” and isn’t explaining what it is. Or why I need it”
“The website doesn’t feel trustworthy to me… [in regard to the design]”
“Wait, pay? I thought it was free, I didn’t see a price before”
First, The Hypothesis
With the original tests in mind, I came up with these hypotheses on what was needed to improve the website.
Research Phase
First Hypothesis
The feeling of trust will come when visuals and the information structure is more cohesive and easier to follow
Second Hypothesis
Being able to be guided in a journey will make the process easier and the user will feel more secure.
Interviews
With the research, I wanted to focus on how people interact with the building permit process, the expectations of it, and where people get confused or lose trust in the process. Due to the nature of users probably only going through this process once in their life, I decided to focus on both people who have entered the building permit process before, and people who haven't to get a broader view over the subject.
8
3
5
Interviews in Total
Has Applied to A Building Permit Before
Has Never Applied to A Building Permit Before
Our Three Insights
“Users that haven’t entered the process of getting the building permit trust authority (municipality, building companies), while the people who have been in the process have lost trust for them.”
“Trust in the permit process boosts confidence through getting positive feedback, clear guidance, and emotional support, while unclear communication or lack of human support reduces trust.”
“The user wants to know everything they need to do to apply for the building process, however in the process they are overloaded from the amount of information because of the lack of accessible information and help.”
My Deep Dive Into Trust
Trust is important and mentioned a lot during the interviews, so I decided to take a deep dive into what trust really was. I managed to gather three points that fit what people had been saying so far.
Reliability
Transparency
Human Connection
Trust is…
Trust is…
Trust is…
Ideation-Workshop @ Aude’s
To kick off the design process, we decided to do a full group workshop that spanned over two days! This was a combined ideation session and group activity to get closer to each other!
Dreaming Big!
Ideation
In the ideation process we went through using the Disney frame work called "The Dreamer, The Realist and The Critic". The first day, we mainly focused on the Dreamer part, which meant generating ideas. The second day was about the feasibility of the idea, so the Realist, and then the Critic, which was about challenging and solving the ideas.We separated into small groups of two to cover more ideas and then we presented our work. In between each step, we clustered similar ideas to lower the number of ideas.
Criticize It Down
Based on the user’s wish for guidance and clarification, the final ideas were:
Creating a UX Writing guide,
Changing the front page to be more guiding language as well as presenting what the website will solve more clearly,
A chatbot,
And an underlining system where difficult words would be explained.
Prototypes A’Plenty!
Once the ideas were decided and finalized, we started prototyping to set up for user testing our designs and ideas. The course I was studying at the time demanded that I finish the prototypes fully done before testing, in addition to time constraints made it so we could only test them once.
Landing Page
Product Page
Chatbot
Contractor Page
Underline Function
And Then We Did User Tests
15
9
6
Results of the user test where
Chatbot isn’t as attractive as we thought, and we should put more effort into making it accessible to contact customer service instead.
Navigation was still quite tricky for the user, the wording wasn’t quite correct in our texts.
The underlying system was hard to find for users, and needed prompting to find. It wasn’t something they looked for instinctively.
Prices were still too hidden, not clear enough.
User Tests in Total
In Depth User Tests On Prototypes
Preference Tests on Designs
Client Came To Visit
The client was kind enough to drive down to have an in person workshop with us, where we could better align on the final design and changes made to the website. During the workshop we did:
A user test with the client present so they could see how we worked, they could also ask the user questions.
Brainstormed Landing Page features
Brainstormed Chatbot design ideas
Card Sorting for Navigation
And Then We Decided To Make Changes
Easier navigation. Change navigation bar, buttons with easier names and icons to easier navigate, and in some cases add icons and use text at the same time.
Even more clearly state the prices when available. It isn’t possible for offers from the contractors, but making the prices even more available for documents was viable.
Make the chatbot more visually attractive and more inline with the client’s vision of it.
Change the underlining system to a questionmark button instead, to make it more intuitive for the user to understand that they can hover
Decided to work more on the Copy and UX Writing, to really make the website easy to understand.
Introducing A New Design System
After the changes we made to the wireframes, I put in focus onto creating a comprehensive design system to make sure the changes would take as little time as possible. Previous solution had two colors, we expanded it with colors to be more inspired by building and nature and felt a bit more vibrant.
Setting up for Design
Learning UX Writing From The Ground Up
With users being confused about how to navigate complicated terms and parts of the processes on the website, we decided to make a UX Writing guide for the designers to follow. With the feedback about complicated terms and loss of agency, we created the UX Writing Guide to simplify the process as much as possible, allowing the user to feel secure and yet be in control as much as possible.
We created the guide from both the feedback from the user tests, as well as the previous established brand persona, which we got from the client. The result became this!
Original ColoursNew Colours
Final Design
With the final result I updated gave Bygglovsportalen a UX Writing Guide for them to follow, as well as a website more designed to garner trust and guiding the user better than the first version, having transparency in the forefront of the design choices.
Underlining System
Chatbot Design
Results
Bygglovsportalen was really happy with all our work, and was prepared to send it to the developers as soon as it has gone through a new round of texting and fixing, as we recommended.
Personal Reflections
Next Steps
The next step for the client is to look through our designs and start asking their developers to start working on coding my ideas into the website.
Due to time constraints, we never tested our final design to assure our design quality, so I requested the client that they should run more tests on the final design.
I also requested that they set up Google Analytics in a way to make it easier for you to get information about paths the user takes and if they buy products/contact third party actors etc.
-
One of the biggest lessons I learned was that the inclusion of the client's ideas are good, but they should be considered as early as possible in the process. With how this course was structured, it was not allowed to start on the design process until the research phase was done, and with time constraints for the client, we could only hold the workshop until late in the process. A lot of ideas came up that we didn’t have time to implement in the design the way we wanted.
-
Another one was the navigation with a really large set of people that takes a lot of trust in each other, as well as being able to jump in where you are needed. This project I jumped around a lot in different areas to cover where I was needed, and I feel like having a broad understanding of every part is just as important as a really good understanding of your specific area is much more sufficient. While I like doing my own thing, I also appreciate the entire view of the project, and how all pieces fit together. Maybe I’m more fit for a managing position, as some teammates told me.
-
UX Writing takes somehow less and more work than I thought. As someone that has a background in copywriting, this felt like coming home. But where copy lets you be more creative, UX writing took a whole different skill set with the focus of guiding the user more than making it attractive to use. The biggest take away from UX Writing is to have both fun, but be careful with it.